Emotive UI
Why designers now have to grapple with the whole messy scope of human emotions.
Historically, emotion has been thought of as a byproduct of design — not something that drives the user experience. But emotion is actually a critical new dimension in UI, and one for which designers are ultimately responsible.
There are certain things designers want you to feel when you use their products, and you can hear it in the way they talk. Designers often say: “We want to surprise and delight our users.” But really, that’s just scratching the surface. Humans are a mess of emotions — and designers are going to have to learn to engage with all of them.
Robert Plutchik, an academic psychologist who (literally) wrote the textbook on emotions, in 1980 introduced the concept of eight basic emotions — joy, trust, fear, surprise, sadness, disgust, anger, and anticipation. His “wheel of emotions” shows the interplay of those emotions, and their varying levels of intensity.
The form of UI that most accurately reflects our emotional spectrum today is emojis. Here’s an emoji-based version of the wheel I created for a recent presentation on Emotive UI:
You can see in the chart that there is a dissipation of intensity that happens as you move further out on the wheel, and in design, nobody is talking yet about that. We currently design things that make people feel basic emotions — maybe joy or sadness — but we don’t talk about how we should adjust the UI according to how the user’s emotions may be intensifying or dissipating.
We tend to create products that aim for the center-wheel emotions, because it’s the easiest thing to convey. We rarely think about the full spectrum, and we don’t think about the dissipation. Currently, most designers think about the design intention and the user reaction: “I want to make you happy,” and the user is happy.
But here’s what a user interaction might look like in the real world:
When someone designed this particular object (a mailbox flag), they weren’t thinking about emotion. They were thinking about an object. Then along comes a user — Ralph Wiggum — and he clearly thinks, “Hey, this looks like a really fun thing to do.” Once the flag is down and the fun is over, you watch that emotion dissipate. In Ralph’s case, he even transitions to another emotion: sadness. That whole spectrum happens in a three-second GIF: Ralph is feeling joy — but from a design point of view, we never got around to addressing the more intense ecstasy, or less intense serenity, even though Ralph went through all those emotions, and more. We need to start intentionally designing for every single emotion that Ralph is going through.
What that forces us to do is fine-tune communication between people and products — to design for a primary emotion as well as its dissipation — and the relationship we have there. Ultimately, we’re trying to make deeper, more meaningful connections with the user and the best way to do that is to fully understand and manage their emotional spectrum.
Designing for Joy, Fear, and Anticipation
Designing for emotion can be subjective, but here’s one example of something that gave me joy:
Things bounce around, there’s bright color and movement and music that brings back amazing memories from when I was a kid. I even get to make something that’s a direct reflection of myself. The design intention is pure ecstasy, and the user reaction, pure ecstasy.
Or what about designing for fear — what does that look like? It’s difficult to come up with examples, but I found one instance when I was in a Seoul train station — and it’s an example of designing for fear, gone wrong.
I remember sitting there looking at this piece and thinking, “OK, I don’t speak Korean but clearly I am supposed to run away from a bomb, run away from an explosion. Not sure why I’m running toward the trees.” I’m not entirely sure what I should do, and it seems the intention was to deliver the information in a neutral way. But my reaction to it was “Holy shit, I’m not getting on that train, because I don’t want to be anywhere near where these things can happen.” Absolute terror. You start to feel the responsibility of the designer in considering the emotions of the user — in this case, the person viewing the sign.
Or, think about designing for anticipation. Look at the Japan Quake Map. It’s relatively old, but it’s still very powerful. The UI of the quake map shows the quake depth. You see the clock running, but beyond that, there’s nothing else going on — until you’ve waited for a couple of minutes:
That first day is the day Fukushima hit, five years ago. Without even realizing it, the data itself is managing to not just create anticipation, but also elicit an emotion — grief. All that with very few UI cues. That wasn’t intentional, but it illustrates why we need to take responsibility when we create something to put in front of a user.
Surprise is a tricky one because I rarely agree with surprising a user in the interface, with one exception: games. When it comes to games, surprise can be paramount to their success.
Who would think to put an apple in front of a sleepwalker to stop him from hurting himself? It’s gorgeous, interesting, and wonderfully surprising.
What’s interesting is I could hit on only 50% of the basic emotions — not to mention all the others on the rest of the wheel. There’s no clean way to capture that stuff in UI currently — at least, not visually. That’s because, as designers, we’ve done such an excellent job simplifying visual UI. But soon, products will become more multidimensional, so they have their own personalities, just like users do.
As AI becomes more prevalent in our lives, it’s only going to get more complex, because we’ll need to focus on the personality of the user and how it interacts with the personality of the AI. We can no longer solely rely on just the visual representation of the UI. This is good because it will ultimately allow us to form a more reciprocal relationship between the user and the brain behind the interface as we move away from screens.
It’s challenging, but know this: Products and platforms will change, but our spectrum of emotion will not change. This is the key takeaway — that we have a finite set of emotions, and there will never be a sadness 2.0. It’s actually great that we have that constraint to work within because it’s going to help us design better product relationships for the future. It’s not just about designing for intention and reaction — it’s about understanding the full spectrum of emotion and the dissipation of each one, so we can start to develop true product personalities.
The minute we design for all the variations of basic emotions, we know we’re heading toward solid territory for future design.
A version of this article originally appeared on Magenta.