The eCommerce Customer Journey Map:
A Tool for Organizing Users’ Thoughts and Emotions
Our take on the customer empathy map came about as a way to distill and organize qualitative data. We start every project by interviewing and observing current and potential customers to better understand their pain points and aspirations. Then, as we sift through pages of raw notes, sketches, audio/video files and photos, we use the empathy map to glean the juicy parts and make it visual to help drive the User Persona and eventually the Creative Brief.
Frequently Asked Questions
What is customer journey mapping?
This is a handy method for seeing your online store through the eyes of your users by stepping through each part of the customers' experience in a granular way.
Why does UX testing work?
You’ll often be surprised by interviewing users and asking them to step through the stages of the customer journey under your observation. The empathy map is a fantastic tool for helping organize all the great feedback you will capture.
How To Do eCommerce Customer Journey Mapping
STEP 1: COLLECT MATERIALS
Print out the digital empathy map on a large format printer (download link at bottom) – we recommend at least 2’x 2.5′ (the bigger the better). Then, find a place you can hang it. Next, buy a multi-color pack of Post-it notes and assign a color to each person you will be interviewing or the user persona you might be designing for.
STEP 2: ASK DUMB QUESTIONS ABOUT ONLINE SHOPPING
Ask “dumb” questions that leave room for open ended responses. The biggest insights will revolve around these types of inquiries. “Why do you log in with Facebook?” “Would you ever try and do this task on your smartphone?” “When would you leave this site and go back to Google? How come?” “Tell us about what a typical day looks like in your world”.
Quick Empathy Map Example:
When we worked on the Lowline NYC website one of our key users was people who work at foundations that fund aggressive public works projects. During one of the funder interviews, we asked, “How do you pick a worthy proposal?”. This person responded by saying he scrutinizes the organization’s website – in particular, the “About” pages to know the team and their vision. As he said, “these were critical and had to convey a dedicated team with a clear vision.” This shifted our design efforts considerably.
STEP 3: ECOMMERCE JOURNEY MAP AS A TEAM
If possible, as a team sit down and digest your notes immediately with Post-It notes. Scribble quotes across the four areas of “Say, Think, Feel, and Do”. Great quotes should be called out. For some of the areas, particularly “Feel and Think” you might have to infer a bit based on the notes and everyone’s recollections of the interview. Tip: Do this for every interviewee but be extra careful to make sure each person has their own color on the Post-it notes. It will help tremendously to keep the map organized.
STEP 4: STRATEGIC IDEAS – GO FOR QUANTITY
As you are going through the above exercise you will have ideas for your project. Some will be great and some will be horrible. At this point, don’t judge just go for quantity. For the Lowline NYC project, we threw out things like 3D virtual tours of the underground park. Video shots of Lower East Side residents. Not all of these are practical (or possible) but it’s an easy way to take what you heard and turn it into something creative that can be built upon.
Everyone on our team from clients to devs and designers love this type of creative thinking and the best ideas usually come from spending time listening to the users. Mash-ups of different experiences or examples of other sites come into play as well.
STEP 5: TIME TO REST
Let everything marinate for a day or two after you wrap up the interviews. Add to the map as you get inspiration.
Hang the map in a high-traffic area of your workspace or studio, like next to the breakroom or on the way to bathroom. Put up a sign that says, “What ideas would you add?” with a stack of post-Its and a sharpie (be sure to use a color that you haven’t already used) This publicity not only encourages everyone to riff on ideas, but also allows everyone to get involved in the project.
For example, when working with DonorsChoose.org, we observed how teachers used the site as a sort of “inspiration” engine. Next, we looked at how the Songza website has a very eloquent way to help you navigate vast amounts of music. A couple quick clicks and you’re in the exact place you were looking for. We mashed these two ideas up, resulting in an experience that would allow teachers to find projects with two clicks with a quick prototype.
STEP 6: DEFINE YOUR CUSTOMER EXPERIENCE MISSION
Having reviewed all the human voices, charted them visually, and drawn inspiration you are now ready to come up with your mission statement for the project. We stole this next step from our friend Dr. Jim Patell who teaches the “Design for Extreme Affordability” course and cofounded Stanford’s d.school.
Note: This simple statement brings everything into focus and acts as the perfect foundation for your Creative Brief.
The most important part of the statement is the “because” part. It gets at the “why you are creating this for someone else” piece that is so critical. It’s a beautiful forcing function for your team. Without a focusing statement like this teams and clients can wander around with no north star to navigate from. Over time, those with the most forceful personalities or biggest title take control and push their vision. The user’s voice is lost. This helps keep their voice front and center in your efforts.
Rather than beginning with shiny new technology, we start by trying to establish deep, personal empathy with our users to determine their needs and wants. We must fill in two blanks: Our users need a better way to ___ BECAUSE ___. The because portion is a big deal. - Dr. James Patell, Stanford d.school Source: CNN
Having done the User Empathy Map exercise, you undoubtedly will notice specific themes that start to emerge. These can be flowed into a User Persona outline and used to guide all different parts of the eCommerce customer journey, whether that be on a website or in an app.
As you come back to reality, you might have to table some of your team's ideas for a follow-up phase of strategic planning. That’s okay… in true design thinking fashion, you can start prototyping right away to see if any of the big ideas have legs before throwing expensive dev or creative resources at them.