2

I am totally newbie in graphic design which from Mobile development.I recently take a look at UX design for mobile.

I see the material design guideline in Google Material Design Guideline.But I have totally no idea how to use it in the design of my app.

For example I have this Color palette.If I use all this color in my app,it look like the whole app will be red.So which part of the app should use which color?Like button should use 200,the text should use 300(code in the image below),text and so on.Or can you all give me some guideline to organize the color in a specific palette to be use in UX or UI element?Something like best practice?cause it seem like a lot of color pallete out there,which should I choose?

enter image description here

Improve this question

1 Answer 1

Reset to default
3

"That's not how this works...it's not how any of this works!" :))

You do not have to use the same color for the entire app.

"Material Design’s color system

In Material Design, a primary color refers to a color that appears most frequently in your app. A secondary color refers to a color used to accent key parts of your UI.

Using colors from the Material Design palette is optional."

In general, you chose two (primary and secondary) colors that work well together, you even have this example:

enter image description here

But, just as the guidelines state, there are some apps that prefer to use only one, primary color and shades of it like this one:

enter image description here

And this is just to summarize:

All in all, the guidelines don't state to use a single color with all the different variations, they only guide you toward selecting the proper variation for different parts of the app. At the end of the day, picking out colors for the app is a matter of personal opinion, taste and what the app is for.

But I think an all red app would be pretty disturbing (but there's also exceptions like the Youtube or Pinterest App since they rely more on pictures/videos with a minimal red color scheme sooo...content is also a factor that you should consider wisely)

Also, here is a nice web tool to help you chose a primary and secondary color for your app and it will render a preview of how it will look like:

https://www.materialpalette.com/blue/yellow.

enter image description here *A blue/yellow combo shown above

It's especially nice cause it will also allow you to download the XML file that you can place directly in your app! :D

Improve this answer
9
  • wow..this is nice..thanks Alin..I have totally no sense in design..this just open my mind.
    – ken
    Jun 26, 2017 at 16:52
  • @ken Glad I could help you! Best of luck!
    – Alin
    Jun 26, 2017 at 16:55
  • Can I ask normally how many color use in a single app work the best? 2 will be good??
    – ken
    Jun 26, 2017 at 17:03
  • @ken yes, basically you try and stand by two, you will have two colors with shades (light/dark variations) plus white (text background) and black/gray for text :D PS: Just like in my Youtube/Pinterest example, depending on your app, it will take in a lot of color from it's content (video/photo).
    – Alin
    Jun 26, 2017 at 17:47
  • shades (light/dark variations) is which part ya??Sorry for if asking too much..
    – ken
    Jun 26, 2017 at 17:51

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.