The basic purpose of color theory in design
By: Nick Burd
Tags: Psychology, Startup, UX, Design, UI

The basic purpose of color theory in design

Colors are detrimental to our mood, the same as they might impact our user’s decisions on our websites or when looking at marketing materials. Not all people process color the same way, and your perception of materials can differ from my own. But the subconscious decisions that you or I will make based on the designer’s use of color will typically be similar.

Photo by Annie Spratt on Unsplash

When Newton established the color wheel back in the 1600’s he realized that not all colors are created equal. To display this he was able to create a wheel that laid out the 3 definitive groups of color.

Primary (blue, red, yellow)

(blue, red, yellow) Secondary (mixing primary colors)

(mixing primary colors) Tertiary (mixing primary and secondary colors)

Newton also established properties that allow for different depth of color, for example, how using black or white can adjust the tone of a color.

Starting with an initial hue, we can add to the chroma of the color by introducing white(tint), black(shade), or grey(tone).

A couple more states to consider before diving a bit deeper into the theory aspect would be monochromatic (variants of a hue by adding white or black to create similar colors). Complimentary (opposite colors to suggest contrast) and split-complementary (colors from either side of the complementary to lessen the contrast).

The theory — what your users need to see

When you’re designing marketing materials such as websites, posters, business cards, and flyers, it’s important to make them eye-catching. There’s no better way to capture the attention of someone other than of a big pop of color and contrast.

Photo by Taylor Heery on Unsplash

When we use color to attract our users, we’re initially triggering a response in their brains of curiosity. Once we’ve got their attention, it’s ideal to continue to draw them in using continuous visual cues to lead their eye toward the content that is important for them to digest.

Treating your design projects with a little UX discovery session, even for brochures or flyers, you’re going to improve your users’ information retention. Making a user persona, for example, and applying color pallets to suit that specific sub-set of users could make a more meaningful impact.

Color is not an option to be considered when designing. It is a key factor in your brand’s psychological impact on your users. This could define your entire project’s success or value, and is worth the effort to do it right.

Emotional connections with color

Photo by Austin Neill on Unsplash

We touched briefly on colors that resonate well with users. To do this, we might want to consider what specific colors are more prone to make us feel. We could use a strong blue, red, or purple on our posters for our upcoming concert (if you’re reading this in 2020 or 2021, you might not remember, but music was once played live in front of many people at once pre 2020). To choose the best color for our poster, perhaps we consider the audience and music genre.

Some examples of colors that could make you think of specific genres could be:

Black / Dark red for Rock or Metal

Yellow or orange for pop music

Neutral grey’s and white’s with accents of lime green or yellow for R&B

Brown for country music

Bright blue and purple for EDM

Mellow pastel blue/green for Hip Hop

It doesn’t stop there. Color could also make your brain think differently about certain products or businesses as well. Blue is always thought to be more professional, where as orange is normally associated with food and hunger.

Some emotions that color might evoke could be:

Red - aggression & anger. However has the power to demand attention in design for error and emphasis.

- aggression & anger. However has the power to demand attention in design for error and emphasis. Yellow - friendly & warning. But yellow can also encourage an energetic feeling but has the equal chance of suggesting to pay attention. Yellow is almost instantly recognizable as a color.

- friendly & warning. But yellow can also encourage an energetic feeling but has the equal chance of suggesting to pay attention. Yellow is almost instantly recognizable as a color. Blue- trustworthy & inviting. One of the most popular colors in design when related to professionalism. It’s essential to trust businesses in certain aspects, therefore many businesses use this as their primary color.

The 60–30–10 rule

I’m not going to touch too deep on this, however you can read a bit more about it here. Essentially, it’s important to establish a rule where the majority of the layout is a neutral color such as white or a shade of grey (60%) — incorporating a complementary or primary color of 30% followed by 10% of accent color to work with your primary color.

The colors your choose here can work with your brand pallet that might already be established before your project commencement.

Most importantly

If not all projects, there will undoubtedly be most of them that come with branding to consider. It’s always essential to incorporate the personality and colors attributed to the brand itself. This is important for businesses and establishing brand recognition, so do your best to incorporate colors that associate well with the brand rather than ignoring the constraints you might need to work within.