{"id":17671,"date":"2019-05-03T15:36:45","date_gmt":"2019-05-03T14:36:45","guid":{"rendered":"https:\/\/marvel7077.wpengine.com\/?p=17671"},"modified":"2020-12-14T11:11:40","modified_gmt":"2020-12-14T11:11:40","slug":"beginners-guide-user-journey-mapping","status":"publish","type":"post","link":"https:\/\/www.marvelapp.net\/blog\/beginners-guide-user-journey-mapping\/","title":{"rendered":"A Beginner\u2019s Guide To User Journey\u00a0Mapping"},"content":{"rendered":"<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\"><em>\u2018How do people actually use our product?\u2019 <\/em>is a fundamental question that every product creator must answer. In order to answer this question, product designers need to understand the essence of the whole experience from the user\u2019s perspective. User <a class=\"link link--blue fontWeight-4\"href=\"https:\/\/www.marvelapp.net\/blog\/how-to-build-an-experience-map\/\">journey mapping<\/a> is an excellent exercise that can shed light on that.<\/p>\n<h2 class=\"pageWrap pageWrap--s marginTop-xl marginBottom-l c-black lineHeight-xl fontSize-xl fontWeight-5 breakPointM-lineHeight-xxl breakPointM-fontSize-xxl\" style=\"margin-left: auto; margin-right: auto;\">What is a user journey map?<\/h2>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">A user journey map is a visualization of an individual\u2019s relationships with a product\/brand over time and across different channels.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">While user journey maps come in all shapes and formats, commonly it\u2019s represented as a timeline of all touchpoints between a user and a product. This timeline contains information about all channels that users use to interact with a product.<\/p>\n<div id=\"attachment_6580\" style=\"width: 1008px\" class=\"wp-caption aligncenter\"><a class=\"link link--blue fontWeight-4\"href=\"https:\/\/marvel7077.wpengine.com\/wp-content\/uploads\/2019\/05\/0senMqoo-gyaQznua.png\"><img loading=\"lazy\" decoding=\"async\" aria-describedby=\"caption-attachment-6580\" class=\"wp-image-6580 size-full\" src=\"https:\/\/marvel7077.wpengine.com\/wp-content\/uploads\/2019\/05\/0senMqoo-gyaQznua.png\" alt=\"A user journey map template\" width=\"998\" height=\"684\" \/><\/a><p id=\"caption-attachment-6580\" class=\"wp-caption-text\">A user journey map template. Image:\u00a0<a class=\"link link--blue fontWeight-4\"href=\"https:\/\/www.nngroup.com\/articles\/customer-journey-mapping\/\">NNGroup<\/a><\/p><\/div>\n<h2 class=\"pageWrap pageWrap--s marginTop-xl marginBottom-l c-black lineHeight-xl fontSize-xl fontWeight-5 breakPointM-lineHeight-xxl breakPointM-fontSize-xxl\" style=\"margin-left: auto; margin-right: auto;\">What design problems user journey helps us to\u00a0solve?<\/h2>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">User journey map is an excellent tool for UX designers because<\/p>\n<blockquote class=\"pageWrap pageWrap--s position-relative marginTopBottom-l breakPointM-marginTopBottom-xl\"><div class=\"blog-quote-before position-absolute bg-marvel\"><\/div><div class=\"tweet-quote blog-quote-after position-absolute bg-marvel cursor-pointer transitionDuration-l transitionProperty-all transitionTimingFunction-cv-easeOutCircular scaleUp--hover zi-weak\"><svg class=\"fill-white opacity-0 pointerEvents-none position-absolute pinCenter transitionProperty-all transitionTimingFunction-easeInOut\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"24\" height=\"20\" viewBox=\"0 0 24 20\"><path d=\"M24,2.37a9.64,9.64,0,0,1-2.83.79A5,5,0,0,0,23.34.37a9.72,9.72,0,0,1-3.13,1.23A4.86,4.86,0,0,0,16.62,0a5,5,0,0,0-4.8,6.2A13.87,13.87,0,0,1,1.67.92,5.13,5.13,0,0,0,3.19,7.67,4.81,4.81,0,0,1,1,7a5,5,0,0,0,3.95,5,4.82,4.82,0,0,1-2.22.09,4.94,4.94,0,0,0,4.6,3.51A9.72,9.72,0,0,1,0,17.73,13.69,13.69,0,0,0,7.55,20c9.14,0,14.31-7.92,14-15A10.17,10.17,0,0,0,24,2.37Z\"\/><\/svg><\/div><p class=\"blog-quote position-relative textAlign-center c-marvel\"><span class=\"blog-quote-text transitionDuration-l transitionProperty-all transitionTimingFunction-easeInOut\">\"It visualizes how a user interacts with a product and allows designers to see a product from a user\u2019s point of\u00a0view.\"<\/p><\/span><\/blockquote>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">This fosters a more user-centric approach to product design, which ultimately leads to better user experience.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">User journey map helps a product team to find the answer to the \u201c<em>What if..<\/em>?\u201d questions. Also, a user journey map can be helpful when the company tracks quantitative KPIs. In this case, a user journey map has an opportunity to become a cornerstone for strategic recommendations.<\/p>\n<h2 class=\"pageWrap pageWrap--s marginTop-xl marginBottom-l c-black lineHeight-xl fontSize-xl fontWeight-5 breakPointM-lineHeight-xxl breakPointM-fontSize-xxl\" style=\"margin-left: auto; margin-right: auto;\">The 8-steps user journey mapping process<\/h2>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">Before creating a user journey map, it\u2019s important to review the goals of your business\/service. This knowledge will help you align business and user goals.<\/p>\n<h2 class=\"pageWrap pageWrap--s marginTop-xl marginBottom-l c-black lineHeight-xl fontSize-xl fontWeight-5 breakPointM-lineHeight-xxl breakPointM-fontSize-xxl\" style=\"margin-left: auto; margin-right: auto;\">1. Choose a\u00a0scope<\/h2>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">The scope of the user journey map can vary from the high-level map which shows end-to-end experience to a more detailed map that focuses on one particular interaction (for instance, paying a bill).<\/p>\n<h2 class=\"pageWrap pageWrap--s marginTop-xl marginBottom-l c-black lineHeight-xl fontSize-xl fontWeight-5 breakPointM-lineHeight-xxl breakPointM-fontSize-xxl\" style=\"margin-left: auto; margin-right: auto;\">2. Create a user\u00a0persona<\/h2>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\"><em>Who is your user?<\/em><\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">A user journey map is always focused on the experience of one main actor \u2014 a user persona who experiences the journey.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">User persona should always be created based on information you have about your target audience. That\u2019s why always start with user research. Having solid information about your users will prevent you from making false assumptions.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">Gather and analyze all available information about your target audience:<\/p>\n<ul class=\"pageWrap pageWrap--s list list--unordered marginBottom-l lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">\n<li>Interview your real or potential users<\/li>\n<li>Conduct contextual inquiry<\/li>\n<li>Analyze the results of user surveys<\/li>\n<\/ul>\n<h2 class=\"pageWrap pageWrap--s marginTop-xl marginBottom-l c-black lineHeight-xl fontSize-xl fontWeight-5 breakPointM-lineHeight-xxl breakPointM-fontSize-xxl\" style=\"margin-left: auto; margin-right: auto;\">3. Define scenario and user expectations<\/h2>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">The scenario describes the situation that the journey map addresses. It can be real or anticipated.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">It\u2019s also important to define what expectations a user persona has about the interaction.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">For example, a scenario can be \u2014 ordering a taxi using a mobile app with expectations to get the car in 5 minutes or less.<\/p>\n<h2 class=\"pageWrap pageWrap--s marginTop-xl marginBottom-l c-black lineHeight-xl fontSize-xl fontWeight-5 breakPointM-lineHeight-xxl breakPointM-fontSize-xxl\" style=\"margin-left: auto; margin-right: auto;\">4. Create a list of touchpoints<\/h2>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">Touchpoints are user actions and interactions with the product\/business. It\u2019s vital to identify all main touchpoints and all channels associated with each touchpoint.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">For example, for touchpoint \u2018Buy a gift,\u2019 channels can be \u2014 purchase online or buy in a store.<\/p>\n<h2 class=\"pageWrap pageWrap--s marginTop-xl marginBottom-l c-black lineHeight-xl fontSize-xl fontWeight-5 breakPointM-lineHeight-xxl breakPointM-fontSize-xxl\" style=\"margin-left: auto; margin-right: auto;\">5. Take user intention into\u00a0account<\/h2>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\"><em>What motivates your user to interact with your product?<\/em><\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">What problem are users looking to solve when they decide to use your product? Different user segments will have different reasons.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">Let\u2019s take an e-commerce website. There is a big difference between a user who is just looking around and a user who wants to accomplish a specific task (purchase a particular product).<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">For each user journey it\u2019s vital to understand:<\/p>\n<ul class=\"pageWrap pageWrap--s list list--unordered marginBottom-l lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">\n<li><em>Motivation<\/em>. Why are they trying to do it?<\/li>\n<li><em>Channels<\/em>. Where interaction takes place<\/li>\n<li><em>Actions.<\/em> The actual behaviors and steps taken by users.<\/li>\n<li><em>Pain points.<\/em> What are the challenges users are facing?<\/li>\n<\/ul>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\"><strong class=\"c-slate lineHeight-l fontSize-l fontWeight-5 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">Tip:<\/strong> Ensure that the user is getting a consistent experience across all channels.<\/p>\n<h2 class=\"pageWrap pageWrap--s marginTop-xl marginBottom-l c-black lineHeight-xl fontSize-xl fontWeight-5 breakPointM-lineHeight-xxl breakPointM-fontSize-xxl\" style=\"margin-left: auto; margin-right: auto;\">6. Sketch the\u00a0journey<\/h2>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">Put together all the information you have and sketch a journey in a format of step-by-step interaction. Each step demonstrates an experience that the persona has with a service\/product or another person.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">Here are <a class=\"link link--blue fontWeight-4\"href=\"https:\/\/uxpro.cc\/toolbox\/ux-design\/user-journey\/\">a few tools<\/a> that can be helpful during user journey mapping:<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\"><a class=\"link link--blue fontWeight-4\"title=\"https:\/\/uxpro.cc\/toolbox\/ux-design\/user-journey\/\" href=\"https:\/\/uxpro.cc\/toolbox\/ux-design\/user-journey\/\"><strong class=\"c-slate lineHeight-l fontSize-l fontWeight-5 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">User Journey | UX Pro<\/strong><br \/>\n<em>User and Customer Journey Mapping Tools<\/em>uxpro.cc<\/a><\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\"><strong class=\"c-slate lineHeight-l fontSize-l fontWeight-5 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">Tip:<\/strong> A tool called storyboard can help you show how users can interact with a product. Using storyboard, you can show visually what happens during each step.<\/p>\n<div id=\"attachment_6580\" style=\"width: 1272px\" class=\"wp-caption aligncenter\"><a class=\"link link--blue fontWeight-4\"href=\"https:\/\/marvel7077.wpengine.com\/wp-content\/uploads\/2019\/05\/1No9D6azPgPhAjmaMyhWyLg.jpeg\"><img loading=\"lazy\" decoding=\"async\" aria-describedby=\"caption-attachment-6580\" class=\"wp-image-6580 size-full\" src=\"https:\/\/marvel7077.wpengine.com\/wp-content\/uploads\/2019\/05\/1No9D6azPgPhAjmaMyhWyLg.jpeg\" alt=\"A storyboard can help you build a strong, clear narrative. Image credit: Chelsea Hostetter, Austin Center for\u00a0Design\" width=\"1262\" height=\"817\" \/><\/a><p id=\"caption-attachment-6580\" class=\"wp-caption-text\">A storyboard can help you build a strong, clear narrative. Image credit: Chelsea Hostetter, Austin Center for\u00a0Design<\/p><\/div>\n<h2 class=\"pageWrap pageWrap--s marginTop-xl marginBottom-l c-black lineHeight-xl fontSize-xl fontWeight-5 breakPointM-lineHeight-xxl breakPointM-fontSize-xxl\" style=\"margin-left: auto; margin-right: auto;\">7. Consider a user\u2019s emotional state during each step of interaction<\/h2>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\"><em>What does a user feel when interacting with your product?<\/em><\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">Products we design need to mirror the state of mind of our users. When we consider a user\u2019s emotional state, this knowledge will help us to connect with users on a human level. That\u2019s why it\u2019s important to add an emotional lane to the user journey map. By visualizing the emotional \u201cups\u201d and \u201cdowns\u201d of the experience you\u2019ll show the areas of experience that require refinement.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\"><strong class=\"c-slate lineHeight-l fontSize-l fontWeight-5 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">Tip:<\/strong> Create an <em>empathy map<\/em> to better understand how the user feels.<\/p>\n<div id=\"attachment_6580\" style=\"width: 3801px\" class=\"wp-caption aligncenter\"><a class=\"link link--blue fontWeight-4\"href=\"https:\/\/marvel7077.wpengine.com\/wp-content\/uploads\/2019\/05\/1I1ffOWdPWQva3dCMQE-TAQ.png\"><img loading=\"lazy\" decoding=\"async\" aria-describedby=\"caption-attachment-6580\" class=\"wp-image-6580 size-full\" src=\"https:\/\/marvel7077.wpengine.com\/wp-content\/uploads\/2019\/05\/1I1ffOWdPWQva3dCMQE-TAQ.png\" alt=\"Empathy map canvas \" width=\"3791\" height=\"2452\" \/><\/a><p id=\"caption-attachment-6580\" class=\"wp-caption-text\">Empathy map canvas by <a class=\"link link--blue fontWeight-4\"href=\"https:\/\/medium.com\/@davegray\">Dave\u00a0Gray<\/a><\/p><\/div>\n<h2 class=\"pageWrap pageWrap--s marginTop-xl marginBottom-l c-black lineHeight-xl fontSize-xl fontWeight-5 breakPointM-lineHeight-xxl breakPointM-fontSize-xxl\" style=\"margin-left: auto; margin-right: auto;\">8. Validate and refine user\u00a0journey<\/h2>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">Journey maps should result in truthful narratives, not fairy tales. Even when a user journey is based on user research, it\u2019s vital to validate it. Use the information from usability testing sessions and app analytics to be sure that your journey resembles a real use case.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">Gather and analyze information about your users on a regular basis. For example, user feedback is something that can be used to improve your understanding of the user journey.<\/p>\n<h2 class=\"pageWrap pageWrap--s marginTop-xl marginBottom-l c-black lineHeight-xl fontSize-xl fontWeight-5 breakPointM-lineHeight-xxl breakPointM-fontSize-xxl\" style=\"margin-left: auto; margin-right: auto;\">Conclusion<\/h2>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">It\u2019s important to remember that the goal of creating a user journey map is to create a shared vision. That\u2019s why once a user journey map is created, share it with your peers. Make it possible for everyone in your team to look at the entire experience from the user\u2019s standpoint and user this information while crafting a product.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\"><em>Originally published at <\/em><a class=\"link link--blue fontWeight-4\"href=\"http:\/\/babich.biz\/user-journey-map\/\"><em>babich.biz<\/em><\/a><\/p>\n<h3 class=\"pageWrap pageWrap--s marginTop-l marginBottom-m c-black lineHeight-xl fontSize-xl fontWeight-5\">Further reading:<\/h3>\n<ul class=\"pageWrap pageWrap--s list list--unordered marginBottom-l lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">\n<li class=\"LinkSuggestion__LinkSuggestionWrapper-sc-1mdih4x-0 bRwwZe\"><a class=\"link link--blue fontWeight-4\"class=\"LinkSuggestion__Link-sc-1mdih4x-2 dcwLhi\" href=\"https:\/\/www.marvelapp.net\/blog\/run-empathy-user-journey-mapping-workshop\/\" target=\"_blank\" rel=\"noopener noreferrer\">How to Run an Empathy &amp; User Journey Mapping Workshop<\/a><\/li>\n<li class=\"LinkSuggestion__LinkSuggestionWrapper-sc-1mdih4x-0 bRwwZe\"><a class=\"link link--blue fontWeight-4\"class=\"LinkSuggestion__Link-sc-1mdih4x-2 dcwLhi\" href=\"https:\/\/www.marvelapp.net\/blog\/intro-ux-research\/\" target=\"_blank\" rel=\"noopener noreferrer\">Intro to UX Research<\/a><\/li>\n<li class=\"LinkSuggestion__LinkSuggestionWrapper-sc-1mdih4x-0 bRwwZe\"><a class=\"link link--blue fontWeight-4\"class=\"LinkSuggestion__Link-sc-1mdih4x-2 dcwLhi\" href=\"https:\/\/www.marvelapp.net\/blog\/start-your-design-led-journey\/\" target=\"_blank\" rel=\"noopener noreferrer\">Starting your journey to becoming design led<\/a><\/li>\n<li class=\"LinkSuggestion__LinkSuggestionWrapper-sc-1mdih4x-0 bRwwZe\"><a class=\"link link--blue fontWeight-4\"class=\"LinkSuggestion__Link-sc-1mdih4x-2 dcwLhi\" href=\"https:\/\/www.marvelapp.net\/blog\/showing-process-important\/\" target=\"_blank\" rel=\"noopener noreferrer\">Why Showing Your Process is So Important!<\/a><\/li>\n<li class=\"LinkSuggestion__LinkSuggestionWrapper-sc-1mdih4x-0 bRwwZe\"><a class=\"link link--blue fontWeight-4\"class=\"LinkSuggestion__Link-sc-1mdih4x-2 dcwLhi\" href=\"https:\/\/www.marvelapp.net\/blog\/product-design-playbook\/\" target=\"_blank\" rel=\"noopener noreferrer\">Product Design Playbook<\/a><\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>\u2018How do people actually use our product?\u2019 is a fundamental question that every product creator must answer. In order to answer this question, product designers need to understand the essence of the whole experience from the user\u2019s perspective. User journey mapping is an excellent exercise that can shed light on that. What is a user journey map? A user journey&#8230; <a class=\"link link--blue fontWeight-4\" href=\"https:\/\/www.marvelapp.net\/blog\/beginners-guide-user-journey-mapping\/\">Read More &#65515;<\/a><\/p>\n","protected":false},"author":165,"featured_media":17680,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[11],"tags":[],"class_list":["post-17671","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-viewpoint"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v15.5 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<meta name=\"description\" content=\"A user journey map is a visualization of an individual\u2019s relationships with a product\/brand over time and across different channels.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.marvelapp.net\/blog\/beginners-guide-user-journey-mapping\/\" \/>\n<meta property=\"og:locale\" content=\"en_GB\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"A Beginner\u2019s Guide To User Journey\u00a0Mapping | Marvel Blog\" \/>\n<meta property=\"og:description\" content=\"A user journey map is a visualization of an individual\u2019s relationships with a product\/brand over time and across different channels.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.marvelapp.net\/blog\/beginners-guide-user-journey-mapping\/\" \/>\n<meta property=\"og:site_name\" content=\"Marvel Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/marvelapp\" \/>\n<meta property=\"article:published_time\" content=\"2019-05-03T14:36:45+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2020-12-14T11:11:40+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.marvelapp.net\/wp-content\/uploads\/2019\/05\/userjourneyyy.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1600\" \/>\n\t<meta property=\"og:image:height\" content=\"800\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@marvelapp\" \/>\n<meta name=\"twitter:site\" content=\"@marvelapp\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\">\n\t<meta name=\"twitter:data1\" content=\"4 minutes\">\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.marvelapp.net\/blog\/#organization\",\"name\":\"Marvel\",\"url\":\"https:\/\/www.marvelapp.net\/blog\/\",\"sameAs\":[\"https:\/\/www.facebook.com\/marvelapp\",\"https:\/\/www.instagram.com\/marvelapp\/\",\"https:\/\/www.linkedin.com\/company\/marvel-app\/\",\"https:\/\/twitter.com\/marvelapp\"],\"logo\":{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/www.marvelapp.net\/blog\/#logo\",\"inLanguage\":\"en-GB\",\"url\":\"https:\/\/www.marvelapp.net\/wp-content\/uploads\/2018\/06\/Logo-Light.png\",\"width\":1605,\"height\":1130,\"caption\":\"Marvel\"},\"image\":{\"@id\":\"https:\/\/www.marvelapp.net\/blog\/#logo\"}},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.marvelapp.net\/blog\/#website\",\"url\":\"https:\/\/www.marvelapp.net\/blog\/\",\"name\":\"Marvel Blog\",\"description\":\"Ideas and words on user experience, design, collaboration and more\",\"publisher\":{\"@id\":\"https:\/\/www.marvelapp.net\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":\"https:\/\/www.marvelapp.net\/blog\/?s={search_term_string}\",\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-GB\"},{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/www.marvelapp.net\/blog\/beginners-guide-user-journey-mapping\/#primaryimage\",\"inLanguage\":\"en-GB\",\"url\":\"https:\/\/www.marvelapp.net\/wp-content\/uploads\/2019\/05\/userjourneyyy.png\",\"width\":\"1600\",\"height\":\"800\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.marvelapp.net\/blog\/beginners-guide-user-journey-mapping\/#webpage\",\"url\":\"https:\/\/www.marvelapp.net\/blog\/beginners-guide-user-journey-mapping\/\",\"name\":\"A Beginner\\u2019s Guide To User Journey\\u00a0Mapping | Marvel Blog\",\"isPartOf\":{\"@id\":\"https:\/\/www.marvelapp.net\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.marvelapp.net\/blog\/beginners-guide-user-journey-mapping\/#primaryimage\"},\"datePublished\":\"2019-05-03T14:36:45+00:00\",\"dateModified\":\"2020-12-14T11:11:40+00:00\",\"description\":\"A user journey map is a visualization of an individual\\u2019s relationships with a product\/brand over time and across different channels.\",\"inLanguage\":\"en-GB\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.marvelapp.net\/blog\/beginners-guide-user-journey-mapping\/\"]}]},{\"@type\":\"Article\",\"@id\":\"https:\/\/www.marvelapp.net\/blog\/beginners-guide-user-journey-mapping\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.marvelapp.net\/blog\/beginners-guide-user-journey-mapping\/#webpage\"},\"author\":{\"@id\":\"https:\/\/www.marvelapp.net\/blog\/#\/schema\/person\/628149198b3652cd6341d5d8baf3c872\"},\"headline\":\"A Beginner\\u2019s Guide To User Journey\\u00a0Mapping\",\"datePublished\":\"2019-05-03T14:36:45+00:00\",\"dateModified\":\"2020-12-14T11:11:40+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.marvelapp.net\/blog\/beginners-guide-user-journey-mapping\/#webpage\"},\"commentCount\":1,\"publisher\":{\"@id\":\"https:\/\/www.marvelapp.net\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/www.marvelapp.net\/blog\/beginners-guide-user-journey-mapping\/#primaryimage\"},\"articleSection\":\"Viewpoint\",\"inLanguage\":\"en-GB\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/www.marvelapp.net\/blog\/beginners-guide-user-journey-mapping\/#respond\"]}]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.marvelapp.net\/blog\/#\/schema\/person\/628149198b3652cd6341d5d8baf3c872\",\"name\":\"Nick Babich\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/www.marvelapp.net\/blog\/#personlogo\",\"inLanguage\":\"en-GB\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/2b91d9b457afee054f90b68440ad9e23902300b23c8109206f0a7d32fe0fbea4?s=96&d=mm&r=g\",\"caption\":\"Nick Babich\"},\"description\":\"I\\u2019m a software developer, tech enthusiast and UI\/UX lover. http:\/\/babich.biz\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","_links":{"self":[{"href":"https:\/\/www.marvelapp.net\/blog\/wp-json\/wp\/v2\/posts\/17671","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.marvelapp.net\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.marvelapp.net\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.marvelapp.net\/blog\/wp-json\/wp\/v2\/users\/165"}],"replies":[{"embeddable":true,"href":"https:\/\/www.marvelapp.net\/blog\/wp-json\/wp\/v2\/comments?post=17671"}],"version-history":[{"count":0,"href":"https:\/\/www.marvelapp.net\/blog\/wp-json\/wp\/v2\/posts\/17671\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.marvelapp.net\/blog\/wp-json\/wp\/v2\/media\/17680"}],"wp:attachment":[{"href":"https:\/\/www.marvelapp.net\/blog\/wp-json\/wp\/v2\/media?parent=17671"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.marvelapp.net\/blog\/wp-json\/wp\/v2\/categories?post=17671"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.marvelapp.net\/blog\/wp-json\/wp\/v2\/tags?post=17671"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}