By Aimee Sanderson
October 12, 2011
Web Design
Simply put, emotional engagement is about creating a stronger user experience, using psychology.
Last I checked no one in our studio had completed (read: started) their psychology major, but as web designers we have to be jack of all trades.
Humans are very reactive creatures, and the majority of our decision making is not rational. We rely heavily on how people/things/product makes us feel and our gut instincts.
Some products sell themselves, but chances are unless you’re building a website about puppies, you’re going to need to start thinking about emotional engagement.
Puppies: more appealing than print cartridges on a homepage. But not always more relevant.
From the RSPCA website.
Think about the people or places you like the most. You trust them, they are fun and you feel like you belong. The same qualities can be emulated within web design. These are the elements of emotional web design I’m going to look at today.
Good usability has been covered a bit on this blog, however in this post, we’re talking about strategies to implement and measure the soft stuff, the stuff that’s going to get your user liking you more.
Usability verses Emotional Engagement?In an
Introduction to emotion design, Frank Spillers, suggests the necessary thinking to shift from usability to emotional engagement:
Emotional design isn’t
instead of good usability. It complements it and adds another element of top of your web design to keep the users’ anxiety levels low, engaged and returning to your site.
Before users even see your siteEmotional engagement begins well before users hit your homepage. How your site displays in a search engine will already dictate the emotions a user feels towards your site, messages and product.
What the user sees in search engines is already aligning your website with a set of values and causing them to either feel trust, distaste, joy, or anticipation. Google your competitors and make sure your
meta titles and
meta tags are being used effectively.
Users will also find your site through your advertising strategy. Align your site with brands with similar values you want to portray. One of Australia’s top female bloggers,
Mia Feedman, has such brand value that her readers outright criticise her if she takes advertising from any sponsor they deem the wrong ‘fit’ for their online community. On the other hand, good fits can have a positive impact on the emotional attachment of the reader.
Your
social media pages and
press coverage will also dictate how a user feels towards your site before they even get there. Although press coverage is not always controllable, it’s essential to have cohesive social media, advertising and web site goals. To create these keep in mind the end goal – downloading a form, creating a profile, making a purchase or changing a behaviour pattern.
And then they see your siteResearch shows that at 1/20th of a second
1 a user can make decisions about your site that are lasting. We like to feel we are right, and even if the facts indicate that our first impression was wrong, we will seek the irrational justifications that it was in fact correct. You can read more about this
study here.
Stephen Anderson, who speaks on ‘seductive design’ came up with the below diagram based on Maslow’s hierarchy of needs. Whereas Maslow was discussing basic human needs and how they escalate when each one is met, this fits nicely into the theory of design:
Design hierarchy of needs from Boagworld.
What is the design of your site saying about you? Your homepages and landing pages need to be meeting the very top of this pyramid to be gaining good first impressions.
Visibility magazine has a nice article about
emotional motivators on landing pages. It covers issues like safety, clarity and coherence.
The importance of building funJellybean bikes have optimised on the game aspect of ordering a coloured bike. The entire site shouts fun, it’s highly usable, full of only the information you need, and easy to navigate.
Even though I’m pretty sure we have no need for a Mintleaf Studio themed bike, I had so much fun building this thing I was mad keen to buy it.
Then showing me in neat diagram what size I’d probably be after.
Even letting me know in a friendly way that it was out of stock.
Which was probably lucky for me at this point.
You’re aiming to create joy and anticipation. While clicking through the Jellybean site I was genuinely interested to see what the next screen was going to bring me. Even the cool way a new screen slid to view like a journey I was moving forward in, kept me engaged.
By human nature we like games, challenges and rewards. Building these elements into your site will increase engagement and emotion like joy, competition and satisfaction of winning.
The
fun theory proves time and time again that humans will change their behaviour, or even go way out of their normal routine, for the sake of game. Check out the video below showing how the fun theory manages to convince commuters to use the stairs:
By the way – the above campaigns were all sponsored by Volkswagen, who has ‘fun’ as a key emotion needed to buy vehicles such as the new Beetle. No coincidence, huh.
The importance of belongingWhile looking at the importance of belonging and creating the ‘tribe’ mentality that successful emotional web design creates I started looking at online patient forums. Often lacking funding, a lot I came across were just plain summary-and-thread type forums. However
Cancer Connections have great usability and makes it easy for their members to find each other, make connections and profiles, or browse as a guest. I was especially impressed with their search feature:
This site also lists its new members on the homepage and shows a list of recently active members as a strip of avatars down the bottom of the page.
These features help develop a
tribe mentality of “I belong here, I am safe here.” The editorial tone should give the user a sense of belonging, using language commonly used by that demographic.
Create dynamic content. Use appropriate language. Leverage existing users to influence others. Showing how many users are also online, have bought a product, or showing testimonials can especially put in good use at the registration and check out processes of e-commerce modules.
Online blogger
Mamamia uses social media to assist users in making the decision to sign up to their e-newsletter:
The importance of trustThis post wouldn’t be complete without touching on trust and credibility. We’ve covered these topics before in
Defensive web design and
Persuasive web design, which are both good resources.
Conventional methods of building trust (that should not be overlooked) include featuring security badges on your site, showing social media icons with fan numbers, virtual trials and testimonials.
From an e-commerce perspective good usability also has easy to find shipping information and costs, return policies, contact information and clear instructions on what point money is deducted and order is confirmed.
These are more conventional useability methods, as oppose to strictly emotion design, but are highly relevant to a good emotion design.
Measure itNo point doing it if you can’t measure it.
As well as looking at typical analytical measurements like unique versus returning users, heat maps, eye tracking, and recording mouse movement can all be used to measure emotional engagement. Analysing where the user is drawn to on a page and how they navigate can be indicative of emotional content.
There are also emotion specific measurements that ask users to class various aspects of your website with a caricature showing emotion.
LEMtool (layered emotion measurement) and
PrEmo are both examples of this from the Susa Group.
Last thoughtsEffective emotional web design can displayed simply as
2:

Although adoption is last, consider it first for best results. What are we aiming the user to do? Essentially, in some way change their behaviour by adopting our messages, buying our product or interacting further with the site.
Then we can work forwards. How do our users find us and what is that telling them? Is the sites first impressions hindering or helping us? What can we do to make them want to stay on the site?
It’s a diverse topic, but one you can have a lot of fun with.
And I better start those enrolment papers in psych if I’m going to take this topic any further.
Like it? Follow Mintleaf Studio on Facebook and Twitter.
References
- First impressions count in website design, Websiteoptimization.com
-
How to create user engagement with your web design, Googlj, July 2011
Other references