Skip to content Skip to navigation

Designing With Emotion and Personality in Mind

In this post, I'll share one of my take-aways from reading A Book Apart's Designing for Emotion, highlighting how infusing personality into the things we create can help produce emotionally engaging experiences that make long-lasting impressions on our audience.

Constant inspiration

One of the coolest things about being a member of the Stanford Web Services team is experiencing the inspiration that erupts with every project (and often, with every discussion). We’re always rethinking processes and studying patterns to find new, more awesome ways of doing things.

Many of our exciting ideas are sparked by something we happened across in our lives that we want to share and further explore. Sometimes inspiration is produced from a blog post, a talk, a short video, a quote, or a book.

Recently, our amazingly rad Web Designer, Megan, recommended (and let me borrow) a fantastic short book loaded with inspiration, Designing for Emotionby Aarron Walter. Designing for Emotionemphasizes the impact we have when we reevaluate what it means to create content, design interfaces, and build websites in the context of emotion.

Websites, with personalities

In many circumstances, experience designers research and interview their audience as part of the design process so that they can create a profile of a standard user who embodies a larger group. This is called a persona. Personas aid web teams in staying focused on user needs and help with understanding who the target audience is. But what about understanding who the website is?

One of the concepts that I found really exciting, and that I’d like to share, is creating a design persona for your website much like you would for a user. In a way, giving personality to your website. Personality can manifest itself through site architecture, content construction, page layout, and design. Creating a persona for your site helps define the best ways to channel personality in each of those areas.

Personality is also a big part of your brand, and the personality (of a person or a thing) exhibited deeply sways your audience's decision-making process. In higher education, brand plays an important role in defining the character of an institution or school, and highlights the unique characteristics of the departments and offices within the overarching institutional brand. Therefore, establishing personality can be a powerful tool in building websites, establishing your brand, and connecting with your audience – is the site trustworthy? Likeable? Easy to get along with? Does it serve its purpose? Do the benefits of forming a lasting relationship with it outweigh the costs?

Ask yourself: if your website was a person, who would it be?

All of this sounds cool, right? But where do you start? Below is a framework of what to include when creating a design persona for your website as outlined in Designing for Emotion.

What to include in your website persona

Brand Name: The name of your site, service, or company.

Overview: A short overview of the personality of your service. What makes your service or brand personality different?

Personality Image: An image of a person that embodies many of the traits you wish to include in your service or brand. This will help make the personality less abstract. Pick a famous person, or a person with whom your team is familiar. If your brand has a mascot or representative that already embodies the personality, use that instead.

Brand Traits: List five to seven traits that best describe your service along with a trait that you want to avoid. This will help those who are designing and writing for this design persona to create a consistent personality while avoiding the traits that would take your service or brand in the wrong direction.

Personality Map: Personalities can be mapped on an X and Y-axis. The X-axis indicates the degree to which the personality is unfriendly or friendly. The Y-axis shows the degree of submissiveness or dominance.

Voice: If your service or brand could talk, how would they speak? What sorts of things would they say? Would they speak with a folksy vernacular or a refined, erudite clip? Describe the specific aspects of your brands voice, and how it might change in various communication situations. People change their language and tone to fit the situation, and so should the voice of your service or brand.

Copy Examples: Provide examples of the type of copy that might be used in different situations in your interface. This will help writers quickly get a sense for how your design persona should communicate.

Visual Lexicon (optional): If you are a designer creating this document for yourself and/or a design team, you can include in your design persona a visual lexicon providing an overview of the colors, typography, and visual style that will best convey the personality of your service or brand visually.

Engagement Methods: Describe the types of emotional engagement methods you might use in your interface to support the design persona, and create a memorable experience.

You can check out and download Aarron Walter's design persona template (with an example) at http://aarronwalter.com/design-personas.

Words to guide us

Here’s one of my favorite related excerpts from the book:

We’re not just designing pages. We’re designing human experiences. Like the visionaries of the Arts and Crafts movement, we know that preserving the human touch and showing ourselves in our work isn’t optional: it’s essential.

So, what about you? What have you been inspired by lately? Did you stumble upon an inspirational quote? Happen across a motivating article? Read an exciting book? Share with us in the comments.

Categories: 

Comments

Hi Joe, I really like your post.  Similarly, I really appreciate how SWS is a hotbed of creativity and inspiration. (Love you guys!).

When it comes to branding, we have some additional considerations, working at an institution like Stanford, when interacting with units that have their own local culture, vision, and autonomy: the challenge is to help them see how they can express  their brand, within the larger context of the Stanford brand.  That these units are part of Stanford University is hugely important to their success, and hopefully they have someone on staff that realizes that. Thankfully larger units, like the School of Engineering, have communications professionals that understand the gravity --and the importance to their mission-- of the Stanford brand. So making use of the Stanford Identity is always in the best interests. (http://identity.stanford.edu).

The thing I wish more people realized about the Identity Toolkit is that it's, well, a toolkit. There is room for sub-branding, and innovating inside that space. The trick is for groups that are embarking on a new venture that includes design to reach out early in the process to University Communications. Those guys are not the Design Police. They are Creatives that can work with units to arrive at successful sub-brands that fit within the Stanford umbrella, so that they get to enjoy all the benefits.  I know that working with UComm is all wired in to the SWS process, but I wish others knew that they can also go straight to the source!

 

 

 

 

 

Thank you for posting this blog. Stanford Web Services process is very nice.Then the people realized about the Identity Toolkit is that it's well a toolkit. Thanks joe.

Your thought about the Stanford Web Services is wel. Thank you for sharing this.

What a wonderfully written article. Really worth reading.