Invisible design: why less is more
The hardest-working designers – and some of their best design decisions – are the ones you don’t even notice.
Have you ever been charged down by several tons of wild rhino? I’m guessing the answer is no, so let me share what it’s like.
A few years ago I was trekking in a remote part of Nepal. Our small group had stopped in a clearing for lunch when two rhinos burst in at full pace, one chasing the other. To see something that large and alien-looking move so swiftly seemed unreal, like something from a movie. We ran, and they trampled our temporary camp. After a couple of minutes of circling they moved on and we eventually climbed out of the tree we were hiding in.
But the next several hours walking through the jungle to get back to civilization proved even more nerve-wracking than the event itself. The visceral shock of the moment had thrown everyone’s senses into overdrive, and we all became hyper-aware of our surroundings. Every little movement in the grass tweaked us into a state of heightened alertness. At times I literally imagined I could see tigers peering at me from behind moving bushes.
What a rhino does to a water bottle.
I suppose my brain had reverted to some sort of pre-modern state. As humans we are incredibly attuned to any form of movement, and although you and I don’t often need to be on the lookout for actual predators, our ancestors relied fully on that sense of peripheral awareness to detect imminent danger and ultimately to survive. We’ve inherited that instinct for free, and although it lies mostly dormant it definitely remains a part of us, as I discovered in Nepal.
A great experience is the difference between ‘feels right’ and ‘feels janky’.
As well as the non-design lesson – stay out of the damn jungle, you fool – there’s a design lesson to be learned here. The design lesson is that much of how we process information is founded in the subtleties of human perception. We constantly filter, detect and sometimes imagine different signals from the many inputs our senses provide. And while you don’t need to be a neuroscientist to design a decent webpage, as a designer you should be aware of how things like movement, color and peripheral vision all elicit deeply rooted reactions within the viewer’s brain.
Many of the best digital experiences acknowledge this and are sympathetic to how we react to similar objects in the real world: it’s the difference between something that “feels right” and something that “feels janky”. Even if it’s sometimes hard to articulate why, our senses are deeply attuned to anticipate, detect and react to all sorts of behaviors, and to actually feel anxious when encountering obnoxious or bad design.
This, by the way, is also why a flashing banner ad is so distracting when you’re trying to read: some deep, primal part of your brain is worried that the banner ad might just eat you.
Suspension of disbelief
Of course, designers can play this both ways: either exploit it as a weakness, or work hard to avoid agitating it. It all depends on the response you want to elicit. Film directors make these decisions all the time.
What’s the most impressive special effects movie you’ve seen recently? Some epically overblown space opera? Yet another superhero explosion-fest? The best use of effects I saw in recent years was in a small town drama about a married couple having an extended argument. And the reason they were good was that I never really saw them at all:
Imperceptible visual effects in David Fincher’s Gone Girl
Although our movie screens deliver more than their fair share of giant robots blowing up other giant robots, the more sophisticated visual effects are those that serve a deeper narrative purpose. Rather than drawing attention towards themselves, these subtle effects remain invisible to us on a conscious level, instead contributing to an overall sense of being immersed in a world. The movie folks call this “suspension of disbelief”.
Don’t make me notice what I’m doing. Just make it simple.
In interaction design we might traditionally have referred to this idea as “usability”: don’t make me notice what I’m doing, just make it so simple that I don’t even have to think about it.
A new era of design is now taking that notion many steps further. Great digital products today aren’t just usable. They blend so seamlessly into our daily lives that we can be forgiven for thinking that there’s no product there at all. Just like a special effects technician striving not to be noticed, many of the best designers go to great lengths to have their work just get out of the way.
Three levels of invisible design
This trend can be seen in many aesthetic, interactive and product design decisions.
Aesthetic invisibility
The visual design of our devices and in turn our UIs has continued to reduce in complexity, rejecting most adornment to the point they are little more than well-balanced type framed against an invisible grid structure, displayed on inert black slabs of featureless glass. I questioned how far we’ve taken this reductive trend in UI design in a previous post.
Interactive invisibility
Whereas the software of a decade ago consisted of menus and tabs advertising endless sets of features, today’s apps tend to be navigated via invisible swipes and gestures. Likewise the features themselves have retreated into the background, less a shouty salesperson than a quietly helpful butler. Chromebooks silently update themselves while you sleep, mapping apps automatically recalculate your route when you veer off-course, geofenced reminders pop up at just the right time, Google Assistant dutifully delivers your favorite team’s score, a spell checker silently adds a red squiggly line, Inbox by Gmail gently suggests a handy pre-written reply. In each case, designers worked hard to remove a feature from your line of sight only to surface it at just the right moment.
Product invisibility
This is the most dramatic shift towards invisible design, where complete products or entire categories have moved from demanding notice to being automatic. Uber entices fleets of cars onto the street in anticipation of busy periods. Square knows what store you’re in so that you can pay with a word. Nest continually monitors your environment in anticipation of an anomaly. Fitbit tracks your activity. These products require a whole network of predictive processes running non-stop just to save you the minor inconvenience of a few clicks.
Design around the expectations people have about how the world works.
These products don’t want to be noticed at all. They want to be the background noise to your daily routine, infrastructure working away below the surface just like the underground subways, sewers and cabling of a city.
At a fundamental level, the designers of these products respect how human psychology works. For every clickbait headline or incessant notification that exploits our natural psychological tics and competes for our attention, there are more and more products and services that strive to invisibly integrate themselves into our lives in a helpful, human-centred way.
Indistinguishable from magic
My daughter turned one year old recently, and let me tell you there’s no game in the world that’s more popular than Peekaboo. Hide an object, reveal the object. Endless entertainment.
What’s actually happening here is my daughter is developing many of the cognitive skills that we all take for granted as adults. In the case of Peekaboo, it’s something called object permanence – the notion that just because something is no longer visible doesn’t mean it no longer exists. The fun for her is anticipating that her toy is still there even though I’ve covered it up, and being delighted when it’s revealed again and she’s proven right.
Magicians know all about this. It’s why sleight of hand magic tricks are effective even on adults. Imagine I perform a coin trick for you. Years of experience have taught you that when I place a coin in my hand, it will still be there when I open my hand again. When it turns out it isn’t, I’ve tickled some part of your brain into questioning a fundamental law of the universe that you thought was immutable. It’s entertaining and fascinating, and your mind immediately starts trying to figure out how it was done. Your conscious mind wants to know in order to rationalize how a law you established as a baby has suddenly been violated. How did he do that?
The answer is that the magician practiced. He repeated the trick many times from multiple angles, figuring out how to make each secret move look as effortless as possible. He studied how it normally looks to place a coin, and tried to emulate that motion without actually doing it. Maybe he exploited another of your innate weaknesses by using misdirection (“look, nothing in my pockets!”) to distract you at just the right moment.
The magician practices, the director edits, the designer iterates.
Again there’s a design lesson here. We can design for the fact that our users carry a consistent set of expectations about how the world works. The most obvious comparison is the design of UI transitions, which need to be tweaked and polished to feel completely smooth, natural and in line with our expectation of how real objects behave. Sudden jump cuts and artificial animations result in a jarring experience that grates.
How objects relate to each other spatially should also be grounded in reality. The team behind Google’s Material Design spec considered the depth of a device when designing how UI layers should overlap and cast shadows. The way objects interact inside the screen of a thick TV is different to how they relate to each other inside the screen of a thin phone, because there is more apparent depth for them to do so. Just like the subtle special effects in the background of a movie, it’s unlikely that anybody is going to consciously register this decision, but it helps make the UI seem like it belongs in its environment.
The magician practices, the director edits, the designer iterates. All are working towards a perfectly polished performance that feels effortless and natural to the audience, one grounded in expectations based on reality. All attempt to hide the complex machinations of how something actually works and present a deceptively simple facade. Even the marketing language used to describe digital products – “magical” or “delightful” – suggests a commonality here. Of course, magic tricks are about deception whereas design is often about clarity, but they achieve these different ends through common means.
Don’t make me blink
How something looks, how it moves, reacts to touch, casts light, relates to other objects, how it sounds and feels can all combine to lend a sense of credibility. Humans are a tough audience: when designing, you’re trying to fool someone’s highly attuned brain into thinking that what you’re showing them is real, even in cases where impossible illusions are being performed right under their noses. On the other hand, humans despise complexity and chores, opening up the possibility of services that run continually but invisibly, freeing up people’s brain cycles to pay attention to more interesting things.
What’s your product trying to be? A believable object? An invisible background process that simplifies users’ lives? Or a two-ton rhino charging right at them?