Triad UX consultant Jenny Lardh explains how she creates user flows at the start of every UX journey.
A user flow is a step-by-step diagram showing the path a user will take when using a process, product or service. From a UX perspective, it’s the skeleton, the foundation from which we can build the user journey. And I LOVE them!
Why do we need user flows in our lives?
User flows are a versatile storytelling tool. They can range from providing a high-level peripheral view to a very detailed low-level. You can helicopter down to find the most beneficial perspective for your user journey. The important thing is that the user flow tells a story which is easy to follow.
What do user flows look like?
Here’s a high-level user flow example:
As you can see, a high-level user flow looks at the bigger steps in the process. It doesn’t show specifics, such as the exact action name that is available to the user. Instead, it shows that there must be a way for the user to get to the next thing.
And here is a low-level user flow example:
It shows all the big steps, but we’re filling it in with more details. We might name specific actions and show smaller steps that the user goes through.
How can you create user flows?
There are multiple user flow creation tools to choose from. Whilst they vary in cost and benefit, try to select a tool where you can easily update your flows and make notes on them.
When it comes to creating user flows, you can use a complete text version, or you can use a flow which utilises wireframes, sketches or drawings. I prefer to start with text versions and then add wireframes as we go deeper into the details. This helps us better understand what we want to include on each page – see below.
You can use a complete text version, or you can use a flow which utilises wireframes, sketches or drawings.
Split your flows into logical processes your user will go through in their user journey. For example, if you were creating a user flow for a retail website, then you may start with three user flows:
· Creating an account
· Adding a product to the basket
· Checking out to pay.
Each flow should have one or more user needs that the flow fulfils. And make sure you specify which user type you are referring to.
Once the basic flows are in place, the pages that you need to create a great user journey will almost pop up by themselves. For example, in the above example, we can see the need for a homepage and a page for filling in all the account details.
What are the benefits of user flows?
There are lots! But in the interests of time, I’ll list my top five:
1. It’s cheaper and quicker to make changes
User flows allow you to see the complete picture of the functionality and logic of how users move through your product before you start working on your prototypes. This overview lets you quickly see if anything isn’t quite right and make necessary changes. Suppose you have already created your interactive prototype when discovering that you need to make a fundamental process change. In that case, correcting this can take days, if not weeks, as you will need to update your interactive prototype.
2. Everyone can collaborate with you
User flows empower the whole team to engage from the start. You can work together to create these and when doing so, untangle any questions, thoughts and observations that your team-mates may have.
3. They encourage stakeholder buy-in
I highly recommend creating your user flows with your stakeholders or, at minimum, doing a workshop with the stakeholders to demonstrate the flows you have created. You can step through the flows together and update them based on their thoughts and feedback. This will enable your stakeholders to be involved, allow them to contribute, resolve assumptions and get on the same page as the team. And it will help your stakeholders develop trust in what you are building for them.
4. Your developers will use them
User flows come into their own when developers start coding. They get an overview of what they are building, which will help them know what to build before they start. A developer should never have to work their way through an interactive prototype to figure out what they should build. They need structure and a clear picture.
5. You can use them to document iterations
When it comes to usability testing, user flows are great. I often use the prototypes in the testing sessions, but when I document the sessions, I use the flows. You can add notes and observations around your flows, pinpointing exactly where, what and how the experience was for the user.
You can then iterate the full flow and clearly show any changes made, which is great when demonstrating the design progression to your stakeholders. You can demonstrate that the product’s iterations are done with the user’s needs in the centre.
User flows are the foundation of any good journey and a stepping stone when taking your product from information to visuals. It’s an excellent tool for your ever-growing toolbox and a tool that you will use a lot and have great benefits from.
We hope that you have found this blog useful. If you are interested in UX or have a question for the Triad UX team, please get in touch