Hey, everyone, and welcome back.
We're going to be talking about user flows, I know we talked a little bit about it when we were talking
about sketching, but now we're at the point where, you know, we have a bunch of sketches and we really
want to go in and find some details there and maybe explore some of those screen photos a little bit
more.
So what our user flows I see this question asked about users all the time.
I mean, bunch people always want to know what exactly they are because a lot of people work on them,
but they never really share them with the team, which is mistake number one.
And when they do create them, they're usually just this mess.
And we're going to get into what that looks like and how we can remedy that.
So what are user Flo's user flows are as simple as that?
I mean, not necessarily that simple, but that is essentially a user flow.
A user flow is a series of steps the user takes to achieve a meaningful goal.
So step one, whatever is here, they click on it, they get to their step two and then they go two,
step three.
And this is their goal at the end.
So why do we use them?
Well, they're used to communicate the intended flow of user through various pages and actions in a
product, an app or in whatever website that is essentially what user flow is.
So how do we make them?
Well, your flow should include a name, steps users and a description of what happens at each step.
So let's scroll down here a bit.
This was created by Ryan Singer, and he created this great shorthand for user flows.
He actually calls the music flows, but same thing, what the user sees, what they do next.
And the next step is what they see next and what they do next.
That's how simple it is.
So you should think of your current screen as what the user sees and what they need to do.
And that arrow over here will lead to the next screen and there they'll see what they see next and what
they need to do next.
But ultimately, user flows are just another method that we use to define the product, experience,
website, etc. But it isn't just another method.
They have the ability to really define scenarios or sections of something abstract or technical from
the perspective of the user.
So if we're thinking about like a user onboarding or a user checking, I mean, that could be a very
technical, especially when we're thinking about building features and writing user stories for development.
But if we break them down into the individual user stories, depending on the different routes that
certain flow may take, all of a sudden it starts coming much more from a user's perspective.
Let's get into this.
First, I want to talk about an example here.
So step one.
I usually goes to a welcome screen.
Their goal here is to register for a product.
Step two, they've actually gone through some sort of social login and step three.
They get instant access to the product.
So there's three steps, some sort of welcome screen which takes them to a social login, which is really
easy design pattern.
And then they're right in the app.
You may be asking, well, why do they help?
Well, they're the best way to solve the issue of communicating the way we want our products to work
and the way users really interact with our products.
They help us think about our product and the users who interact with it in three simple questions.
What is the goal of this thing?
Who is doing it and how do they do it?
So before we actually jump into, like, understanding the do's and don'ts and building our own, I
want to talk about the process of actually creating a user flow first.
So let's jump right into that.
Before we begin, let's start with step one, what is the purpose of your user flow?
You need to name your flow and that name describes its purpose.
That is the goal the user achieves by completing the steps.
So surprising a lot of people actually forget this part or they make it really vague.
I want to know what the user wants to do.
So I know at the end of this the users are going to find the right product.
So really describe the actual title and don't forget it, step two.
Despite popular belief, user flows go in one direction, limit your decision points in each flow so
you can avoid these crazy huge site maps or huge prototypes.
I mean, they have their place, but not really for describing user flows.
It's OK to have multiple decision points, prototypes in the same map, and we'll get into that later,
but right here we want to convey a distinct interaction.
User flows really work best.
So just keeping it simple and maybe asking yourself, why is this the case?
Well, we're telling a story and it's easier for anyone to remember a story like this than a large site
map or a series of cards in Jira or Trello or whatever product management tool that you may be using.
So try your best to tell a nice, simple story that goes in one direction.
Doesn't sprawl everywhere you use your flows should represent a complete task.
To ensure that your product is organized, the scope of each flow should really be a single task or
goal for your user.
So even though over here we have like a negative experience, we need to possibly break that out and
get them back into some sort of funnel.
Right here is the end goal.
And we're describing each of our steps to get there.
But we're not making this crazy, sprawling map like I spoke about before, so keep them concise.
If they're too short, then you fail to really tell a story.
And if they're way too long, then you basically lose the meaning.
Remember, you use flow should be the clearest model of your product.
And you can do that if you follow the rules I laid out.
Just remember, no one is.
What is the purpose of the user flow?
Number two is go in one direction and number three is represent some sort of complete task, keeping
concise as well.
Next, we're going to jump into the dos and don'ts of user flows.