U r a blessing for me , I understand the fundamentals of ui design , but still bought ur ui course 2 and what a course it is !! Loving every bit of it , this course definitely gonna level up my designs more. Hope u keep bringing more courses like this for ui design. May be 1 where you explain design system more.
Desaturation and blending highlight colors into the black background was great tips. I've known how default blue feels bad on a black background but never knew how to phase it properly as in "it's too saturated"
Love what you do. Bought your book months ago and these last couple of weeks, was responsible for work's dark mode version. While I was familiar with MDS colour theory, iOS was new to me. The eco system is more constrained as far as establishing base colors and the greys were concerned but, still I used this video to help me figure shit out. So thanks bruv. Keep going
Waow.. pocket and deep.. the insight is wise, the advice deep and multipurpose, definitely a must know/must have here. Thank you sir. I follow you not for very long, and I don't regret it. Kudos !!
It does on oled screens, but with a risk of too high contrast (that leads to eye fatigue) and the ghosting effect. So there’s tradeoffs, and an easier on the eyes dark mode has to be a bit brighter, so anywhere above #000000 there’s no extra battery savings. It’s convoluted 😅
Dark mode has a better contrast for readability, it helps those of us who struggle with contrast. Black on white ends up being harder to read. Tint the white to any other shade, and readability goes up immensely, but not a lot of apps allow just to tint the white to say, sepia. So dark mode it is. This is just my experience with struggling with the harsh contrast of black text on white backgrounds, and the relief dark mode provides.
I plan to cover accessibility in the next dark mode video - including yellow on black as well 😎 Here I wanted to start with an overview, but good point 🙌
Good day, You talk about adding a hint of a brand's color to black, is there any took l that helps to mix colors together? Because I have no idea of how to mix colors together
Darkmode is needed for products that is meant(or is wanted to) to be used by an user on daily basis. I sometime like dark mode, and yes it is easy on eyes and doesn't excite me
If Saturation (the S in HSL and HSB) is above 80 then it's too saturated (there are exceptions but the more senior you are the more you kind of get to know them - for beginners under 80 is good). Hint of blue means it's a blue with very low saturation, (5-20) which makes it "mostly gray"
Yeah, thanks Michal for this awesome vid! Just got a new client project that is based on dark mode UI, how coincident !!! (that really shows how popular it is :D)
dark mode saves me from eye pain. I'm currently working on my first project and I started with a light mode but because of eye pain I made it all dark. And I ended up making wireframes dark too. Not that I'm happy about limiting myself like that. Gotta do something about it. And instead of using white on black I chose a dark bluish gray for screen which looks a bit matte and the texts are the blue of the youtube's Join button.
Very helpful video 💚💙. I wanna know what you mean by reducing saturation by 20 to 30%. Did you add gray, white, or black to the main color or did you reduce the opacity of the color?
In HSL or HSB color modes the S stands for saturation - so simply open the color picker, change the mode to one of those and decrease the number under S :-)
some people on linked in jus copy pasting your work and not even giving credits to you man!! it really hurt me how good content creator are getting robbed by this type of people your student
U r a blessing for me , I understand the fundamentals of ui design , but still bought ur ui course 2 and what a course it is !! Loving every bit of it , this course definitely gonna level up my designs more. Hope u keep bringing more courses like this for ui design. May be 1 where you explain design system more.
And the winner of this weeks giveaway is Kimberly González !
Please reach out to me via Twitter (or email) to claim your free ebook 🤗
😍😍😍
30 more minutes for the video, Can’t wait to see the tips or tricks and rules
Thank you so much for this video. Super helpful and well-presented. Your time and effort is most appreciated!
Its a short video and straight to the point..I could write a book just by watching this short video..Thanks mate..
That was the point - to be brief and precise so it’s easier to remember 😎
This is video gave me wayyyyy more value than the course I purchased from my total income of a month, GOD BLESS YOU😇
Wonderful! Glad it helped :)
These videos are great. Cant wait for more.
More to come!
Yes, I think it always makes a good impression on users if an app provides a light and dark mode.
Great video! I'd also like to throw in the fact that slightly bolder and greyer text looks better in dark mode.
Good call!
Awesome! I almost all the time wait for your video’s
Well this one is already out there :)
Love these tips keep ‘em coming and I’ve applied on couple of my designs. It looks amazing
Glad they're helpful - that's the whole point to be able to apply them in your own work and see a better result. Happy to hear it worked! :)
Why his videos dont have millions of views...he deserves it!
The channel is pretty young, but if you like the video you can share it further so more people can see :-)
Desaturation and blending highlight colors into the black background was great tips.
I've known how default blue feels bad on a black background but never knew how to phase it properly as in "it's too saturated"
Happy to help! :)
Please keep doing those, this is amazing!
Glad you think so! :) I hope this series helps a lot of people :)
Love what you do. Bought your book months ago and these last couple of weeks, was responsible for work's dark mode version. While I was familiar with MDS colour theory, iOS was new to me. The eco system is more constrained as far as establishing base colors and the greys were concerned but, still I used this video to help me figure shit out. So thanks bruv. Keep going
Glad to hear that :-)
Great video! Thanks!
Waow.. pocket and deep.. the insight is wise, the advice deep and multipurpose, definitely a must know/must have here. Thank you sir. I follow you not for very long, and I don't regret it. Kudos !!
Glad you think so, if more people like it I’ll definitely do more in the series 🙌
Ahhh, that's the video quality! Awesome job!
Glad you think so! Took forever to create all the visuals, and there aren't even that many 🤣
Love this video, was confused whether to use dark mode UI, thank you Michal. And as for counting tokens, the answer is "8" :)
Hope it helps!
@@MalewiczHype thank you
Great tips! Thanks for making such an amazing video @Michal 🤘
Glad it was helpful! There's a part 2 to this as well :)
Amazing one
It was rly usefull, thank you
Glad it was helpful!
You are a blessing to me. Thank you for the tips
You are so welcome! Comments like these mean a lot to me with my insecure approach to making videos :)
Great Video, I liked that you covered almost everything, hope you're doing more and more like this
That's my main goal for the channel :)
Good video, you got a new sub here
Awesome, thank you!
Once again great video Michal 😻👍 yes, more such videos would help a lot.
More to come :)
Oh God, amazing job right there, thanks!
Glad you like it! More to come!
Great Tips! I'll use them on my Tauri Apps, and I want them to react to user's color preference so I'll need adaptative color schemes x3
This is so helpful.. thanks 😊
Glad it was helpful! Working on the next episode already
Great great stuff thanks
Dark mode does save battery and it's very noticeable. Besides, many other youtubers have already made battery tests for dark vs light mode.
It does on oled screens, but with a risk of too high contrast (that leads to eye fatigue) and the ghosting effect. So there’s tradeoffs, and an easier on the eyes dark mode has to be a bit brighter, so anywhere above #000000 there’s no extra battery savings. It’s convoluted 😅
Dark mode has a better contrast for readability, it helps those of us who struggle with contrast. Black on white ends up being harder to read. Tint the white to any other shade, and readability goes up immensely, but not a lot of apps allow just to tint the white to say, sepia. So dark mode it is. This is just my experience with struggling with the harsh contrast of black text on white backgrounds, and the relief dark mode provides.
I plan to cover accessibility in the next dark mode video - including yellow on black as well 😎 Here I wanted to start with an overview, but good point 🙌
Good day, You talk about adding a hint of a brand's color to black, is there any took
l that helps to mix colors together? Because I have no idea of how to mix colors together
Darkmode is needed for products that is meant(or is wanted to) to be used by an user on daily basis. I sometime like dark mode, and yes it is easy on eyes and doesn't excite me
I don't only ❤ your content but I also ❤ your soothing voice. 🤣🤣🤣
Oh stop ;)
It's also easier on the eyes late at night under the duvet cover.
Makes sense - I will cover a bit more about brightness and accessibility in the next episode
@@MalewiczHype Cool. I build dashboard for Network Operations Centers, and I often get feedback that the night shifts prefer dark mode too.
Mój mentor :) Jak uczyć się to od najlepszych. Świetny materiał jak zawsze! Pozdrawiam
Bardzo mi miło :) Motywujące!
Woudn't be wrong if i have 2 different brand accent colors? (2 different blues for same app)
Cool cool cool!
Thank you :)
When is a color considered saturated, above 200? How to add a hint of blue in the shade of gray?
If Saturation (the S in HSL and HSB) is above 80 then it's too saturated (there are exceptions but the more senior you are the more you kind of get to know them - for beginners under 80 is good).
Hint of blue means it's a blue with very low saturation, (5-20) which makes it "mostly gray"
So good!
😀
We always need a dark mode, to improve accessibiiity.
Yeah, thanks Michal for this awesome vid! Just got a new client project that is based on dark mode UI, how coincident !!! (that really shows how popular it is :D)
That's awesome! You'll do great though :)
@@MalewiczHype aw thanks Michal
if developers use the product, we need dark mode. Dark mode is like coffee for devs
Our CTO actually often codes on a white background in VSC 😎
What can we trade in all these tokens for? 😂 helpful seeing this info from your book in video format, thank you!
They were tradeable back then for some course discounts and one person winning a course for free, but I quit doing those anymore ;)
dark mode saves me from eye pain. I'm currently working on my first project and I started with a light mode but because of eye pain I made it all dark. And I ended up making wireframes dark too. Not that I'm happy about limiting myself like that. Gotta do something about it. And instead of using white on black I chose a dark bluish gray for screen which looks a bit matte and the texts are the blue of the youtube's Join button.
I love this video thank you!
Would you suggest -20% B on HSL or HSB?
I think I used HSB in this, on L the number should be a bit different.
haha I'm watching the video and holding my phone directly in front of my face 😅😅 nice to know what I look like now 🤣
haha! That is rare though!
How do you desaturate the colors please?
Switch from HEX to something like HSB or HSL and the S stands for saturation - simply decrease the number :)
Good tips
Glad it was helpful!
Very helpful video 💚💙. I wanna know what you mean by reducing saturation by 20 to 30%. Did you add gray, white, or black to the main color or did you reduce the opacity of the color?
In HSL or HSB color modes the S stands for saturation - so simply open the color picker, change the mode to one of those and decrease the number under S :-)
Dzięki Michał 🔥
🔥
some people on linked in jus copy pasting your work and not even giving credits to you man!!
it really hurt me how good content creator are getting robbed by this type of people
your student
I know - big “creators” steal my stuff too. Impossible to fix people’s bad morality but you can write them a comment about it 🫡
@@MalewiczHype Sensei
“When it comes to digital interfaces, we humans are pretty weird creatures.” Yeah cause we have them lol
How do you desaturate a color exactly?
The S value is for saturation, so simply make that value smaller.
@@MalewiczHype How do I do that in Figma?
How do you do this cool animations in your vids?
I create a lot of images and then animate them right within Final Cut Pro, no fancy external software.
love this video +1
love this comment +1 :)
"to the next level"
So sad that I will be available exactly 1 hour too late😧
It will be there the next day too :)
@@MalewiczHype yes. unless youtube dies
8 tokens
Congratulations, you won! :)
the real question is: does your app need a light mode?
for which the answer is 100% NO!
I think having a choice is good :) + Light mode works well if there's a lot of sun outside.