{"id":6779,"date":"2016-12-12T19:11:57","date_gmt":"2016-12-12T19:11:57","guid":{"rendered":"https:\/\/itnigblog.live-website.com\/?p=6779"},"modified":"2020-06-11T13:14:03","modified_gmt":"2020-06-11T13:14:03","slug":"why-you-should-aim-ux-ui-design-at-zombies","status":"publish","type":"post","link":"https:\/\/itnig.net\/blog\/why-you-should-aim-ux-ui-design-at-zombies\/","title":{"rendered":"Why you should aim UX\/UI design at zombies"},"content":{"rendered":"

I\u2019m faced with a design challenge everyday. Sweet! I like it. It\u2019s fun and rewarding to find a solution, if that\u2019s your thing. Like working on a puzzle: finding all the pieces, recognizing what\u2019s their right position, joining them one by one, and finalizing with a composition that only makes sense when everything is together.<\/p>\n

That being said, the pieces of the puzzle don\u2019t have a clear shape or color, and a lot is left to analysis, and interpretation. And you don\u2019t even have a reference of how the puzzle is supposed to look like.<\/p>\n

Probably is not like putting a puzzle together at all. Whatever. Never mind.<\/p>\n

Zie zombies<\/h3>\n

And who is the target? Who is going to end up looking at that puzzle\u200a\u2014\u200aor whatever that is\u200a\u2014\u200athat a UXUI Designer put together? You are. We are. The idle minded. Because that\u2019s what we\u200a\u2014\u200athe users\u200a\u2014\u200aare in the end. Our brains are too busy thinking on what we\u2019re going to have for dinner, where, with who, or if we will have take away on our own again. So when we grab the phone, open the browser, grab the TV remote, we\u2019re not actively thinking. Content. That\u2019s what we want.<\/p>\n

When I first heard about this, the fact that users don\u2019t think, I felt disappointed on human intelligence. But after all, one of the must-read books for product designers is called \u201cDon\u2019t make me think\u201d. Like it or not. We are contributing to feed a whole generation of Zombies. Users are zombies.<\/p>\n

If you think about it, makes a lot of sense.<\/p>\n

They move in big groups, without a clear objective, relying on automatisms and muscular memory, reacting slowly, and paying little or no attention to their surroundings.<\/p>\n

Full attention, not necessary<\/h3>\n

Now, I am not saying that people are zombies. My point is that users are multitasking most of the time they spend in front of their devices. We eat sandwiches, drink coffee, walk around the city, talk to our friends, and listen to music. We even dare to think of more important stuff! Because using an app shouldn\u2019t be cumbersome. After all it\u2019s just a tool. The meanings to an end. And although some tools are far more complicated than others, once we learn to use them we don\u2019t actively read any buttons or labels anymore. We\u00a0know<\/em>where everything is. And when something changes we hate it, because it makes us think and reroute our wirings.<\/p>\n

<\/p>\n

When I started designing websites, which would lead to designing software and interfaces, nobody told me psychology would play such a big role. Yet, we don\u2019t get to play with full functioning brains most of the time, we have to make what we can out of 20% of the user\u2019s attention\u200a\u2014\u200aYes, I made that number up.<\/p>\n

Your users won\u2019t be reading half of the labels, nor what the buttons say. They will type in what they consider that should be typed in, wherever they consider its supposed to be. And they will click that big chunk of color that looks like a button, and will always click and tap on the image, not the text. To make that easy, the design has to avoid possible distractions.<\/p>\n

In order to make a user interface work, we have to strip it out of all the unnecessary. Here\u2019s an example.<\/p>\n

Keeping it simple,\u00a0visually<\/h3>\n

A while ago, I work on a project at Asana. We called it Typography Update. During the redesign many hands touched the interface, and many engineers worked on the CSS. The result was great. But part of the collateral damage of having so many moving parts were little mismatches on font sizes, colors, and spacing.<\/p>\n

So I went on and reduced the number of styles, fixed inconsistencies, and adjusted the margins. I reduced and standardize the body size, the paragraphs, and their line-height. Headings had the same exact style now, in a couple of different sizes for hierarchy. Project names became tokens almost everywhere. Margins became consistent around the objects, and relative to object their size. And different shades of gray for copy were reduced to only two, based on the contrast ratio with the background.<\/p>\n

\n
\n
<\/div>\n
<\/canvas><\/div>\n<\/div>\n<\/figure>\n

When I showed the first results to the product manager she couldn\u2019t see the actual changes. She asked \u201cHow did you do that? You didn\u2019t change anything and it looks way better!\u201d. The multiple styles and little inconsistencies had been adding noise and clutter. Imperceptible. Little by little. Too many instruments going for a solo at the same time. We were making the brain work overtime, and forcing it to think. Not a lot. But more than what was necessary.<\/p>\n

The voices in our\u00a0heads<\/h3>\n

Why was this design more effective and harmonious?<\/p>\n

Each different style is a new\u00a0voice<\/em>\u00a0you add to the chorus that is the interface. Restricting the number of those will make things easier to process for the user, since they won\u2019t have to register yet another\u00a0voice<\/em>\u00a0in their head. A bunch of small disruptions will cause havoc in their visual field. But restrict it too much, and all the\u00a0voices<\/em>\u00a0will be the same.<\/p>\n

My advice then? When adding styles, make them dramatically different. Go from 10 to 14, from blue to black, from regular to bold. It either is really different, or it\u2019s the same. Because zombies can tell a human from a deer apart. But all human are the same to them: just food.<\/p>\n

We are idle minded, our list of priorities is to get what we want, not to understand how we are getting it. We are\u200a\u2014\u200aand want to keep being\u200a\u2014\u200aidle minded.<\/p>\n

So when building a tool, design something that a zombie could use. That is good product design.<\/p>\n","protected":false},"excerpt":{"rendered":"

I\u2019m faced with a design challenge everyday. Sweet! I like it. It\u2019s fun and rewarding to find a solution, if that\u2019s your thing. Like working on a puzzle: finding all the pieces, recognizing what\u2019s their right position, joining them one by one, and finalizing with a composition that only makes sense when everything is together. […]<\/p>\n","protected":false},"author":1,"featured_media":6780,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[10],"tags":[],"class_list":["post-6779","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-technology"],"_links":{"self":[{"href":"https:\/\/itnig.net\/blog\/wp-json\/wp\/v2\/posts\/6779","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/itnig.net\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/itnig.net\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/itnig.net\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/itnig.net\/blog\/wp-json\/wp\/v2\/comments?post=6779"}],"version-history":[{"count":2,"href":"https:\/\/itnig.net\/blog\/wp-json\/wp\/v2\/posts\/6779\/revisions"}],"predecessor-version":[{"id":9229,"href":"https:\/\/itnig.net\/blog\/wp-json\/wp\/v2\/posts\/6779\/revisions\/9229"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/itnig.net\/blog\/wp-json\/"}],"wp:attachment":[{"href":"https:\/\/itnig.net\/blog\/wp-json\/wp\/v2\/media?parent=6779"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/itnig.net\/blog\/wp-json\/wp\/v2\/categories?post=6779"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/itnig.net\/blog\/wp-json\/wp\/v2\/tags?post=6779"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}