Design and UX November 8, 2020

Color Theory for Product Makers

Ilona Dee @ilonacodes

Considering color combinations while designing a digital product very much necessary for a product maker.

I know that designers bear all this in mind 100% of the time when they are selecting colors for a brand/product identity.

They will choose colors for various reasons, including that they evoke the right emotions, are aesthetically pleasing, and ultimately ones that are more likely to sell products.

Color is one of our most powerful tools in any design and has a powerful psychological effect on our brains.

And, here’s the tricky part – the same color can have a different effect on different groups of people. Hence, color help in defining the business objectives of the upcoming product. For example:

‣ Green is often associated with the environment, health issues, cleanliness, etc.

‣ Violet or purple connotes royalty, glamour, charm, mystery.

‣ Pink is mostly related to feminity, youth for women, delicateness, fashion.

‣ Yellow best represents a feeling of happiness and sunshine. Soft yellow is commonly used as a gender-neutral color for babies or young children.

‣ Orange is strongly associated with creativity.

‣ Blue traditionally refers to masculinity, safety, and harmony. Most of the banks and insurance companies use blue as a primary color.

‣ Red is the all-time favorite among promoters, associated with power, wealth, luck.

As you can see, we need to think carefully about the color choices and how to mix various colors to achieve the intended results for the right user groups/audience.

After studying color theory for product creation, I learned good and useful patterns of picking the right colors and designing visual elements:

👉 Make graphic elements more realistic

Try to shade and highlight objects with complementary colors (two colors that are on opposite sides of the color wheel) for richer and more accurate objects.

Blending and glazing with complementary colors look realistic.

I.e., if you are working with the object that filled yellow, you need to get purple out and shade with that.

But don’t make the purple oversaturated. Otherwise, it will look off.

👉 Don’t go overboard with colors

One or two accents look good.

There are many color schemes to choose from, but don’t try to use all of them at once.

👉 Generate many variants of color schemes

That you think would work.

Subconsciously, you might know the primary color for the product and what mood you want.

So experiment, experiment, experiment until you find that perfect color scheme match.

👉 Be aware of how colored objects interact when they’re near

Because they might affect the color of other nearby colored objects and create an unwell color mix.

Light gets tinted as it bounces off surfaces. For instance, if you place a white rounded element like a logo near a red background, then you will see some red illusion on the white background logo.

Texture and opacity of the object also play into this.

👉 Use neutral colors as the backdrop in design

Neutral colors (black, white, gray, and sometimes brown and beige) are commonly combined with colors that have a brighter accent.

However, they can also be used on their own in product design and can create very sophisticated layouts.

The impressions of neutral colors are much more affected by the colors that surround them than warm (red, orange, yellow, and their combinations) and cool colors (blue, green, purple, and their combinations).

👉 Make a color wheel to understand how colors work

A color wheel shows how colors are related.

Start with red, yellow, and blue - the primary colors.

Use these to make secondary colors.

Then make tertiary colors by mixing primary colors with the nearest secondary colors. (For example, mix yellow with green to make yellow-green, or yellow with orange to make yellow-orange).

💬 Conclusion

Color theory helps me understand the relationship between colors and how people perceive them.

While color choice should be treated seriously, there are other important aspects and considerations to product design as well.

The choice of fonts, graphic elements, where it will be used, size, how it will be reproduced, all need to factor in on creating that perfect design.

Creativity happens as a result of hard work and practical experiments.

Luckily for us, we can get our primary creative thinking and color taste already at the beginning of design studying and will perfect them only if we are serious about it.

  1. 4

    Color is one of our most powerful tools in any design and has a powerful psychological effect on our brains.<

    Great post, Ilona! Colors play an important role in positioning brands. There are many tools these days to help designers choosing the perfect color combination such as:

    https://coolors.co/
    https://colorhunt.co/
    https://brandcolors.net/

    If you are interested to find more resources, join us at Doesign, an all-in-one design tool directory for UX/UI/graphic designers. Would love to have you there!

    1. 2

      Thank you for your reply! It's helpful, indeed. Each time picking the right color scheme, fonts, and other element styles are more challenging than coding for me 😅

Recommended Posts