What are user flows in UX?
User flows are sequences of tasks that a user might perform with a site or app – a graph of all the steps that a user takes to get from Point A to Point B. User flows are often used when creating a design, as a means to better understand the needs, workflow and behaviour of the user.
These user flows are depicted as diagrams that visually represent the series of steps needed to move from one state or condition to another. The tasks are shown as boxes, and the directions as arrows. These user flows don’t have to be linear – a circle, or any other type of graph can be used to show all the different paths or decisions that a user might take.
Why are user flows important in UX design?
Well, firstly they can highlight potential issues, such as a lack of flexibility or ease of use, which can then be addressed in the design. Having a thorough understanding of the user’s decision making process is a fundamental aspect of user experience. Knowing where the user is trying to go and how they might get there, makes it possible to create an environment that is both appealing and easy to use. User flows are used to determine the best way to structure and present information to users – so it’s important to consider how you can best guide the user through the maze of choices and options available to them.
There are different types of user flows:
Task flows
Task flows are the steps needed to complete a single task, such as submitting a form. These can be as simple as reaching a certain page within a website, or as involved as requesting an airline refund.
Wire-flows
Wireflows incorporate wireframes into the user flow, meaning screens with low to mid-fidelity mockups of the prototype design. Wireflows are useful for explaining how a user interacts with the app or site, because it involves visuals.
With this information, we carried out a quick design task were we sketched a user flow of how a user might upload an image to Instagram. This would involve opening the app, taking the image, adding filters etc.
I found wireflows to be especially interesting here, as I didn’t realise you could incorporate wireframes into this stage, and I may incorporate this type of userflow into my own work for this module.