UX User Flows Explained
ฝัง
- เผยแพร่เมื่อ 28 เม.ย. 2024
- In Today's video I'll show you how UX design User Flows work in just 90 seconds.
After this you will be able to make and practice them yourself!
⚠️ Remember we have a special PRO Information Architecture challenge at hype4.academy where doing user flows like this will come in handy!
Vote for next week's topic:
🅰️ What are Low fidelity wireframes still used for?
or
🅱️ What is the Double Diamond?
You can vote in the comments by saying which one you prefer but also please tell me why! And all comments to this video are appreciated, this series will grow based on your feedback.
I want to give you simple, down to earth explanations so even non-designers can understand these terms. And always with examples and visual aid.
Let me know what you think!
Flow diagrams are an integral part of designing the user experience of apps and websites, so it's worth knowing how to do them well and most of all clearly.
This is a deliverable that's often viewed by stakeholders, C-level executives and generally non-designers so you need to make sure everything is clear and easy to understand for everyone.
========================================
The idea for this series comes from my bestselling NO BS Guide to UX book. You can get it right here:
hype4academy.gumroad.com/l/gu...
Learn Design for free with daily challenges:
hype4.academy
========================================
#ux #design #webdesign
![ฉันจะ "แพรี่" ให้หมด - ผู้แข็งแกร่งที่สุดในโลกอยากจะเป็นนักผจญภัยให้ได้ - ตอนที่ 04 [ซับไทย]](http://i.ytimg.com/vi/PvmuP8y9IPk/mqdefault.jpg)
I learned a new thing - Dotted lines for alternative paths. Before I used regular lines for all possible paths. Thanks for teaching me that!
Wow, very easy to understand and short, simple! :D Thanks, Malewicz!
Thanks Mikael. Found this helpful 💪🏼💪🏼
Low fidelity wireframes are so useful. It helps to think of flows, features and functionality without the need for UI design. It's so crucial for me. It's usually Information Architecture >>Low fidelity wireframe with User Flow alongside. I'm working on a product now where the client sent me so many disjointed content. I had to wireframe it out. Then set a meeting and the client started understanding without telling me about colours etc.
Wireframing is so important for my process.
Yupp. Actually itz important for everyone. Cause itz like rough idea before putting stuff in execution.otherwise it will be double work and waste of time.
Are you creating them in Balsamiq?
@dishankshah5080 yes. Great tool.
Double Diamond for me to watch next week and have an awesome day, Michal 💞
Good choice!
@MalewiczHype honestly, these frameworks are interchangeable, a product design life cycle is iterative. When I was studying ux design we used it in class and I have used it in a professional environment but we've never called it that (double diamond).
I haven’t found anything in the flow! Good job Michal! It’s flawless.
Next time Double diamond 💎
flawless or flow-less? :D
Easy explanation and straight to the point!!!
Another awesome video! Double Diamond next! 🙂
helpful and clear. thank you
Low fidelity wireframes - Option A , and Thanks for the video.
B - Double Diamond :) Thanks for this short but very informative video!
Double diamon won, coming on Wednesday :)
You make it look easy 😎Now I'm low-key excited about the Information Architecture challenge.
I vote for A :)
Thank you so much!!!
Happy to help! Most of the UX concepts can be explained under 90 seconds.
Hey Michael I attend FullSail university. We had an assignment to where we had to select two Ux/Ui designers who had a major impact on the industry. You appeared on that list. Which I thought freaking awesome. 👏 keep up the work and Thankyou for the lessons!!
Happy to hear that! I'm just having fun designing though, not sure about that impact :)
Voting A!
Difference between task flow and user flow pls
A for me 😄 the graphics and animations just get betterr 👌🏻
Still simple, but they're fun to make
Double diamond, please!
Great explained, the only question is how detailed User Flow can be? :D Is User Flow one specific task? Showing and focusing only on this one specific task to achieve it? Can we skip side actions? A person learns throughout his life :) I would like to learn about wireframes in the next episode.
Michal have you used balsamiq? I love it so much. I'm not sponsored by them but it's so rapid/responsive. It's almost like using pen/paper.
Option B, Double Diamond Method ♦♦
Double diamond for the next video 🤓
Till now I do userflow from my mind, 🧠
I jus create a Todo list ✅
Start designing screens on Figma 🎨
Then, Code it 🔫,
Your Thoughts 🤔 💭
Do i really spend time in Userflow?
(Because pretty much I'm the only one doing whole process, I work for a startup. as Mobile developer)
Many designers do them in their heads but in some more complex cases it may be better to just be more prepared and think of all possible options in a high-level view first. It really depends on the workflow and is recommended for beginners (always)
Hi Michael! I am working in my first case study following your case study course. I just did the main flow as you do in the course, simplified and using only rectangles. Am I OK with this? Or it is better to use the traditional different forms in the flows? Thanks!
If you're working on a simple case study flow you can use it with just rectangles - it's fine. I wanted it to be as simple as possible, as also adding flows shapes to it would be a bit too much for people.
But of course you can modify your flow with diamonds and circles added too :)
Option A
I vote A
i don't know about double diamond method. Wonder what is it?
B - Double Diamond
Double diamond please!😺
It's a very close race this week :)
"A", I still struggle between Lofi and Hifi and it's crucial for time management and low-cost ideation. I also struggle with Start being Red and Flow End being green... I learned flows using the BPMN 2.0 and Start is green and End is red 😅
Best way to do flows is black and white, or a consistent "your own" way.
I always went from red to green as red is an entry to a problem and green is the final success :)
Both please 🔥
Eventually we'll do both but each week we can only pick one :)
@@MalewiczHype Well, you are right, and in this case, I'll pick B
A please 😊
B double diamond method
A please!
Noted
Double Diamond
Of course they will all happen eventually, but noting DD :)
low fidelity wireframe
I want C: How to do information architectures
C is not an option yet, but it will eventually be
Please make next video on "what is a double diamond"
already have
Low fidelity wires please
This week it will be pretty close I think :)
A quick question, does it matter to have a userflow with all possibilities for a portfolio project? I mean project is about perticular features so does it matter to have all login/registration possibilities?
no, you can just focus on the most important parts of the main flow
@@MalewiczHype thanks, btw do we have a community where i can ask for quick reviews from designers perspectives? I tried reddit but sometimes it takes days
Yes we do. You need to reach out to me via email or twitter DM to get an invite.
@@MalewiczHype sure, I have dm you in insta
B
A !
B!!
♦♦ please
B!
Noted! Adding to the B-team :)
A
"A" pls
You got it!
B...double diamond
Noted. It's funny how complex they make it feel
A 😊
And it's almost tied now :)
b
🅱️
Low fidelity
Next time Double Diamond
Why not wireframes? :-)
B -> Double Diamond ?
Double Diamond
Noted!
B
A
B
B
B
A
A
Noted
B
Adding to the vote tally, this is gonna be a close one
A