Designing for emotions
How to apply techniques to evoke emotion in design
So you want to design something that evokes emotions? Emotions connect us all depending on what we interact with, watch, experience — we all have connections to things that vary across our lives. This article will cover a brief overview of several theories that you can apply to help evoke emotions in design.
Creating a memorable and functional digital experience immediately generates perceived value for users during their first interaction with a product or service. A large part of creating a memorable experience is generating emotion. Experiences with an emotional component are more likely to impact our long-term memory because emotion gives people value. It determines what is essential to us, versus what is urgent, and dictates how we respond to situations. A well-designed product that elicits emotions makes us want to return and relive those emotions.
Pillars of emotional design
“Emotional engagement can help us look past even the most serious infractions leaving the good more prominent in our mind than the bad” — Aaron Walter
Like Maslow’s hierarchy of needs, Aarron Walter’s hierarchy of user needs defines standard user needs — ie. that interfaces must be functional and reliable before more advanced needs can be addressed.
Started from the bottom, now we’re here
Functional Design
The interface does not necessarily need to be beautiful to work well. A great example of this would be Craig’s list. It has looked very similar since its conception in 1995 and doesn’t have any unique aesthetic design. Yet, users can easily find the sections they are looking for because of the simple and easy-to-understand layout.
Reliability & Trustworthiness
Transparency leads to trust. By sharing all vital information about your product/service like who you are what you stand for, users can begin to create trust and reliability associated with your brand. That way, users know what they are getting when it comes to your product or service — like sharing the pricing models, product details, expertise involved, ability to contact customer service, and more.
Having a professional website or app, stylish marketing materials, clean, and readable web content creates credibility and confidence. Do you want them to believe in the value of what you’re offering? Make your presence as polished as your product. However, be aware of your brand tone in your design and your writing. If you’re creating a dating app, you probably don’t want it to sound and look like a bank (unless you’re going after bankers, of course). Remember, authenticity plays a role regarding how trustworthy your brand is too. To be authentic is to have a clear understanding of the company’s story, values, goals, and mission; but also have a true sense of the problem you are trying to solve for users. Ensure that each step you take is aligned with the ultimate goal you’re trying to achieve. Rather than adding features, or other objects that might distract users from what they are trying to accomplish, focus on what really matters.
Usable
The design must be relatively easy to use and not require much effort to understand, discover and use. Ensuring that the hierarchy of information and user flows are straightforward and that users can easily find their way around makes it user-friendly and more desirable for them to want to use it again.
Pleasurable & Delightful
A pleasurable experience refers to any positive emotional effect a user may have when interacting with a device or interface. User delight may not always be expressed outwardly but can influence the behaviors and opinions formulated while using a website or application. A delightful experience can include animations, gestures, page transitions, sounds, microcopy by injecting humor, slang, relatable language into the text, and compelling high-resolution imagery.
These types of delight or pleasure can be overdone and gimmicky if they are not executed well and take away from the purpose of the product. As mentioned before, it’s about being authentic in your design and copywriting. Once all the needs of the pyramid are met, a true feeling of delight can be accomplished. A deep sense of satisfaction can occur when the user is immersed in the task at hand without much distraction, and the interface behaves seamlessly by giving the user all the correct tools exactly when needed, without getting in the way.
Personality
A personality helps create relationships and serve the product and service to help induce emotional connections with their users. It’s a way for people to connect to products on a personal level.
The owl is friendly, inviting, and happy. The owl is helpful and never gets in the way of the UI as users interact with the app. By providing micro-animations and messaging, the user is always acknowledged in a friendly manner that supports them on their journey. However, the authenticity aspect is crucial when it comes to bringing personality to a brand. If you misstep here, it can be disastrous for your product, as the user could feel like your app or website isn’t made for them. When in doubt, always aim for an inclusive design that doesn’t cut particular people out of the equation.
Rosy Retrospection
Retrospection refers to the psychological tendency to judge the past more positively than the present; It is a cognitive bias that could be identified by the concept of nostalgia, though the latter does not always directly imply a biased recollection. Positive memories shape perception. Positive memories replace the bad ones more so. If users interact with your product or service, they may not remember all the details, but they will remember how they felt, bad or good.
Design Patterns to abide by
Humans are complex beings that can be difficult to please and even more challenging to design for. We have varying personalities, emotional needs, and desires, so the question is — how can you create something that can be appealing and interesting to many? Apart from all our differences, we have one thing in common — throughout history, humans have always sought out different patterns. We are hard-wired to find and recognize patterns, especially in forms on which we can easily overlay emotion (i.e. Looking for faces, patterns, symmetry, and more.)
The Golden Ratio
If you’re a designer or artist, you probably have already learned about the Golden Ratio (or its other known names, including Golden Section, Golden Mean, Divine Proportion, or the Greek letter Phi). It’s a number that comes from the Fibonacci sequence, a naturally occurring sequence of numbers found in nature. It appears in nature because it represents structures and sequences that model physical reality. Applying the golden mean to your designs creates appeal for the eye and can encourage people to come back to use a product.
The sequence has occurred throughout time applying to many man-made objects seen in architecture, masterpieces of art, and more but these principles can also be visible in modern design. There are some examples below of how companies apply the Golden ratio to their logos:
Baby Face bias
“A tendency to see people and things with baby-faced features as more naïve, helpless, and honest than those with mature features.”
- O’Reilly Universal Design Principles
People and objects with rounder features, small noses, bigger eyes, large foreheads, tiny chins, and lighter skin and hair are perceived as babylike. These objects are viewed as having babylike personality traits like innocence, honesty, and naiveté, making people feel more emotionally drawn to them. This type of bias is viewed across all age groups and cultures. It is applied in designs all around us including the example provided above with Duolingo.
Contrast
Contrast refers to the arrangement of contrasting elements and effects when two or more visual elements in a composition stand out from one another it can be applied across various objects, for instance, light and dark colors, rough and smooth textures, big and small shapes. Context is integral to contrast.
Stemming from the Gestalt Princples of design, which is a theory based on the idea that the human mind will try to simplify complex imagery or designs that consist of many elements by subconsciously ordering parts into an organized system that creates a whole piece rather than separate components. The human brain is built to form patterns and structures for us to better comprehend the environment we live in.
Contrast can be utilized to lessen viewers’ cognitive load and help them focus on a simple product or service. Using these things in opposition to each other can help bring out more dramatic effects in design.
Using the principle of contrast helps draw attention to what you want the viewer to look at in a design or a specific area. Once you decide what you want the viewer to pay attention to, you can focus on the features of the elements in the composition so that they’ll stand out.
In the example below, Apple uses color, space, and scale to help focus the viewer on the iPod. They are trying to sell to the audience using a feeling of euphoria as the people are depicted as dancing and enjoying themselves.
You can focus on are the following elements to help create dramatic contrast:
Use of color
The background color and the element help establish the focal point of a design; for example, many successful e-commerce brands use bright colors for buttons as call-to-actions to draw the user’s attention to convince them to take action buy clicking on it.
Take advantage of white space.
The white space between primary elements on an interface creates a sense of understanding to the viewer that the center element is much more important to look at than the others.
Size matters
The size of the key elements seems large, and that’s how and why they are the center point of attraction. Depending on the interface, having elements in larger sizes helps the user focus on the task at hand or a particular object.
Why less is more
Freedom of choice is something most people desire. It comes down to how they spend their time, where they choose to go, what they decide to buy, and more. You would assume that if there were more choices, it would make selecting more straightforward, but you would be wrong.
Decision Fatigue
“The phenomena of decision fatigue can affect even the most rational and intelligent individuals, as everyone can become mentally exhausted. The more decisions made throughout the day, the harder each decision becomes for us. Eventually, the brain looks for shortcuts to circumvent decision fatigue, leading to poor decision-making.” — the decision lab.
Depending on a given situation, too many choices can lead to dramatic consequences or, if applied to a product, can cause users not to return. Rather than agonizing over decisions if there are too many choices, it leads to decision fatigue and results in users not making any choices and feeling stuck.
Ego depletion
Ego depletion occurs when people use up their willpower on several tasks, as a result, they have difficulty exerting the same level of self-control on other tasks. Unbeknownst to most, willpower is a limited resource similar to the energy produced by a muscle, and can both be strengthened and exhausted. Different things lead to ego depletion while making decisions, including prolonged focused attention, emotional stress, exerting initiative, and excessive choices. This is something to keep in mind when simplifying products to improve the user experience.
Choice overload: mo’ choices, mo’ problems:
The more choices you make throughout the day, the harder each one becomes for your brain. Eventually, it leads to people taking shortcuts. Due to this, more reckless decisions can occur when users act impulsively instead of expending the energy to think through the consequences. A study done by the New York Times Magazine article revealed in a courtroom that:
“Judges, who would hear the prisoners’ appeals and then get advice from the other members of the board, approved parole in about a third of the cases, but the probability of being paroled fluctuated wildly throughout the day. Prisoners who appeared early in the morning received parole about 70 percent of the time, while those who appeared late in the day were paroled less than 10 percent of the time.”
How do I apply this to design?
Limiting choices helps users make faster decisions. You cannot please everyone, focus on designing for simplicity rather than trying to cater to everyone’s needs.
Focus on the main objectives; the more goals a product or service tries to meet, the less likely it is to result in a conversion (i.e., completing a single goal), due to an abundance of choice.
Less is more, even if it means something is small and focused; you’re making sure the experience solves a real need and provides value to the user.
Simplifying designs in a design critique, when you review a digital interface, typically, you should evaluate some of the following. Still, it also varies depending on the designs and the goals you’re trying to achieve. Some things to consider to simplify an interface:
- Are there too many icons?
- How many features are you including? Are they all necessary?
- Is the copywriting clear enough?
- Are there too many colors?
- Are there too many separating lines or is there not enough space?
- Are there too many form fields or questions?
That was a lot, but if you can compose some designs whether you’re working on a visual design for an advertisement, a check outflow, product landing page, etc, it’s best to keep your users at the center and consider how they perceive your product or service. Elements to create an emotional response are a collection of applying design patterns, reducing a cognitive load, and incorporating aspects of personality, delight, trustworthiness, and functional design.
Resources
I wrote this article based on my knowledge and experience as well as what I’ve learned throughout schooling and reading articles on my own time. These are the resources I used to help me support writing this article including NNG, the New York Times, the decision lab, Intuit (Mint), and another useful article by Justin Baker regarding emotional design.
