User Journeys vs User Flows: What's the difference? - 100 Days of Design, Writing & Emotions

Design:

User journeys, user personas, user flows, user epics and user stories. All UX tools. Users clearly get a lot of love in UX design.



Let's focus on user journeys and user flows. The first difference is that user journey mapping tends to happen at the first analysis part (the 3rd oval below) of the UX process. User flows, on the other hand, are often created during the design stage.





User Journeys

A user journey is a top level view of how a user interacts with a product. When user journey mapping - the process of visualising the user's interaction with the product - we map the stages and scenarios a user goes through.



Let's take the example of booking a ride with Uber 🚗

1] User picks up phone

2] types in their destination

3] picks their car of choice

4] receives confirmation

5] puts phone away and waits!



User journeys are like stories, they tend to be vague and not overly concerned with functionality. More important in a user journey is the focus, as I wrote earlier, on stages and scenarios a user goes through to achieve a particular goal.



'What're you talking about?', you say. I hear you.



A scenario could be: a user has decided they want to go home at the end of a night. Or, a user is waiting for their ride on the corner of the street. Or a user is considering taking a trip to South London and wants to evaluate their best travel option.



Exercise 1:

• Pick an app you like. Write out a simple numbered user journey as I've written above for Uber. (Share it with me if you want feedback)



Simple user journey map (source):

More complex user journey map (source)





User flows

Ah, the reason I'm here writing this blog post in the first place.



A user flow is the path (or flow) a user takes within a product to achieve a specific outcome (goal). User flows are diagrams focused on the interactions, screens, pages and functionality of a user's interaction with a product.



Let's go back to Uber 🚗 - a simple user flow:

1] Launch screen

2] Type in destination on home screen

3] Results page

4] Select result

5] Select car

6] Confirm

7] Pick-up confirmed notification

8] Driver's distance/waiting time



User flows can become incredibly complex. Think of the number of actions you can take on a single page of a website or a single app screen. Every path has to be mapped out.



Best practice is to select a single user task and map out a flow for that particular task e.g. signing up to a new account or ordering pizza.



Simple user flow example (source):



More complex user flow example (source):

Exercise 2:

• You guessed it, create a simple user flow. Try the user flow for playing a song in a music app.



Tomorrow I'll share a 101 guide for creating user flows. Practice is almost always more fun than theory.



Here's the user flow I've been working on today for the SafeShop design:

References: this video, this video and this Invision article about the design process.



Emotions:

I feel great. I'm making progress on my two main design projects - building the MVP portfolio and designing SafeShop. I'm taking more regular breaks and I'm more aware of my body, and more responsive, throughout the day. At the moment, my shoulder is starting to hurt so I see that as a sign to stop very soon.



My sanity toolkit is paying off and I can feel my relationship to my work begin to transform. At the end of the day, my biggest goal is to enjoy the work I do and debug some of the triggering and emotional reactions I have to it. I'm slowly starting to do that.



Easing off has been tremendous. Realising I don't have to go fast or else. I can slow down. I can enjoy this. And I can listen to my body and take breaks.



As always, thanks for reading my messy notes. You're a trooper 👋🏼