Sir, there is no better video tutorial series than this focused entirely on user experience design, would like to learn more about user journey mapping, competitive analysis in ux. Thanks a ton! Peace and love from India!
I still remember the first video i watched.. It was about task/user flows too.. It was really awesome, and since that day i have been watching your videos and they always exceed my expectations.. plz bro keep up they great content ! its so amazing. THANK U
Man I got to say, your videos are great, super straight to the point and well linked, I previously watched the differences between User Flow and Task Flow, and your Task flow tutorial. Thanks for sharing knowledge the way you do, keep up the good work, you are amazing.
This video was sooooo helpful. I've been a bit confused about accurately creating user flows, but after seeing this, it's been simplified. I've subscribed to your channel also cause I'd love to get more value from your wealth of knowledge. Thanks 😊
Just discovered your channel. It's a gem, thanks for sharing. Think it's especially nice how you demo real life scenarios and even workshop constructions like this flow diagram setup. Straight and to the point tuts. I'm smashing the like button like mad:)
Thanks for this tutorial, I like step 2 discovery, ideas and brainstorming are part of the picture, taking notes. Good to collaborate with others. I never thought of using Fig Jam for taskflows.
Hands down the best video on user flows. I have a question. Shouldn't continue with apple, continue with google and continue with facebook, be a parallelogram cause we have to click on it? I didn't quite understand why you used rectangle for them?
Thank you so much Prajwal! You are absolutely correct, that's why the action for it was added in a parallelogram, and each choice (the page each choice would end up in) as rectangles (= pages or views). See the following screenshot: share.cleanshot.com/ldHGnPGx. 1 indicates the action, 2 the pages that it ends up in based on the action you choose. But I see your point as well and you could separate them all into parallelograms if you'd like to as well, but I made it a bit more simplified and included the separate pages/views (rectangles) for each choice.
Obrigada por esse vídeo. Sentia falta de um vídeo como esse, explicando e mostrando realmente como fazer um user flow. Os Significados de cada símbolo. Sempre é muita teoria e nunca prática. Mostre mais a prática mesmo. Sei que pode parecer besteira ou simples pra quem já conhece, mas para quem é principiante, as vezes não se sabe extamente por onde começar! Obrigada mais uma vez!
Muchas gracias, me hace muy feliz! Yo no hablo portugués, solo un poco español (yo estudio y aprendo español ahora 😅). Pero yo comprendo que tú dice me. Muchas gracias señorita 🙏🏾
Thank you! 🙏🏾 Screen flows are basically the same thing with the distinction that you’re using screens to communicate how each page/state looks VS just a box explaining the state or interaction of each screen.
This video was incredibly helpful but my question is how would this process look for a more complex app that has many options for the user to choose from. For example, what about all the tiny things the user can do like change settings in their profile, interact with content such as 'liking' commenting, or sharing, etc. I'm working on something that you could consider a social media for a niche market and there's plenty of options the user has to choose from when navigating throughout the app. By following this process, I could end up with tens, maybe over 100 user flow charts just to layout all the things one can do and I've already downsized my launch platform to the minimum viable product. It's very hard to find a video or explanation on how to make a user flow for an app that's not somewhat streamlined or that doesn't use login/signup page as an example. Is there anything I can do to mitigate this or will I just inevitably end up with a ton of user flow charts?
Happy it was helpful! When it comes to the work you’d have to put in for an entire app, ideally you should break it up into different “user experiences”. So a user flow chart (1) for a sign up flow for user type X, another one (2) for section A under settings, etc. You’re correct, you WILL end up with a bunch of user flow charts. But in an ideal development setting, you will either way focus on implementing one experience at a time. So you don’t have to do it all at once, but rather evaluate and build on each experience at a time.
That's totally fine, if you want to make it a bit more simple. These symbols are the most commonly used in tech teams and are understood by most engineers. But feel free to experiment and choose a set of symbols that works for you too!
just curious, why the "click" is symbolized as an input (parallelogram)? i am quite confuse, isn't that "click something" is a process which should be symbolyzed with rectangle?
thank you for the video 🎉🎉sir, I have some questions. can u help me? what is the difference between user flow, flowchart, user journey, user story? and how to create it all?
Thank you! Briefly put: User Flow and Flowchart/Flow Chart are most oftenly used interchangebly. By some people, a user flow is defined as wireframes being visualized in a flow like chart, and flow chart being what I refer to as a user flow in this video. If you use any of these terms, you will be fine. A user journey map (or customer journey map) is a a method used to analyze a user's emotions throughout the end-to-end user experience. This is done to identify opportunities, pain points, etc. A user story is used by product teams to describe a feature from a user's perspective (in text only).
Is that the end of the userflow or should i also make a userflow for the other steps like when the main page opens and if the user pressed on a product etc..?
Since a user flow is intended to show the end-to-end process of a specific user journey (generally a short one, like “signing up”), I’d say that for this video this flow is complete 😊. Ideally, you create multiple user flows for each part of the entire experience.
@@WiredtoDesignSo that means we create different user flows one for login, and others for the other steps to reach the goal? Also, if my application has multiple categories, such as two types of services, and three different user types, should I create a separate user flow for each of them, or can they be included in the same diagram?
Great question! Some services asks the users to confirm their phone number in both of the cases (whether you're already a member or not). In this example, if you're already a member, you'd be asked to just sign in through e-mail and pass and then directly go to the feed page.
Sir, there is no better video tutorial series than this focused entirely on user experience design, would like to learn more about user journey mapping, competitive analysis in ux. Thanks a ton!
Peace and love from India!
Thanks a mill! 🙏🏾
Lol. Bro!! I love how concise and clear you sound!! Please keep ‘em coming...
Thank u so much bro! 🙏🏾
Simple and easy to understand video it is . Thanks for making this video, it is very useful.
Hi! This video and your answers to the comments helped me a lot. Until this tutorial,I was lost and didn't know how to proceed. Thank you so much. ☺🌸🌸
Ahh, im so happy to hear that! Thank YOU! 🙏🏾
Just asked to do one and I was like OK. Now I thank the heavens for this tutorial, you rock my man!
Happy you found it! Thank youuu 🙏🏾
I still remember the first video i watched.. It was about task/user flows too.. It was really awesome, and since that day i have been watching your videos and they always exceed my expectations.. plz bro keep up they great content ! its so amazing.
THANK U
thank you so much, means a lot to me!
Man I got to say, your videos are great, super straight to the point and well linked, I previously watched the differences between User Flow and Task Flow, and your Task flow tutorial. Thanks for sharing knowledge the way you do, keep up the good work, you are amazing.
Ahhh wow! Thank you SO much for the kind words. Means the world to me! 🙏🏾
This video was sooooo helpful. I've been a bit confused about accurately creating user flows, but after seeing this, it's been simplified. I've subscribed to your channel also cause I'd love to get more value from your wealth of knowledge. Thanks 😊
Thank you so much Donald! I'm happy it helped you!
Loving the production, super clean
🙏🏾🙏🏾
I love your tutorials! Straight to the point and clearly demonstrated! Many thanks!❤
tks for this video, always good seeing the process before even start coding anything, this save a lot of time.
EXCELLENT INFORMATION TO DESIGN THE UX IN USERFLOW DIAGRAM.
Thank you so much Shan!
thank you!! it really helped watching you do it, I also watched your task flows vid anc it clarified a lot!! thanks
I'm happy it helped you! Thank you so much for the support Sigrid
Just discovered your channel. It's a gem, thanks for sharing. Think it's especially nice how you demo real life scenarios and even workshop constructions like this flow diagram setup. Straight and to the point tuts. I'm smashing the like button like mad:)
Appreciate you! 🙏🏾
This is great! Love that the onboarding is simple and clear. Would you consider creating a demo for a more complex user flow and task flow?
Thank you!! Yes, absolutely! That’s a great idea. I’ll add that to my list!
that would be amazing, pls keep it in count
Thanks for this tutorial, I like step 2 discovery, ideas and brainstorming are part of the picture, taking notes. Good to collaborate with others. I never thought of using Fig Jam for taskflows.
Great to read your thoughts on this Rene! Thank you 😊🙏🏾
Hands down the best video on user flows. I have a question.
Shouldn't continue with apple, continue with google and continue with facebook, be a parallelogram cause we have to click on it? I didn't quite understand why you used rectangle for them?
Thank you so much Prajwal! You are absolutely correct, that's why the action for it was added in a parallelogram, and each choice (the page each choice would end up in) as rectangles (= pages or views). See the following screenshot: share.cleanshot.com/ldHGnPGx. 1 indicates the action, 2 the pages that it ends up in based on the action you choose. But I see your point as well and you could separate them all into parallelograms if you'd like to as well, but I made it a bit more simplified and included the separate pages/views (rectangles) for each choice.
Thank you for this clear explanation. What shape should I use to represent buttons?
Super Helpful and well explained💯
Great video, please keep them coming!
Thank u!
Obrigada por esse vídeo. Sentia falta de um vídeo como esse, explicando e mostrando realmente como fazer um user flow. Os Significados de cada símbolo. Sempre é muita teoria e nunca prática. Mostre mais a prática mesmo. Sei que pode parecer besteira ou simples pra quem já conhece, mas para quem é principiante, as vezes não se sabe extamente por onde começar!
Obrigada mais uma vez!
Muchas gracias, me hace muy feliz! Yo no hablo portugués, solo un poco español (yo estudio y aprendo español ahora 😅). Pero yo comprendo que tú dice me. Muchas gracias señorita 🙏🏾
as always top stuff, thank you for this content :)
🙏🏾❤️ thank you!
Thank you for this channel ♥️
🙏🏾❤️
Thank you so much for this! What are your thoughts on screen flows and will you do a video on how to do them?
Thank you! 🙏🏾 Screen flows are basically the same thing with the distinction that you’re using screens to communicate how each page/state looks VS just a box explaining the state or interaction of each screen.
Really very cool! go on, I'm subscribed
Thank you!!
This video was incredibly helpful but my question is how would this process look for a more complex app that has many options for the user to choose from. For example, what about all the tiny things the user can do like change settings in their profile, interact with content such as 'liking' commenting, or sharing, etc. I'm working on something that you could consider a social media for a niche market and there's plenty of options the user has to choose from when navigating throughout the app. By following this process, I could end up with tens, maybe over 100 user flow charts just to layout all the things one can do and I've already downsized my launch platform to the minimum viable product. It's very hard to find a video or explanation on how to make a user flow for an app that's not somewhat streamlined or that doesn't use login/signup page as an example. Is there anything I can do to mitigate this or will I just inevitably end up with a ton of user flow charts?
Happy it was helpful! When it comes to the work you’d have to put in for an entire app, ideally you should break it up into different “user experiences”. So a user flow chart (1) for a sign up flow for user type X, another one (2) for section A under settings, etc. You’re correct, you WILL end up with a bunch of user flow charts. But in an ideal development setting, you will either way focus on implementing one experience at a time. So you don’t have to do it all at once, but rather evaluate and build on each experience at a time.
@@WiredtoDesign Thank you so much! I figured this would be the answer to my question but I wanted to make sure. I appreciate it!
Does the UX flow focuses only on the onboarding page?
If the user does not have an account yet, should he not be directed to a sign up page or process where he enters his information to create an account?
Muchas gracias por éste video señor!🙏
De nada amigo! 🙏🏾😁
Can I skip using parallelograms altogether, Its causing confusion. Also, I have seen in certain cases parallelograms aren't used.
That's totally fine, if you want to make it a bit more simple. These symbols are the most commonly used in tech teams and are understood by most engineers. But feel free to experiment and choose a set of symbols that works for you too!
just curious, why the "click" is symbolized as an input (parallelogram)? i am quite confuse, isn't that "click something" is a process which should be symbolyzed with rectangle?
It’s mainly because the parallelogram can represent both an input/output or action. Since “click” is an action, the parallelogram was chosen 😊
What program did you use to draw?
thank you for the video 🎉🎉sir, I have some questions. can u help me? what is the difference between user flow, flowchart, user journey, user story? and how to create it all?
Thank you! Briefly put:
User Flow and Flowchart/Flow Chart are most oftenly used interchangebly. By some people, a user flow is defined as wireframes being visualized in a flow like chart, and flow chart being what I refer to as a user flow in this video. If you use any of these terms, you will be fine. A user journey map (or customer journey map) is a a method used to analyze a user's emotions throughout the end-to-end user experience. This is done to identify opportunities, pain points, etc. A user story is used by product teams to describe a feature from a user's perspective (in text only).
Is that the end of the userflow or should i also make a userflow for the other steps like when the main page opens and if the user pressed on a product etc..?
Since a user flow is intended to show the end-to-end process of a specific user journey (generally a short one, like “signing up”), I’d say that for this video this flow is complete 😊. Ideally, you create multiple user flows for each part of the entire experience.
@@WiredtoDesignSo that means we create different user flows one for login, and others for the other steps to reach the goal? Also, if my application has multiple categories, such as two types of services, and three different user types, should I create a separate user flow for each of them, or can they be included in the same diagram?
I would advise you explain each symbol and its use cases rather than just the names. Good video
Good point! 👏🏾🙏🏾
Which tool you are using???
I rlly appreciate your videos so much, so helpful keep up the good work! so clear and well explained!
Thanks a milli 🙏🏾 what a motivation booster!
I don't understand the user flow in the point of already a member...then condition No to verify with number why is that?
Great question! Some services asks the users to confirm their phone number in both of the cases (whether you're already a member or not). In this example, if you're already a member, you'd be asked to just sign in through e-mail and pass and then directly go to the feed page.
@@WiredtoDesign THANK YOU SO MUCH SENSEI
Great! Thanks
It's really cool.
Which software is used in this video for user flow diagrams?
Thank you! I’m using FigJam
The userflow 9:36
Thank U so much !!!!!
why are some lines dotted and other aren't?
very informative but i aspect to you, you can provide a lot's of videos produce in the relavant
I love how he speak like a rapper :)
Hahahaha!! Thank you, I take that as a compliment 😅🎤🎹
If Andrew Tate was a UX designer*
Oh no 🤣😂 DEAAAD!
your teaching technique isn't really clear
I’m sorry you feel that way. What could’ve improved?