IXD301 Elements Project User Flow

As I found that the navigational aspects of my app were becoming more difficult to keep track of I decided to create a user flow to help me visualise how the user will navigate through my app. As I have never created a user flow before I began by first researching how to make a UX user flow. This led me to a great step by step guide.


The first step is to understand your user. The following questions are posed:

What are the needs of your users?

I have found that my users need are to be able to complete each task and move from one task to the next with ease. They also need to learn about elements and should be able to access more information about elements as they progress through the system and be rewarded along the way.

What problems would they like solved?

The user should be able to access rewards at the end of each level and have a feeling of accomplishment as they make their way through the app.

What features are most important to them and why?

Winning and getting rewards as the point of gameplay is generally to win or have some feeling of progression.

What initial questions do they have about your product?

What are elements?, how can do I get to Mars?, how do I complete tasks to help me get to Mars?

What information needs to be provided in order for them to effortlessly interact with your product?

Clear instruction on how to complete tasks, clear indicators of where to find out more information about elements.


The second step advised creating a flow outline considering the entry point, steps to completion, and the final step in completing a task or the final interaction. The third step is to define the elements of your user flow. It is suggested that a variety of shapes are used to do this rectangle (represent page or display screen), circle (to display action), diamonds (to display decisions). Other tips included refining your outline e.g. using meaningful labels, using colours as a coding system and creating a consistent visual structure.

For my user flow, I decided to use a black rectangle for display screens, a yellow rectangle for actions and a diamond for decisions, see outcome below.


Escape to Mars User Flow

Link to Miro board

I found this exercise to be incredibly helpful in the development of my app. This was particularly helpful in giving me a visual reference of how to include elements and rewards and make elements and the additional information provided about them accessible as the user navigates through the app.

Leave a Reply

Your email address will not be published.