Many people asked how I approach the colors in my project, I give an idea how I’m going to try a color, to the best of my ability some tools and tricks typically I manage when it comes to color in my work. I wish some of it might be useful to you, some of might not be. Take a glance, hope you enjoy my way.
User inteface design involves many processes in that color play the substantial role, so that an interface would meet the needs of the target audience, business and brand approach and more over we need to understand human psychology. In each step it requires deep attention to details, even if it doesn’t seem too complicated.
For me it’s time-consuming stage but still crucial role in UI creation, designers sometimes can spend hours to get pick up the right palette.
Usually I go with these seven recipe, which I found of over the years, this will be the practical tips to choose significant colors for UI and make this process easier and more productive.
1. Learn 60–30–10 rule
This thought to be pleasant for human eyes since it allows recognizing all the visual elements gradually, understanding the appropriate portion designers can successfully combine the colors without risks of turning UI into a colorful.
The technique came from the interior designers, so it is always applied for house decorating. The idea is simple, to carry the balance into the composition, the colors should be combined in the percentage of 60% — 30% — 10%. The biggest part should go to the dominant hue, the third of the composition takes secondary color and 10% percent goes to the color which helps to make the accents. This will allow me in UI design to make proper hierarchy in the colors.
2. Evaluate psychology of colors
Psychology is one of the fundamental studies supporting in design workflow, psychology shows the influence of colors on human mood and behavior. It acknowledges that our mind reacts on the colors while we usually do not notice it. When human eyes perceive a color, our brain gives signals to the endocrine system releasing hormones responsible for the mood and emotions.
Each color has its own impact on our mind and the knowledge of the possible reactions can help designers to transfer the right message and call users to make the expected action. Here is a short list of color significances.
In expansion, designers need to remember that visual perception is quite personal for everyone. Such factors as age and gender will influence the on color preferences, so it’s essential to know the target audience’s personality traits.
3. Seek the color harmony
Color harmony is the term for colors that are thought to match. In other words, colors that look aesthetically pleasing side-by-side. This is more an art than science as color perception is influenced by cognitive factors, emotion and culture.
Color harmony will brings users feel pleased and comfortable, we try to bring the balance into UI design. The color harmony is approximately the arrangement of the colors in design in the most desirable and effective way for users’ perception. Harmonic colors will provide the good impression from the website or application
4. Contrast will be the support
Color contrast is an important part of any UI design. This brings in the identity for each UI element and contrast make them noticeable. Contrast is simply a measure of the variation between two colors. Colors on opposite sides of the color wheel offer the greatest level of contrast, as do black and white. Contrast can be used to achieve balance or to draw a user’s attention to a certain feature or area of text.
Designers maintain the level of contrast depending on the goals it is supposed to achieve. For instance, if users need to pay attention to the specific UI elements, it’s a better idea to apply two highly contrasting colors. High contrast is often used for CTA buttons design.
5. Check cultural differences
The culture is part of human life and lifestyle. Humans behaviour will influence and reflect in every cultural. Each culture has its own traditions and beliefs, so before we choose the colors, we need to make sure that they will be interpreted the way, sometimes one color may have absolutely opposite meanings in different countries.
For instance, European countries white color signifies purity and it is always used at the weddings while in many Asian countries this color means death and sorrow used in funerals. Inappropriate usage will lead to misconceptions which could be fatal for a project. By recognizing the characters of cultures, color perception we will reduce risks of being misconceived.
6. Get inspired by Nature and animal kingdom.
We are all grown up watching and enjoying nature and whole animal kingdom, it’s just pets or wild animals. Mother nature is the biggest artist and designer in the world, color combinations which we can see in the natural environment are always close to perfect, sunsets and dawns, rainy forests and winter mountains or just a desert since they are full of natural color combinations. Even a peacock has bunch of colors in the feather.
So, we have to take a walk and explore for beautiful nature and will definitely find the inspiration.
7. Play with Tools
We wrapped a bit of theory behind how different colours can be combined to look exciting to the eye and achieve certain effects.
There’s plenties of online tools to use for finding a color palette or making your own. My most used tools are:
ColorZilla. This is a super awesome chrome extension that finds out the HEX code of any colour on a website.
Color Hunt. This is a place where professional designers go to curate their favorite color palettes. You can find Hot, Random, Popular pallets and depending on the mood of the color palette, you can find one for your particular project.
ColorSpace. Color Palettes Generator and Color Gradient Tool
Pigment. A unique way to generate fresh and vibrant colors based on lighting and pigment, instead of math. Find a beautiful, free color palette in seconds to kick off your next project.
