Designing for Emotion - 2nd Edition

Here at Ruby Slipper, we are big fans of Aarron Walter. We own both the 2011 and 2020 editions of this book, Designing for Emotion.

There is SO much more packed into these 100-pages. We highly recommend it for web designers, nonprofit organizations, and marketing professionals — anyone who wants to make a memorable and engaging connection with their audience.

Aarron founded the UX practice at MailChimp and helped grow the product from a few thousand users to more than 10 million. He’s advised The White House, LinkedIn, and is currently senior product and design lead at Resolve to Save Lives.

We wrote about the first edition of his book which provided an array of principles so designers could emotionally connect with audiences in order to achieve delight.

Over the next decade, Aarron’s wisdom grew and he saw that more was needed. Addressing diversity and inclusion, acknowledging fears, and seeing the nefarious uses of social media for political gain and division all led to this 2020 edition, which looks at more complicated emotions.

Here we provide major highlights from his book. We highly recommend adding this gem to your collection. Aarron is a gifted writer and includes incredible stories and professional case studies to convey the impact of these powerful principles. Honestly, a university course could use this book to guide their students — it’s chock-full of wisdom!

Chapter 1: Emotional Design

In the world of web design, it’s essential to preserve the human touch and show ourselves in our work. We do this with a combination of psychology and craftsmanship: to create a user experience that makes visitors feel the person at the other end.

Aarron gives an example: think of the difference between a mass-produced coffee cup and one from a potter. They serve the same function. But the artist’s creation shows evidence of the human behind the art. It resonates palpably, connecting us on a human scale.

So how does this play out in the digital world? While physical human touch doesn’t exist in digital design, the spirit of it does.

Aarron takes Abraham Maslow’s familiar Hierarchy of Needs and creates a version for the web.

The baseline interface must be functional, reliable, and usable. The top of the pyramid is pleasurable — which includes delight, trust, empathy, and vulnerability.

Designers must get the basics right first. But when they move beyond the essentials of usability, they can create an extraordinary and memorable experience.

We like to think of it like this: designers who create interfaces that are just usable are like chefs creating food that’s just edible. As web designers, we could simply put a website on the “table” or we can strive for a memorable experience that lingers on the palate. Mmmmmm….

Want to practice? Try recalling the best meal you’ve ever had. What made it so special? Maybe it was the combination of taste, aromas, presentation, attentive staff, or something unexpected. All of that culminates in a grand experience paired with an intense emotional response.

Even if it’s been years, we can each recall our best meal. Because emotionally charged events create memories that persist much longer.

Our websites should strive for “best meal” excellence.

Chapter 2: Designing for Humans

From Aarron: We are a complex species, but at our core, we all emote. It’s our universal language. We all laugh and cry. We feel fear, joy, and pain. Emotion is an essential survival tool.

CONTRAST

We also share the instinct to search for patterns. Aarron describes visual contrast as the difference in shape, color, form, etc. Cognitive contrast is the difference in experiences or memories.

Our brains scan for contrast and it drives our decision-making process. We use it to answer the fundamental question — is it good or bad for me?

Aarron shares a story where he was walking down a path at twilight. He spotted a squiggly line across a circular stone and felt a spike of fear. Sure enough, it was a venomous copperhead. He instinctively reacted to the contrast of the squiggly line and it spared him a trip to the emergency room.

That’s the power of contrast.

OVERWHELM

While we can and should use contrast in web design, we also need to be careful. The more we add, the more we can overwhelm the processing power of the people visiting our site.

Hick’s Law: The time it takes to make a decision increases with the number of alternatives. Attention is a finite commodity.

This is more critical than ever while our daily bombardment of media has most of us inundated, over-saturated, buried alive.

How does this play into design? Think of your organization’s home page. Does it succinctly display the most important info? Or does it scroll for days, loaded with information? If the latter, watch out, you could be losing people by overwhelming them.

BRANDING

We all know the power of branding. And turns out, it’s all about contrast. It distinguishes a company from its competitors, and creates a powerful competitive advantage.

Think about the biggies: Apple, Starbucks, Nike. Each one has its own personality and will elicit an emotional response. That’s branding done right.

AESTHETICS

Too often, design is seen as the indulgent frosting on a functional interface. But it’s so much more than that! As Aarron explains, attractive things make people feel good. They create positive emotional responses and actually improve our cognitive abilities. In other words, attractive things actually work better.

We wholeheartedly agree. At the onset of every large website project, universally, our clients request a “clean, uncluttered website that doesn’t overwhelm the visitor.”

In that simple statement, they are asking for contrast used judiciously. They’re wanting on-point branding that’s attractive without being overloaded, so it works for the benefit of all visitors.

Chapter 3: Personality

Personality — the mysterious force that attracts us to certain people and repels us away from others. When you think about your best friends or the people you’d rather not spend time with, a lot of it has to do with personality. It influences our decision-making process and can be a powerful tool for designers, too.

An organization wants their personality to come through online. It should feel to your audience like there is a human on the other end, not a computer. Even though it’s a website, engagement is about human-to-human connection.

BENEFITS

Stand out from the crowd
Create long-term memory
Find your tribe
Convey passion, invite passion

PERSONAS

This is one of our favorite exercises. One that is so important for web design, but is often overlooked!

A persona is a fictional, realistic, description of a target visitor. They are an archetype, not a real person, but they should be described as if they were real people.

Common information to give to your persona:

Name, age, gender, and a photo
Tag line describing what they do in “real life”
Experience level in the area of your product or service
How would they interact with your product? Through choice or required by their job? How often would they use it? Do they typically use a desktop computer to access it, or their phone or another device?
Goals and concerns when they perform relevant tasks: speed, accuracy, thoroughness, or any other needs that may factor into their usage
Quotes to sum up the persona’s attitude

(Thanks to the Neilson Norman Group for this checklist.)

How are personas used? They help the design team remain aware of their target audience and focused on their needs.

You can also do this for your website! If your website were a person, who would it be? Here’s what you would include:

Name
Overview – short description of personality and what makes it unique
Personality image
Brand traits
Voice
Copy examples
Visual lexicon
Engagement methods

This will help remind the design team of the type of relationship you want to build with your audience.

Chapter 4: Empathy and Inclusion

Empathy is the ability to understand and share the feelings of another. A commitment to inclusion means that we create positive experiences that resonate and include ALL people.

Aarron guides us to the Design for Diversity framework, created by Project Inkblot, that has a series of core questions to add to the design process.

What is the worst-case scenario, and on whom? You will need to understand intention and impact.
How do the identities within your team influence and impact your design decisions?
Who might you be excluding?
How will you engage the people you want to reach within your design process, equitably?

Going through these questions with the design team helps to look through a more inclusive lens.

BELONGING & REPRESENTATION

Aarron writes: “If you’re a person of color, a lifetime of rarely seeing your reflection in pop culture creates a damaging narrative: you’re on the outside.”

He shares Diógenes Brito’s article, Just a Brown Hand, where Diógenes writes about the brown skin color featured in a Slack graphic.

“Why was the choice an important one, and why did it matter to the people of color who saw it? The simple answer is that they rarely see something like that. These people saw the image and immediately noticed how unusual it was. They were appreciative of being represented in a world where American media has the bad habit of portraying white people as the default, and everyone else as deviations from the norm.”

Ask, who are we leaving out? Who is not represented in our photos, icons, illustrations, and videos?

Visit Aarron’s fantastic article, 3 Amazing resources to help you design for diversity and inclusion to learn more.

Chapter 5: Emotional Engagement

We can use the power of psychology to create positive, long-lasting memories in the minds of our audiences. We do this by “designing moments.”

The customer or supporter journey refers to the experience a user has with your website or product to reach an intended outcome, like completing a purchase or donating to a cause. The journey can encompass many sessions online, across devices, or in-person too.

THE IMPORTANCE OF ENDINGS

A key teaching from this book is that endings are VERY important. The peak at the end of the experience — whether positive or negative — will disproportionality shape our memory of the whole experience. It’s SO important to end on a high note.

THE POWER OF STORY

Stories make us laugh, open our minds, and inspire us. Stories create an intense emotional engagement.

We agree. Our article on the brilliant company StoryBrand supports this 100% — they craft entire user experiences based on the structure of story.

And Aaron explains how stories literally change our brain chemistry. Rising action causes our brains to release cortisol, which focuses our attention like a spotlight. Oxytocin is released when we care, connect, and feel empathy.

We all process and recall information more effectively through story. Nonprofits, take note — stories are an effective tool to call people to a cause.

Chapter 6: Trust, Fear, and Forgiveness

As Aarron says, we shouldn’t sweep things that are uncomfortable under the rug. It’s important to address emotional obstacles like fear, skepticism, and mistrust.

All of us are preprogrammed to be skeptical of new brands, products, situations, and even new people.

Aarron uses the example of what it feels like to walk onto a used car lot. We are all wary of the salesman who approaches. Fake smile, preplanned pitch. We sense he doesn’t care about us. He wants to make a sale.

Just like we don’t want to be schmoozed or pushed, our site visitors are hesitant to click and sign up. They don’t know us, why should they trust our brand?

A LOOK AT DECISION MAKING

How do people make decisions? By and large, our gut reactions. If we used logic to consider all decisions, it would be a time-consuming process and leave us gridlocked. Instinct helps us make decisions.

Designers use layout, color, line, typography, and contrast to help people more easily consume information and to help them make a decision driven by instinct.

TRUST IN SIMPLICITY

Aarron uses Wealthsimple, an online investing company, as an example. Visit the site and you’ll see how their simple design shapes first impressions and inspires trust.

From Rudy Adler, their co-founder:

“We see our homepage as the first glance in what we hope will become a relationship that lasts a lifetime. So that first impression is pretty crucial.”

HONESTY & FORGIVENESS

What happens when things go wrong? It’s of the utmost importance to explain what happened swiftly, honestly, and clearly. Communicate that you’re doing your best to resolve the issue. And give frequent updates.

Technology is fickle. On our best days, everything is running smoothly. But glitches happen, plugins fail, the power goes out — you name it. It’s part of the digital frontier.

When these things happen, apologizing and reassuring your users goes a long way in repairing relationships.

Chapter 7: The Business of Emotional Design

How do you fit the principles of emotional design into a fast-paced schedule?

Aarron does NOT suggest rushing to market and adding emotional engagement later. Because if visitors come and the experience isn’t great, they’re not coming back.

You’ve got to nail the first impression.

Emotional design needs to be baked into the process.

Consider the emotional needs of the customer
Map the customer journey
Design a peak happiness moment
Consider how you will measure the impact of your peak moment

Food for Thought

First, bravo to Aarron Walter for this updated book! It’s brilliant and we are learning so much from these amazing ideas!

Second, we want to part with another nugget of wisdom from the book:

Designers have power, and with that power comes responsibility. When it comes to design and integrity, Aarron pulls a powerful quote from Mike Monteiro’s A Designer’s Code of Ethics:

“By choosing to be a designer you are choosing to impact the people who come in contact with your work, you can either help or hurt them with your actions. The effect of what you put into the fabric of society should always be a key consideration in your work.”

Absolutely. We are designing human experiences and conveying information. We are each responsible for what we put into the world.

***

We highly recommend buying Designing for Emotion and visiting Aarron Walter’s website and social media platforms to learn more from this gifted teacher.

Designing for Emotion – 2nd Edition