How do you apply color in mobile UI design projects? Here’s a little tip, the 60-30-10 color rule(it’s more like a guideline) will help you to get a good start to applying color in a mature and seamless way… Remember to Subscribe https://goo.gl/6vCw64
How can you use color inside of your mobile UI design projects to come out looking really mature and really seamless and really well thought out and not obnoxious and loud? And really the worst thing that it could be is distracting. Well, you might want to use a little rule or guideline called the 60 30 ten rule, which is going to help you to understand how to use color, how to implement color, and when to break that rule. We’re going to talk all about that coming up next.
————————————————————————————
🤝 //////////// Get my new Intro to UI/UX design course:
https://learn.jesseshowalter.com/c/intro-to-ui-ux-design/?
🏆 //////////// Join my members community to get access to perks:
https://www.jesseshowalter.com/design-champs
📫 ////////// Sign up for my Monthly Newsletter
www.jesseshowalter.com/newsletter
————————————————————————————
🎨 ////////// I design in Figma
https://psxid.figma.com/xcm8rxa8f162-cb44ct
🖥️ ////////// I build websites with Webflow
https://webflow.grsm.io/4495884
📅 ////////// I run my life with Notion
https://affiliate.notion.so/tokendsfahjf
🎵 ////////// Take your films to the next level with music from Musicbed. Sign up for a free account to listen for yourself: https://fm.pxf.io/c/1372011/1347628/16252
————————————————————————————
Design Examples:
https://dribbble.com/shots/15571949-Task-Manager-Mobile-App-Design
https://dribbble.com/shots/15460654-Task-Management-Mobile-App-Design
https://dribbble.com/shots/17637163-Eugen-app
https://dribbble.com/shots/17446776-Heyring-Job-Search-Mobile
source
Which color will be used like 60% color , 30% color and 10% color.
60–> background
30–^ main heading
10 — sub jeading
Like the given pattern can i used?
thank you very much for the video, it is really helpful to me – a color-blind guy 😀
Great content. There's a hi pass switch on your 7b. Would remove the boomy Ps and Ts in your audio.
Great video bro thanks for this
Super interesting, what would be the rules to choose those three colors?
Cool man
I see you, man in the fake glasses
its really really useful video as i am so confused in putting up the colors into the design. Thank you so much!!
No post in description to the blog post?
Thank you
1:07 and i had to stop. dont worry, i can see my way out. thanks for trying though
thnx
or maybe just be creative instead of sticking to arbitrary smooth brain status quo
I liked more the first version 🙁
As a newer designer I am glad to have been recommended this video. Helped with my landing page, Thank you sir! You are a gentleman and a scholar!🎉
Damn man it's a good idea
Any gray/grey text is text that is going to be ignored, because its illegibility says (psychologically, and overtly) "ignore me."
Useful information, but your microphone is in the worst possible place.
I kept hearing plosives making the sound pop, despite your foam cover.
I suggest getting a stand to keep the microphone off to the left or right, getting a "pop screen" (little bit of stretchy fabric over a loop), or put a "dead cat" (big fuzzy caterpillar) filter over the microphone instead of the default foam one. Hope this helps!
This is genius I love this 🙌
Helpfull. Thanks alot :3
Thanks for explaining beautiful concept of 60,30,10 😊
60-30-10 is the way.
As a backend developer that seem like a simple enough rule of thumb to follow whenever I need to put out any front end so it doesn't suck so much
Thank for this video. I am making Power BI reports and already see how I can implement it.
Jesse, does this rule also apply to desktop and web apps?