As online courses have rapidly proliferated as a viable means of delivering college level content to learners, more and more instructional designers have found themselves faced with building out learning experiences within highly structured learning management systems. These systems are often rigid and lack customization. Therefore it has become the work of many instructional designers to simply place content into pre-established sections of the course site without too much forethought.
But what if we scrapped the structure that was provided, and instead approached course design with a fresh perspective borrowed from the fields of informative architecture and user experience design? Could we build better online courses that were easier to navigate, and that helped students achieve their goals within the LMS in a faster and more streamlined way?
What Are User Flows?
User flows are short, succinct flow charts that illustrate a user’s path through a designed system, often a website or an app. This style of flow diagram includes labeled boxes connected by arrows showing the sequence of action. Decisions can be indicated by diamonds, which branch in multiple directions based on the decision made. A clear start and end point is always apparent in a flow diagram.
sample user flow diagram
User flows could be incorporated into the online course design process in order to map out the way a student will move through an online course. User flows can be created for discrete tasks that the student would want to complete each time they log into a course. These might include accessing the syllabus, posting to the discussion board, or checking grades. The user flows could then indicate potential pain points, or show the best path to lead a student to complete an action. They could help identify page labels and navigation structures that would facilitate the learner’s interaction with the course management system, thereby improving their overall experience within an online course.
Getting Started with User Flows
Before you can create a user flow, you need to identify some user personas. Who are the learners who will be taking your course? What is their background? What characteristics are they bringing to the learning experience, what prior knowledge and experience? What is their comfort level with technology and with higher education? What is their motivation for learning? Draft out some rough, provisional personas based on your best educated guess about who your learners are.
From those personas, draft a list of tasks that each type of learner would need to perform while taking the course. Each task will become its own user flow. In order to create a user flow, you need to start with a succinct statement of exactly what the learner is trying to accomplish. For example,
“As a new online student, Jane wants to order the textbooks early for her first graduate level course”
“After completing the essay based on this week’s reading, Jack needs to submit the essay to his instructor for feedback”
The Creation Process
To begin, write the task in an oval shape on the top, left edge of your paper. This is your starting point. Next, think through the steps that your learner will take to navigate through your course site and through your content. Each of these steps should be placed inside a rectangle, with lines connecting one to the next. The lines should have arrows to indicate the sequence and direction of the flow. If the learner will need to make a decision, use a diamond to provide different options, with branching scenarios reaching out from each decision. Finally, indicate the point at which the goal is achieved. It’s important to place closure on the user flow by indicating the last thing the user will see, the verification they have taken the correct course of action.
Best Practices in User Flow Design
While developing user flows, keep the following key concepts in mind:
- Be direct and succinct, clarity is key
- Use standard flowchart symbols to alleviate confusion
- Keep arrow flow moving in one direction
- Be consistent in size and color of your symbols
- Always have a beginning, middle and end
- Don’t cross the paths
- Emphasize the primary path with color or line weight
- Use orthogonal lines mapped onto a hidden grid