Now that we’ve sorted the cards into steps the user should take, let’s arrange that into a User Flow. A User Flow is the path you mark out for your users to take, and you should make it easy for them to discover the next step in the process.
- User flow—A document that outlines the progression of ideal user behavior through key moments in their interaction with a product
This article explains user flows clearly, and it also shows other common types of flows you may see. It does a good job comparing and contrasting differences between user flows and the other flows represented
UX Glossary: Task Flows, User Flows, Flowcharts, and some New-ish Stuff, by Naema Baskanderi
Linked earlier course notes, this Optimization Glossary from Optimizely does an excellent job covering what user flows are.
Let's look at all the steps we need to include in the process. 0:00 For a ride sharing app, we have three different goals. 0:04 To get to the airport quickly, to get home as cheaply as possible, and 0:08 the third goal, for the third group you worked through. 0:12 We also have things they all have in common. 0:15 They all have a starting point and a destination. 0:18 They all have to pay for their trip. 0:20 We need to determine the best order for all of this. 0:23 For now, let's focus on the business man, and we'll go back and 0:26 look at the other groups in a minute. 0:29 The business man has his goal, to get to the airport quickly. 0:32 But what does he need to do in our app to get there? 0:35 Let's make a stack of cards with all the screens or pages that he needs to use. 0:39 We may decide that our app could let us schedule rides for the future, so 0:44 this businessman doesn't have to wait around. 0:49 That sounds like a great feature, but 0:52 is it something that actually plan for the app? 0:54 Sometimes we may find features that you want to explore or 0:57 implement when you're working on some user experience document. 1:00 After all, you're finding ways to make the lives of your users easier. 1:04 However, it's important to check either with your projects team, 1:08 if you're on one, or with your own constraints 1:11 to make sure that these features can be implemented within the project's timeline. 1:14 We need a destination, 1:20 the driver won't know where to take the passengers otherwise. 1:21 Which also means we need a pickup location, so 1:26 the driver knows where to meet the passenger. 1:28 This should probably default to the current location. 1:31 We might want to follow up with a survey about how his ride was. 1:35 That way we can make rides better for our future passengers. 1:40 After making it through security at the airport, 1:42 our timely businessman will be waiting for his flight. 1:45 So he in particular may decide to rate the driver when he's no longer in a rush. 1:49 Additionally, we should ask if he wants to tip his driver. 1:55 We need a way for the businessman to select the payment for his ride. 2:00 For him specifically, we should be able to choose between multiple payment options. 2:04 He may have a company card as well as a personal card within the app, so 2:08 that's yet another step we need to take into consideration. 2:12 We may want to know how many people are riding with the businessman, or 2:16 at least allow him to choose the number of seats in a vehicle. 2:20 Is there a premium option available with luxury cars? 2:24 If so, let's find a place to build that option in. 2:28 The app should probably alert him when its right is getting close, or 2:32 if the driver is running late because of traffic. 2:37 He is looking to book a ride which is an obvious step, but 2:40 it may be easy to overlook. 2:44 We need on-boarding, or the process of creating an account and 2:46 setting up the app for first-time users. 2:49 Since this isn't a repeated part of the businessman's journey, 2:52 we're going to leave those details out of our user flow. 2:55 However, if you're up for an extra challenge, and for 2:58 some more practice, you can create a list of the pages and 3:00 steps you think our businessman would need to create an account on our app. 3:03 For example, he may need a username, a form of payment, and 3:08 address that's set as home, or email. 3:12 But that's just the beginning. 3:15 Feel free to dream up what you think he may need to do before he's 3:17 able to use the app. 3:20 Now that we have these cards, 3:22 let's put them to use by doing a hard sorting excercise. 3:24 We can better visualize the different steps in the process, and 3:28 arrange them until they make the most sense. 3:31 People usually do card sorting exercises for determining where content lives 3:34 on a site, so they group them in clusters with similar content. 3:38 For example, mission statement, policies, 3:42 company directory, and job opportunities, could all fall under the about us heading. 3:45 For our purposes, we'll be using the cards like parts on a timeline, where we 3:51 look at different steps and decide the order that makes the most sense. 3:55 Got it? 4:00 Let's go. 4:01 Our users would need to go through an on-boarding process, but 4:02 the businessman should've done that already. 4:05 Our first step for booking a ride is to get the pick up location. 4:08 Pickup location should default to his current location. 4:12 Next, he should select the destination, either by typing it in, or 4:15 by using the map. 4:20 Then, the app should present to him with his vehicle choices, 4:21 including number of seats and luxury upgrades. 4:25 We'll also need to give him a price estimate at this point. 4:29 The app could give him a price estimate with his vehicle choice, 4:32 to minimize any back and forth. 4:35 Maybe he needs to keep the trip within a certain budget. 4:37 Finally, he can choose to book now or schedule for later. 4:40 When he indicates that he wants to schedule for 4:44 later, he can then set his idea arrival time. 4:46 Let's say he wants to arrive at 3:45PM. 4:50 If there are changes based on the time, like a higher fare at night or 4:53 early in the morning, the app will inform him of the change in price. 4:58 The app will tell him if there aren't any luxury vehicles scheduled to drive at that 5:02 time, in which case he can book with an average car. 5:05 Wait a minute. 5:09 This sounds like we may have to repeat the steps of choosing a car, 5:10 which doesn't sound very efficient. 5:14 To keep things in as few clicks as possible, maybe we should move the option 5:16 to book now, or schedule for later, up to the front of the line. 5:21 Now we can given the vehicle options with price estimates all at once. 5:26 Once he has selected the vehicle option with price estimates, 5:31 he should confirm his payment method and book the ride. 5:35 The app will let him know the time that he should expect to be picked up, 5:38 factoring in predicted traffic in the area. 5:42 The app will also alert him when his driver is nearby. 5:45 After he has been dropped off at the airport, 5:49 his payment method should be charged, and an email receipt sent. 5:51 The app should prompt him to rate his driver and his passenger experience. 5:56 And finally, tip if he enjoyed his ride. 6:00
You need to sign up for Treehouse in order to download course files.Sign up