the 3 pixel paradigm shift
Would you buy a house with crooked walls and windows that don't quite close?
If a button is those 3px off, or 3pts, which will make it 9 WHOLE PIXELS on something like an iPhone 6+, most users won’t consciously notice that. But they will feel something is not quite right and that thought will lower their comfort from using the digital product. It’s also true, that people are sadly used to using badly designed products — most of them are in that “sloppy design execution” department and it’s not even frowned upon that much anymore. It should be.
Companies proudly present portfolios in which even the screenshots of apps are obviously very sloppy. And they're proud of it!
Most regular products, especially startups are maybe even expected to be slightly half-baked in the design, as of course every “MVP story” explains. Sure — the product has to work. It has to solve a problem. But should it really look like an unfinished product, just because it’s proving it’s right for existing right now? There are many ways of solving this, ranging from “we don’t care about the details” all the way to “we’ll never release this!”. Here’s how we did it.
HYPE4 is design-centric
Our company was initially created as a design studio. Literally 100% of the initial team were designers. That “design to execution sloppiness” was actually the reason we started hiring developers. But as a design-first company we had to break a lot of previous ideas on how to code digital products (on the front-end part of course, but it was quite a bit of work).
They say old habits die hard but through explaining “why it’s better” and lots of positive reinforcement when they do right, we believe developers can change. They only need to want to change themselves, but I guess we were lucky there. If a developer wants to always face new challenges and expand the skills maybe becoming a designer (in a very basic sense) also won’t hurt.
We began showing our developers badly executed products that are out there and explaining to them what is wrong with that design execution. Do they want to release stuff full of little flaws, just because it’s “good enough”? Didn’t think so.
We started creating styleguides for projects, in which we used easier, developer-ready language to explain the relations of elements (line-height instead of leading is one example). And slowly, each project was a little better executed without extremely affecting the time. When a developer “knows” these things, he does it the right (or close to right) way on his first run.
Of course not to over-obsess it’s always important to remember which things are crucial regarding alignment and typography, and which really are not that important. But that was a lesson we as designers had to learn. It’s an ongoing process, but it’s not stressful anymore. If the goal is to build awesome digital products, everyone has to be onboard with attention to detail.
Let’s hope people take it to heart and understand that if it’s 1px then maybe you can fix it in 1.1. But if it’s 3px you better fix it now ;)
During the Congress in Katowice we didn't have time to answer all the questions, so we're taking the time to do that now.
Grey wireframes are now thankfully long gone from most processes.