Emotional Design

by Shareef Ayyad. Average Reading Time: about 4 minutes.

In his afternoon workshop at UX London, Aarron Walter shares how to design products that evoke positive emotions in the user.

Man vs machine

  • Industrial Revolution was a massive change for our species, started in UK
  • Core theme was man vs machine
  • Before, things were hard to come by – books, clothes, household items etc
  • People wanted a better quality of life
  • Industrial Revolution changed people’s jobs. There was a shift away from hand-crafted production


  • The arts & crafts movement was a protest against the industrial revolution
  • Ever since there’s been a swinging pendulum between machine production and hand-craft production
  • Story is an important part of the arts & craft movement
  • Machine/mass production removes stories from the object
  • In US, there’s been a boom in organic food outlets, local produce, hand-made goods
  • We are constantly negotiating the pendulum swing
  • We want access to everything now, but still enjoy things that are unique/special

Example of craft

  • Raleigh Denim create top quality hand-made jeans and source all materials locally
  • They have a mantra on a wall plaque “Make better things in a better way”
  • They use traditional denim machinery and hire very experienced (often retired) denim experts
  • Produce 250 at a time, each pair has a batch number and signature
  • To compete with levis, they put their story front and centre


  • Mankind have been telling stories around campfires for hundreds of years
  • Facebook/Twitter are now the campfires where we tell out stories
  • Stories are part of design “The most effective design has a narrative thread”
  • Stories make people understand your value system
  • Craft means story, which makes people care

Human-to-human interaction design

  • Dropbox designers hand drew their web page assets and scanned them
  • They also have a father box cartoon giving his son advice on their upgrade page
  • These are examples of showing personality through design
  • Users can sense the designers’ value system through the interface
  • When compared to box.net home page, Dropbox looks clear and concise
  • Box.net is good, Dropbox is great
  • There’s a second revolution happening right now online. It’s now easier than ever to create apps and digital products using node.js, jquery, phonegap etc

Designing for emotion

  • Small kindnesses add up. e.g. easy to install apps, easter eggs that make you smile
  • We measure experiences like grains of rice on a scale. Designers should aim to tip the scales in their favour
  • Users will forgive your shortcomings if you can reward them with positive emotion
  • UX hierarchy of needs: 1. functional 2. reliable 3. usable 4. pleasurable
  • Most designers aim for usable, but it’s actually quite a low bar
  • It’s equivalent to a chef making food that’s just edible e.g. serving spam
  • Google Analytics is purely functional. Makes you feel dominated, small and fearful
  • Chartbeat is more than usable. Has a beautiful interface with elegant animations
  • You enjoy using it and feel powerful

Emotional re-design with MailChimp

  • When redesigning MailChimp, so much was stripped out of the design they were worried it had lost some of its personality
  • Especially when deciding to remove the chimp mascot and his jokes from the corner of the interface
  • They added a chimp’s hand giving the user a high-five when a campaign is published
  • This showed personality, and that the team understood the stress and relief of preparing and sending an email campaign
  • They went one step further by sending high-five t-shirts to anyone who tweeted a picture of them high-fiving the monkey back
  • Emotional design across all touch points

The power of empathy maps


  • Use post-it notes to arrange user’s emotions
  • Forces you to have empathy for each persona
  • Think/feel – what really matters, worries, aspirations, preoccupations
  • See – environment, friends, what the market offers
  • Say/do – attitude in public, appearance, behaviour towards others
  • Hear – what friends say, what boss says, what influencers say
  • Pains – fears, frustrations, obstacles
  • Gains – wants/needs, measures of success


  • It’s a misconception that children are born as blank slates
  • 50% of personality is built into us at birth
  • Reason: humans are social creatures, personality is a big part of us
  • If you design for everyone, you design for no one
  • 1 of 4: Stand out in a crowded market place. e.g. Hipmunk lets users order flights by agony, while all competitors use usual price ordering
  • 2 of 4: Make your users feel something. Dopamine release is like a post-it note for the brain. Emotions help people remember e.g. GE uses emotional stories to make their users feel emotions
  • 3 of 4: Find your tribe. Showing your personality will help you attract people who identify with the same things as you
  • 4 of 4: Show passion. It’s contagious, and will help word-of-mouth marketing

Brand traits

  • List 5-7 traits that best describe your brand
  • This will help those designing and writing for this design persona create a consistent personality
  • For each there should be a trait that you want to avoid, often it’s the positive trait amped up too much
  • Example from MailChimp:
  • FUN but not childish
  • F U NNY but not goofy
  • POWERFUL but not complicated
  • HIP but not alienating
  • E A S Y but not simplistic
  • TRUSTWORTHY but not stodgy
  • INFORMAL but not sloppy

 Further reading