Original subtitles

‫Welcome back.

‫And we're going to jump right in to sketching more flows.

‫This time we're going to focus on screen flows.

‫Now, here, you should really focus on a user's actions through a specific flow.

‫It could be a small sequence, a sequence of screens, or it could be a journey that branches.

‫So let's think about our client again.

‫This could be a user who actually searches for a product.

‫So let's get in there.

‫So I'm just going to just title this.

‫I mean, it's really hard to kind of draw on this tablet, but I'm not going to really title everything

‫we can just say, like.

‫Search.

‫Zoom out.

‫And what we're going to do is we're going to just draw a frame here.

‫Perfect.

‫Once again, not really worrying about the details here, but we're going to just focus on how does

‫a user complete this flow properly?

‫How do they achieve their goal of finding a product?

‫I'm going to do is I think they'll come to the home page and they may access our search bar.

‫There may be a navigation.

‫I'm not sure what those navigation items are just yet, but this is what the make up of the page is

‫thus far.

‫After they interact with that.

‫The next sequence is a user sees results.

‫So.

‫Pardon my messiness, but that's okay.

‫So they'll see some results.

‫And over here we'll have some images.

‫I know that there's going to be some sort of content here, and this is going to really help me start

‫building some sort of requirements that I need to account for when I'm designing elements.

‫So like, I know that there's these cards that have an image, they have some text.

‫I'm not sure what that text is.

‫It could be a product name, it could be a combination of that plus price plus other elements.

‫But I do know that when they do click over here in this area.

‫We're going to move over.

‫Step three would probably be something like a product description.

‫So we'll just write item.

‫So I mean, you don't need to copy exactly what I'm doing.

‫I really urge you to think outside the box, take some time to just sketch out.

‫I mean, you can use a tablet, whatever really works for you.

‫The item description.

‫I'm starting to really think about some of the content that's going there.

‫It could be like a name.

‫Let's get in there and start writing a little bit of content.

‫Price could be over here.

‫There could be like options to change color.

‫I'm not sure exactly, but there's some text and then maybe there's like a button sticky to the bottom

‫that's just like add to cart.

‫Just double tap with two fingers in concept and you'll be able to actually just go back.

‫So if I go like this double tap, perfect next step, they've clicked that button.

‫They've added that to their cart.

‫Step four.

‫Actually, you know what?

‫If they add that to the car, they found the item.

‫They'll probably just go to the car and we'll end the flow right here.

‫I think we can actually start thinking about alternate scenarios.

‫So they've added their item to a cart.

‫Perfect.

‫And maybe there's a checkout button.

‫Over there.

‫Another interesting thing is we start thinking about different things like hierarchy.

‫So if navigation sticky to the bottom, maybe we start using that for primary buttons and start sticking

‫other things to the top, which are a little bit more harder to access on mobile.

‫Just different things we're starting to think about in terms of page hierarchy.

‫It's really going to help us influence like ways we start building site maps and actually start building

‫that page hierarchy.

‫Let's think about different alternate flow.

‫What we know here is that we made the assumption that they're going to come in and they're going to

‫click that search bar.

‫But there's other ways to actually find a product.

‫And this is where we can start thinking about other ways to make this process a little bit easier.

‫So we'll label this one and we'll just call this home.

‫But weapons, if we really think about like placing products strategically there.

‫Products for our user.

‫So we do know that the application that we are building is for a personalized shopping experience,

‫like a really personalized shopping experience based off of their habits, based off of their interests.

‫And we can really push items at the front and really hope that these users will go down that funnel

‫instead of actually just searching.

‫We want to make this experience much more enjoyable and more catered to them so we could really take

‫advantage of that.

‫So we'll start thinking about maybe there are images here.

‫Of products that they could like or products based off of their interest, products that maybe they're

‫in their wish list and are on sale.

‫So we start thinking about these different types of scenarios.

‫It looks like enough.

‫I just fix that.

‫So if they do come to the home screen, they could actually tap on one of these products here.

‫And if they do.

‫The next step in their flow would be to actually go for the item description page that we actually built

‫over here.

‫So we start thinking about all those different scenarios and look at that.

‫We already kind of came up with a little user flow and an optional user flow.

‫We should always think about more than one scenario when we're building something like this, because

‫there always is more than one scenario and one route to get to a certain page or reach a certain goal.

‫This is really going to help influence our page hierarchies, like I mentioned before, and site maps.

‫That's how you draw screen flows.