All language subtitles for 14 - Sketching

Hello and welcome back.

We're going to be sketching some photos.

You can sell them on a tablet here because I just want to demonstrate how we can sketch those flows

without using paper.

A lot of people like to use tablets and I'm using an application called Concepts.

It's a free application.

You can pay for some additional features, but I'm not paying right now and I can just like draw.

I can export this as a jpeg and send it to myself if I need it.

And that's all we really need for sketching.

So I totally recommend, if you want to go the digital route, you can even do it in Figma.

And yeah, so I mean, you can just grab your pen, you can even change the size of it.

If you want to get a little bit more thick there, if you double tap with two fingers, you'll just

go back.

This is your eraser.

So for the sake of this video, I'm going to keep it pretty.

I think that's good.

Also, you can select different types of pens.

So what we'll do is.

Right now we're using a regular pen.

There's the fixed with pen.

That's something that I rather use just for actually drawing the wireframes.

So let's bring that down.

I think that's a little too thick.

Okay.

Perfect.

Now we're ready to go here.

We're going to be focusing on a user's experience through certain journeys, both big and small.

Before we even jump into those types of journeys, I just want to give you a little understanding of

what I'm asking myself every time I approach something like this.

Step one I want to understand what I need to draw.

So I've got to figure out exactly what I'm thinking of sketching.

Do I want to sketch a large journey, or am I thinking about a small interaction?

Step two is defining some sort of starting point.

You can start at the beginning of a journey or in the middle or at the end you choose what you think

is best.

Typically, I like to start thinking about the most difficult or riskiest parts of the product first.

Some people actually like to start at the end and work their way backwards to figure out how users get

to a certain point.

Like I said, it's whatever works for you.

Step three to decide your next steps after you define that first starting point within your flow.

You need to know where to go.

Well, that is up to you, and you need to ask yourself some important questions.

Which way this step lead our users?

Where do you want them to go?

What does the user need to do to get there?

In the end, when I'm thinking about alternate scenarios or alternate flows that I'm trying to sketch,

I think about all the different questions in terms of alternative ways that a person can go through

a certain route.

So what options do they have?

What happens if the user closes the app at this point?

Where will they resume?

So these are the types of questions I'm always asking myself.

Every time I approach a sketch.

So let's start with our very first sketch.

We're going to talk about mapping overall flow.

Think about a user's journey through the product.

That's like from point A all the way to point B, we want to understand when they come in and when they

leave and what that experience is like.

It's like creating some sort of customer journey.

And here we can really outline different types of pain points when they're feeling happy through this

journey, when they're feeling sad and pick out different types of opportunities where we can really

improve that experience for them and also understand where exactly we can branch out and focus on different

types of flows.

Let's start sketching a general journey.

It doesn't need to be neat.

It needs to be just a little like you need to be able to understand it.

We're going to start sketching a flow here.

The first one I'm thinking about is mapping the overall journey for our client habitual.

So if I think about step one, I'm just going to put one.

I'm going to draw a frame.

And we're not really focusing on UI elements here or anything like that.

I just want to think about what the user is possibly seeing, what screens they may be they possibly

are going to, and what they're expecting.

So when they come to our application, they may see a welcome screen.

And like some sort of button.

Maybe it's an onboarding process.

We can figure that out later, but now we've kind of established that.

Step two.

Let's create another frame.

Maybe the user when they come here, they're thinking about searching right away.

They want to find a product.

That's why they would use something like habitual.

So what I'm going to do is I'm going to just draw like maybe a home screen that looks like a cube.

This just still looks like cube.

That's fine.

We're going to just draw some boxes.

Okay.

So they come to this home screen and what they're going to do is they're going to search for a product.

And the next step is that they're going to actually find that product.

So they find their product and they go and research those details.

And from here, after they've done that, they're interested in actually purchasing it.

Right now, you'll notice that this is a very happy flow.

This is what we really want our users to do every single time they come into our product.

And that's not always the case.

So they'll probably see a cart with a little X, maybe there's a checkout button.

There are details of whatever they're purchasing or whatever product they want to buy.

And if we move that over.

Okay.

Little messy, but that's okay.

I mean, we're getting a general sense of what this journey is looking like and they get some sort of

confirmation that the package has shipped that you bought it and it's right out the door.

And then I don't think the journey really ends there.

We need to think about what happens after it's shipped.

In this scenario, it's delivered and the user is happy.

So this is what our whole flow starts to look like.

User comes in and is welcomed by us.

They search for a product.

They find that product and review it.

Add it to their cart and check it out.

The package ships and it is delivered to them and everyone is happy.

Now, that always doesn't happen.

And this is where I'm asking myself, well, we asked ourself the question of what the goal was.

The goal was to sketch the whole journey.

We thought about what steps come next, but we didn't really think of alternate scenarios.

So what happens if like they can't find their product?

There's a scenario there.

If they can't find their product, maybe they have to go through some category searches, so they start

searching based off of categories.

Or they start maybe reading reviews.

There's different things that we need to always take into account.

Not very rarely.

And this is an assumption and we always try to validate our assumption.

But my assumption is that very rarely that everyone goes to the same exact flow, maybe they want to

read reviews.

So we're starting to think about all the different types of scenarios that a user may experience in

their journey.

You know, maybe over here they're happy so we can give them a good onboarding.

Experience.

And over here, when they're searching, you know, maybe they're a little confused and maybe this is

a great way to implement a really easy search experience that makes them happy.

Oops.

So maybe we can really capitalize on that opportunity when you really need to think about who our users

are and what they really want to experience when they're moving through our app.

So that's how you map an overall flow using sketching.

And if you wanted to, like I said before, you can just export this, bring it into figma, clean it

up a bit and start thinking about it there if you want to.

But that's how you map an overall flow.