UX design is all about solving the problems that users actually have — not about solving the problems we assume users want to be solved. That’s why we need to understand users’ feelings and thoughts in a specific situation by using our own experiences to relate theirs. That’s when empathy comes into play: the ability to understand and share the feelings of another.
Empathy is a critical part of human-centered design, and it starts at the research stage. If you are the one who is conducting interviews, here are a couple of tips to help you empathize better with your participant:
All of these elements can influence our ability to empathize with our users and therefore solve problems they actually have. If we don’t practice empathy, we’ll be left with sympathy, assuming the problems our users want solved rather than identifying their real concerns.
A good method for developing empathy for users is creating empathy maps. We’ll cover how you can make your own empathy map step by step and demonstrate what they’re useful for.
An empathy map is a design tool that represents a collaborative visualization of what we know about the user. It breaks down each user interview into digestible pieces of information.
Empathy maps shed light on which problems to solve and how. They are widely used throughout the Agile design process, and they are most useful at the beginning of the design process, after user research but before concepting.
Empathy maps:
You’ve probably heard a lot about mapping in the UX space, so let’s clarify some terms.
Empathy maps are not replacements for journey maps. Journey maps provide a visualization of the end-to-end user experience, whereas empathy maps offer a focused view based on the specific problem statement.
Let’s take a closer look at how these maps are different from one other:
| Journey maps | Empathy maps |
| Showcase a detailed footprint of user interactions | Abstract visualizations about the user’s mental model |
| Represent movement from point A to B to C in order to complete a designated task | Paint a picture about the task itself from a broader point of view |
| The product (or the experience) has to be already designed in order to have a journey map | An empathy map is used for informing the potential design concepts (aka “before” the experience is designed) |
| Helpful artifacts for the entire cross-functional team (especially stakeholders in marketing) | Powerful tools for designers and researchers |
Traditional empathy maps are created as a 2×2 grid (four quadrants), each quadrant representing what the user:
Once the user interviews have been conducted, the designer (and/or the team) come together to reflect and add sticky notes (with quotes and observations) into each specific quadrant.
Empathy maps can either be made for an individual user or a group of users in order to begin identifying patterns.
Let’s walk through the steps to create one, and then we’ll explain how to use an empathy map.
While empathy maps vary in format, they all have common elements. A whiteboard (or a large piece of paper, or FigJam in the world of remote working) is divided into sections with the user at the center. We label each quadrant with a category that explores both the user’s external and internal world: what the user is saying, thinking, doing, and feeling.
Before the actual mapping, make sure to have an agreement on the goals and the scope. Is this map for a predetermined persona (from marketing research) or an individual user from the specific user interview? Will the team work together in a workshop environment to fill out the quadrants? Is the end goal to validate the problem statement or figuring out the research gaps?
Let’s go over an example to demonstrate the process. The objective was to improve the shopping experience for an ecommerce website, and we conducted user interviews about the overall experience when it comes to buying shoes online.
The Says quadrant contains direct quotes from the research. I recommend keeping it verbatim so that nothing gets lost in translation or paraphrased by mistake.
For example:
We take these and put them as individual sticky notes in the Says quadrant.
The Thinks quadrant represents the user’s thoughts on the given topic. Since us humans are not yet capable of mind reading, these “thoughts” will be our interpretation of what the user might think during the research/interviews.
That’s why the Thinks quadrant also represents “implications”; the things that they didn’t actually say out loud but we think they might mean it. Be aware of their body language as well. It might reveal hints about their true intentions, especially if they are hesitating or afraid of being judged or maybe they are just simply being nice and hiding their true feelings. (If your sticky note is based on assumptions, make sure to note that in the map as well.)
It is possible to have the same content in both Says and Thinks quadrants as well as contradicting information since what the user says out loud that might not match what they actually think, and that’s totally normal.
Examples:
We take these and put them in individual sticky notes in The Says quadrant.
The Does quadrant showcases the particular actions that the user takes regarding the topic or the particular things that they do during the interview.
It can be both the physical actions while interacting with the product (refreshing, tapping, closing, adding an item to a cart…), or the steps they would take throughout the process (asking a friend, reading comments, calling a representative…).
Examples:
We take these and put them in individual sticky notes in the Does quadrant.
The Feels quadrant represents the user’s feeling and what is causing this. It is often written as “an adjective + the reason.”
Pay attention to the positive and negative sides of thoughts. What makes the user feel good or bad? Frightened? Excited? Anxious? Worried? Think about the root cause that’s related to the feeling.
Examples:
We take these and put them in individual sticky notes in the Feels quadrant.
When all the quadrants are filled with sticky notes, take a moment to reflect. The purpose of the mapping is to put the user at the center and put you in their shoes.
Within each quadrant, look for similar themes, move them closer together, label them. Mark the stickies if they are based on assumptions, indicate if any followups needed, or label if they are contradicting with each other. Bring them back to the team and talk about:
Just because the workshop is over, that doesn’t mean the empathy map can be thrown away. Even though empathy maps shine the brightest during the early stages of the product development cycle (e.g., ideation and research), they can still be used as a powerful aid throughout the rest of the process (prototyping, sourcing, costing, and commercialization).
Since they provide a deep dive into the users as a whole, empathy maps can be leveraged as a design artifact that can be used to fact check throughout the development. If a user assumption needs to be validated, reference your empathy map’s related quadrant. Or if the team needs alignment on metric definitions such as OKRs, KPIs, or leading and lagging indicators, use your empathy map as a starting point.
Keep in mind that iteration is the key when it comes to developing successful products, and with every new version of the experience, we also learn more about user behaviors. Make sure to update your empathy maps whenever there’s a new input, research, study, or interview that’s related to that map’s specific user.
Here are a couple of tips and tricks to help you get started making effective empathy maps.
Empathizing is the number one superpower for designers to spot user problems, and solving user problems is the ultimate goal of UX design. Take advantage of empathy mapping and use it as a powerful tool in the product development cycle.
Header image source: Flaticon
LogRocket lets you replay users' product experiences to visualize struggle, see issues affecting adoption, and combine qualitative and quantitative data so you can create amazing digital experiences.
See how design choices, interactions, and issues affect your users — get a demo of LogRocket today.
Nostalgia-driven aesthetics is a real thing. In this blog, I talk all about 90s website designs — from grunge-inspired typography to quirky GIFs and clashing colors — and what you can learn from them.
You’ll need to read this blog through and through to know what’s working and what’s not in your design. In this one, I break down key performance metrics like task error rates and system performance.
Users see a product; designers see layers. The 5 UX design layers — strategy, scope, structure, skeleton, and surface — help build UIs step by step.
This blog’s all about learning to set up, manage, and use design tokens in design system — all to enable scalable, consistent, and efficient collaboration between designers and developers.
Learn more →
