Designing for Emotions

Jamie Swallows
JMC 352: Advanced Web Publishing
5 min readMar 25, 2015

As consumers, we have switched from “we” to “I.” Consumers no longer prefer a huge unknown entity to one-on-one personal connections. This rings true in web design.

My best example: A cow… The majority of the population used to be okay with largely processed meat. We were fascinated to learn the process was fast and cheap. Now, we are leaning more towards wanting to know about the substance that we are consuming and the people who aid in its production.

Along with wanting to know who they are dealing with when entering a site, consumers also want to easily match up the site to the product. This is where the term “Famously Familiar” comes into play. This status can be achieved through color schemes, use of phrases and logos, as well as fonts, familiar photos, etc. Facebook, Nike, and The Ellen Show all have sites which match their product very well and lead them to be “Famously Familiar.”

Designing for Humans

Designing for Emotion’s pyramid of user needs

What consumers want in a site is parallel to what humans want in life. Maslow’s Hierarchy of Human Needs show the most needed things physiological, safety, then love and belonging. At the top of the pyramid are the two things which allow a life to be happily fulfilled rather than just sustained. Those are esteem and self-actualization. This is paralleled in consumer site needs. Users need the site to be functional, reliable and usable in order to be sustained from it. In order to come back to the site, however, consumers need the site to be pleasurable.

The best example for this: Salad and Pizza. While the salad is sustainable, it’s also rather boring. The pizza, however, has more taste, texture, flavor, color and aroma. Someone eating pizza is more likely to remember that meal and to repeat it, just as a site that is more pleasurable and personal is more likely to get repeat viewers than a site that is merely informational.

-

The BBC and CNN websites are great examples of the difference between sustainability and sustainability with pleasure.

Design Principles

There are many principles that add personality to sites. Personality leads to an “I” rather than a “We.” Designers use these principles to their advantage.

The Golden Ratio
Twitter using Golden Ratio and natural eye path to site advantage

Human Presence:

The Golden Ratio is how humans see perfection. Faces, buildings, seashells, with this ratio are seemed to be more beautiful. Humans also do this with websites. They take a certain path with their eyes that follow the Golden Ratio.

The Baby-Face Bias:

The disproportions of a baby’s face makes us perceive love, cuteness, trustworthiness, and lovableness. We look past the stinky shortcomings.
StickyBits and Brizzly are great examples of how a site unrelated to babies can use a “baby face” to gather consumers.

Contrast example.

Contrast:

Our minds seek patterns. We are more pleased by objects that show a color and its opposite. Also, if a site contrasts similar subject sites, a user will remember the contrasting one.

The Hick Law:

The opposite of the other principles. The brain has limitations. It can be overloaded. When it gets overloaded, the brain just kind of shuts it all out.

A designer’s goal is to facilitate human-to-human communication. The computer should seem like it’s in the background and you can see personalities. You try to create excitement and comfort, so that they forget that someone is controlling the site.

Gutenburg’s Movable Type.

Example: Gutenburg’s Movable Type. It reflected actual scribe handwriting. This is a historic example of technology mirroring humanness to add personality and make you ignore the technology.

Personas: To create personas, the designer interviews the company and the audience. They then create a persona in the design by cross referencing the company and the audience.

Persona Examples

Quirky — Boy Coy — The colors, characters, font and word choice prove the site to be quirky.

Serious — Housing Works — The dark colors, slow pace and serious pictures prove the site to be more on the serious side.

Engaging Emotions:

Surprise — Photojojo — Surprise is proven through responsive actions from the site.

Overcoming Obstacles

The designer is ultimately designing for people’s gut reaction. You want their gut reaction to be in your favor, to like your design, simply without thinking about it.

You want viewers to take the path of least resistance. Sometimes you have to add an incentive to keep looking. Your audience will not continue on with your site if they don’t feel that it will benefit them.

You want to design your site so that viewers do not get a feeling of apathy to your cause. You also have to design for people to care about what the site is about. If you don’t, people will not even care to view what they would normally care about.

Forgiveness

Mea Culpa: “Through my fault.” Designers need to design websites so that the audience sees through a fault (like a down server or social media fail). They also need to design a good apology.
Flickr and Firefox have good responses to things that could go wrong with their site.

Flickr error page
Firefox error page

Risk and Reward

Showing emotion in design is risky. You risk people not getting it, people hating it. But also people loving it more than before. And that is worth it. We are designing human experiences.

--

--