I am in the process of drawing an app flow diagram, specifically using the screenshots of the application. This specific app has 4 different user roles. Some of the screens in the application are shared between all user roles and some screens are different, depending on the user role.

For example, the login process is the same for all roles. From login onwards, user role #1 can view all features within the app, user role #2 can view most of the features, user role #3 can view 60% of the features and user role #4 can view about 30% of the features.

What is the best way to represent the flow for all 4 user roles in 1 AI diagram using app screenshots?

1 Answer 1


There are two possibilities I would consider for this.

1: Work with colored lines for types of users with a legend that explains the different colors.

User 1 is red

User 2 is green

User 3 is blue

User 4 is yellow

If you wanted to know what type of can view what you just have to follow the designated colored line. The downside of this is that your flow can quickly become a coloring book as you will have colored lines all over the place hitting all kind of screens.

2: Split up the screens.

Starting from the login screen you split up per type of users. Basically, from the login screen, there will be 4 separate users departing.

User 1 goes to the top

User 2 to the left

User 3 to the right

User 4 to the bottom

You then just add all functionalities that a specific user can see to each quadrant. The advantage of this is that it will be clearer to see who can do what as you avoid the coloring book. The downside is that it will be a lot larger of an app map then option 1 is. You will also have certain screens repeat in all 4 quadrants.

The choice between the two will greatly depend on the number of screens you have.

You could combine the two options into one, where you still work with colored lines for the shared screens and then do a split. But you will easily lose consistency doing this.

My personal preference goes to option two. It is a lot more extensive but will be a lot easier to read visually for other people.

Hope this helps.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.