Part of designing a great user experience is understanding how people interact with a company, its products, and its services. A user journey map tells the story of these relationships. It allows you to explore these interactions in a structured way, and in the process, uncover new opportunities for improving the overall experience for site visitors.
In this comprehensive guide, you’ll discover what user journey mapping is in web design, how to create your own and what such maps usually include. In addition, we’ll also review some of the variations closely related to user journey maps.
What is a user journey map?
A user journey map illustrates the interactions visitors have with a product or service over time. It outlines the various touchpoints and channels where people come in contact with a company. It also maps out the actions that they take, plus the thoughts and emotions they have along the way, visualizing all of these elements in an understandable and actionable manner.
User journey mapping can be used in a variety of ways. You can use it to visualize an entire end-to-end experience, or to better understand a specific, smaller interaction within a larger experience. You can create user journey maps for an existing product, or to explore future concepts and designs.
As a tool of discovery, user journey mapping allows you to analyze your users’ experience in a systematic and structured way. At each step of the journey, you can identify any gaps in the experience and brainstorm opportunities for improvement.
As a tool of collaboration, user journey mapping can help facilitate conversation and co-creation across teams. At the core of these collaborative efforts, a user journey map can serve as a shared vision, or even a plan of action, to help guide companies in making user-centered decisions.
How to create a user journey map
Before we jump in, there are a few things to keep in mind about user journey maps:
Design: There is no single way to create a user journey map. You can sketch it on paper, use sticky notes on a whiteboard, organize it in a spreadsheet, or create it using your favorite design tool. Choose the format that makes the most sense for you or your team.
Research-backed tools: User journey maps are based on existing research and data from your users. You can start by gathering any design artifacts that your team or organization has already created, such as user intent, storyboards, or user research reports. For areas where you don’t have any data yet, you can start with an informed estimate and validate later with additional research.
Collaboration: One of the most valuable aspects of user journey mapping is the conversation and collaboration that happens during the process. Make sure to invite important stakeholders to take part, whose expertise and buy-in are required for helping turn the newfound insights into concrete projects.
Now let’s look at the steps for creating a user journey map:
1. Determine user intent
User intent tells you what the user is looking to do. Is their intent informational, ie., looking for information like event details? Is their intent transactional, as in, they plan to make a purchase? Having a clear understanding of user intent helps provide a strong, clear narrative for your user journey map and will ultimately improve user experience by helping them easily reach their end goal.
Take a delivery app, for instance. If you’re designing a food delivery app, you could create a user journey map for delivery customers, and a separate one for delivery couriers.
2. Determine a scenario
Once you’ve landed on the user intent, select the scenario you want to map out. User scenarios describe a specific goal that a user wants to accomplish, the motivation behind that goal, and the steps they would take to achieve that goal.
An example scenario might be: Jody wants to schedule a cake delivery for her friend’s birthday. She expects that she’ll be able to choose a cake design, add a custom message, select the delivery time, and receive real-time updates about the preparation and delivery status.
3. Define the stages of your scenario
Based on the scenario that you’ve chosen, define the high-level stages of your user journey. The stages can be as broad or as specific as you like. Their purpose is to help you organize the rest of the information on your map.
The stages of your food delivery app might be: awareness, browse, order, wait, receive, consume and share.
4. Map user actions, thoughts, and emotions
For each stage of your user journey, list the actions that your user takes, and the thoughts and emotions that they have along the way. The thoughts can be any questions that they’re asking, or any hopes and fears they might have. The emotions are anything that they might be feeling, and can be labeled with words, smiley faces or a line that signals the emotional ups and downs of the experience. You can also supplement these descriptions with quotes and statistics from your research.
For users of your food delivery app who are in the Browse stage, their actions might include scanning menus, looking at pictures and checking out restaurant reviews. They might be thinking of trying out a new restaurant, which leads them to wonder what a certain restaurant’s popular dishes are. They might be feeling excited as they browse the photos, or concerned that the menu doesn’t have a lot of options for their dietary preferences.
5. Specify touchpoints and channels
Next, list out which of your users’ actions brings them in contact with the company, its products, or its services? These are the touchpoints, or the physical and digital interaction that your user has with your company. You can also include the channels through which these interactions occur.
With our food delivery app example, a touchpoint might be the customer receiving updates about the status of a food delivery. These updates could be delivered through a number of channels, like text message, phone call, or through a home voice assistant.
6. Identify the opportunities for improvement
Now that you’ve mapped out your user journey, are there any areas where the experience can be improved? Maybe you’ve noticed empty states, 404 pages, or design elements that are surprising, inconsistent, or redundant. These can be great jumping off points for brainstorming a better experience for your users.
At this stage, you might also want to identify any next steps, such as scheduling a separate brainstorming session, or assigning a person or team to look further into a specific part of the journey.
Finally, even though a user journey map should be created based on user research, it’s still important to verify that the information on it is truly accurate. One way to do this is to show the map to a few customers and ask them if anything is missing or seems out of sequence [Related: Learn how to make the most of styled horizontal menus.]
What to include in a user journey map
Most user journey maps are made up of a few main components. Remember, user journey maps come in all shapes and sizes, so feel free to adapt these elements to fit your needs, and in a way that makes sense to you and your team.
The lens: The top section of the user journey map details the user’s point of view, which might include reference to a persona or user intent, the scenario, and any goals and expectations that the user has for this scenario.
The experience: The heart of the user journey map is the experience, which includes the stages of their journey. Listed under each stage are the user’s actions, thoughts and emotions, and the touchpoints and channels that facilitate their interactions with your company.
The insights: The bottom section of the user journey map lists insights, recommendations and opportunities for improvement. It can also mention the people, teams, or departments who will be responsible for carrying these efforts forward.
[Related: How to adapt to a cookie-free future]
4 variations of user journey maps
There are several frameworks that are closely related to user journey mapping. These can be used in combination with your user journey map or on their own, depending on your needs.
Empathy map
An empathy map helps us organize and visualize a user’s mindset, as a way to build empathy for our end users. They’re often used to help categorize user research notes during the discovery phase.
An empathy map has different sections (e.g., Think, Feel, See, Say, Do, or Hear) where you can organize research findings.
Unlike a user journey map, an empathy map is not laid out in sequential order. However, it does focus on a single user’s perspective. Empathy maps are great for organizing insights prior to, or as a supplement to, user journey mapping.
Experience map
An experience map visualizes a general human experience over time (like buying a home, or the stages of sleep). Experience maps serve as a baseline for understanding such experiences, and they help designers identify areas which can be improved with a product or service.
An experience map is visualized in stages, much like a user journey map. It can also include information like actions, thoughts and emotions. The main difference is that the experience map is not tied to any particular user, product, or company, since its purpose is to outline a broader human experience.
User story map
A user story map consists of user stories and tasks to visualize an entire system. A user story map helps with planning and implementation of such systems, and allows designers and development teams to create a shared understanding of what they’re building.
A user story map includes high-level descriptions of a feature, which can be described as user story (for example, as a real estate agent, I might want to create beautiful marketing assets quickly, so that I can spend more time interacting with clients).
Listed vertically under each feature are more detailed tasks and functionality that must be built into each feature (such as: choose template, import listing information, import photos, export file, and so on). The most important features are prioritized toward the top, while lower-priority features are labeled for future releases.
Similar to a user journey map, a user story map outlines sequential steps. However, a user story map takes the perspective of the product and the functionality it requires. One way to create a user story map is to take the steps from your journey map and add to them the concrete features and functionality that would be required to help users carry out these actions successfully.
Service blueprint
A service blueprint maps the steps that an organization needs to take internally to support a customer journey. This is different than a wireframe. Rather than focusing on the end user, a service blueprint is focused on the employees, resources, and processes that are required to deliver a service. It helps companies gain a fuller understanding of the services they need to deliver at each stage of a user journey.
A service blueprint typically outlines the touchpoints and actions that are visible to the customer, those that happen behind the scenes (which the customer doesn’t see), and the resources and processes needed to support these interactions. A service blueprint can also point out any codependencies, time, regulations, emotions, or metrics that are relevant to the service.
Similar to user journey maps, a service blueprint outlines steps in a sequential order. However, service blueprints take the perspective of a business, describing what’s needed to provide a certain level of service. One way to create a service blueprint is to take the steps from your journey map, and add the details for how a business would function in order to make each step a success for the user.
Some parting words
User journey mapping is a great exercise for developing a deep understanding of your customer’s experience with a company, its products and its services. Through its visual and storytelling format, you can get a keen sense for your user’s experience, while diving into the minute details of each step and each interaction. When done well, user journey maps are valuable tools for uncovering unique opportunities for improving the experience of your product or service for users.
.jpg)
