Emotional Website Design

Emotional Website Design: Building Strong Connections with Users

Website design always has a purpose. Every business owner wants a site that is eye-catching and encourages visitors to linger, and which is easy to navigate so people can find and do what they want easily.

Ultimately, websites are built with business goals in mind. And how they are built and designed is key to achieving them.

The principle of emotional design takes that thinking a step further. Pioneered by figures like Don Norman, emotional design is based on the now widely accepted scientific principle that how people behave is fundamentally driven by emotion. Even if we aren’t aware of it at a conscious level, how we interact with everything has an emotional element. Or as Norman put it, “everything sends an emotional signal.”

Norman’s core idea was that, if you understand how those emotional signals work, or how different stimuli trigger different emotional responses, you can shape designs to have a desired emotional impact.

Emotional design isn’t a concept that is specific to web development. But applied to web design, it helps a website developer understand what really makes a page attractive to visitors and why. So, in this post, we’ll explore how it works.

Anticipating Your Users' Emotions

Emotional design means taking a user-led approach to web design. When we talk about user-led design, we often focus on anticipating a user’s needs so we can meet them. Emotional design, however, also focuses on anticipating a person’s responses when they land on a web page.

That stat about people taking a fraction of a second to form a first impression when they land on a website? That’s an emotional response in action. If you know how and why they happen, you can build a page in such a way to get the right kind of response.

As per the work of Don Norman again, in emotional design theory there are three types of emotional response identified:

  • Visceral: This is the ‘gut feeling’ that takes fractions of a second to form, and is largely based on visual cues.
  • Behavioural: As website users, we all make judgements about whether a site or page is going to give us what we are looking for. These ‘in the moment’ judgements are more subconscious (and quicker) than we might think. A lot of users leave websites without being able to clearly explain why they have done so!
  • Reflective: As well as driving behaviour ‘in the moment’, our judgements about a site form our longer-term impressions. There is both a rational and an emotional part to this. If a website was slow or we couldn’t find what we were looking for, we put it down to a ‘bad experience’ on a conscious level. But the emotions that accompany this rationale – frustration or annoyance, for example – are what will drive our decision not to go back to that site again.

 Emotional design aims to evoke the right emotional responses on all three levels, with the ultimate goal of people going away with positive feelings that they want to come back to repeat.

But these emotional responses also must be applied to specific audiences in the specific context of your site. Anticipating your audience’s emotional responses also relies heavily on knowing who they are and what they want from your brand. It’s here that the theory of emotional response has to meet with the tried and tested methods of consumer and market research, competitor analysis, and A/B testing to find out what really works.

Evoking Emotions Through Design

So, how do you manipulate desirable emotional responses through web design?

First of all, it’s easy to map some of the basics of web design to the three types of response listed above. Visually appealing design is key to evoking a positive instinctual response (and is key to making the right first impression). User-friendly design is key to getting a positive behavioural response (this site is easy and convenient to use, I can do what I want here). And if you tick both those boxes, you go a long way to creating an experience that is pleasurable and memorable (reflective response) – although there is a lot more you can do to strengthen this.

Let’s dive into these points a little further through the lens of three core design elements – visuals, content and user interface (UI).


Perhaps the best understood area of the relationship between visual stimuli and emotional responses is in relation to colour. Colour psychology is a well-researched field, and gives designers a handy blueprint for how to reliably use colours to incite certain emotions – red for excitement and energy, yellow for happiness and creativity, blue for competence and loyalty etc.

After colour schemes, images are another important visual cue for emotional responses. Photographs of human faces are the classic example here, especially with big, beaming smiles. Evidence suggests that just seeing someone smile makes us feel happier. And it doesn’t just have to be photos of people, either. Ever wonder why so many brands have smiley cartoon-like characters as their logos?

website Design


While video and audio have their place, the majority of content on the web still takes the form of the written word. And as any author will tell you, manipulating written language to convey and inspire emotions is one of the great art forms.

Evoking emotions through text starts with tone of voice. Your choice of words and style of writing goes a long way to making content come across as authoritative and professional, for example, or conversational and friendly, or helpful and supportive. The tone you choose will be influenced by a mix of your brand identity and the purpose of the content.

Another powerful tool for stimulating emotional responses through content is storytelling. Neuroscience has unpicked the remarkable ways in which our brains are wired for storytelling, to the extent that our cognition is fundamentally dependent on narratives. But storytelling is far from just a rational thing. It’s deeply invested in emotional responses, and in particular responses that help us remember and make connections.

In short, if you want to engage people and light them up at an emotional level, tell a story. And if you can include them in that story, i.e. by speaking directly to them as your audience, all the better. Because people also respond warmly to the personal touch.

User interface

Finally, if we think back to the behavioural side of emotional responses, we know that people experience positive and negative emotions in response to how well things work. This is important because it elevates the importance of good functional design. It’s not just a case of building something that works. It’s about building something that makes people happy.

The user interface is therefore an essential part of emotional website design. UI should be a pleasure to use, inspiring lasting positive feelings and memories that keep visitors coming back again and again.

Conclusion: The Power of Connection

Emotions are what drive our connections, both to each other and to the world around us, including the things we use. Applied to website development, the principles of emotional design are therefore all about forging the right kind of connections with your users.

This takes an understanding of what your users want and need at an emotional level. The best connections are forged when you design with different emotional levels in mind, manipulating visual style, content and UI to build a site that is pleasing on the eye, engaging in its tone and storytelling, and satisfying to use.

Perhaps more importantly than anything else, emotional design challenges us to redefine what ‘good design’ means, recasting it entirely in user-centric terms, and making it all about eliciting the right responses.

If you’re looking for a web design agency with a proven track record of taking digital presence to the next level, get in touch with the Key Element team today to talk about our web development services.

Scroll to Top