Colour is a cue that allows your audience to see what you want them to see, feel what you want them to feel, and to do what you want them to do. How you use colour also affects the usability – whether people can read your content or not.

Colour has an impact on how we think and behave. It directs our eye where to look, what to do, and how to interpret something, placing content into context. It helps us decide what is important and what is not. That’s precisely why it is important to keep colour in mind when designing your course banner and thumbnail.

The Basics Of Colour Theory

Understanding how colour works isn’t just for artists, anyone using content marketing needs to understand the basics of Colour Theory, because you are using colour in your content.

Colour can be broken up into 3 groups.

google ads 1Artboard 2@2x

The first is the primary colours, which are the three colours we need to make all other colours. They are red, blue, and yellow. These three colours can be used to create the next level of colours, called the secondary colours.

Secondary colours are purple, green, and orange. They are created using the primary colours. If you look on the colour wheel, you’ll find the secondary colours in between two primary colours.

red + blue = purple

blue + yellow = green

red + yellow = orange

And lastly the tertiary colours are taking secondary colours one step further. They are the “two-name” colours, such as red-purple, red-orange, yellow-green, etc. They are created by adding more of one primary colour than the other, creating not a true secondary colour but instead, one that is found closer to the primary colour.

The above system is called the ‘Subtractive Colour’ Mixing system, it is how most of us learn about colour at school with paints. In this system when you add all the colours together you get black.

google ads 1Artboard 3@2x

However when working with colours on a screen we use the ‘Additive Colour’ mixing system. Which means when you add all the colours together they become white. This is the system for RGB (red, green, blue) or Hex colours.

This is good to know as if you wish to change the theme colour of your course you can use a hex code to add a custom colour.

Now that we have covered the colour basics, here are a few helpful tips on how to use colours for effective communication.

Contrast is important when it comes to colour. Contrast is how one colour stands apart from another. It’s what makes text or objects distinguishable from the background. High contrast is when colours easily stand apart from each other. Low contrast is when they don’t. A lack of contrast may be the difference between a great banner and illegible one.

You can create contrast in many different ways by adjusting the darkness (shade), lightness (tint) or saturation of a colour.

google ads 1Artboard 4@2x

Another way to achieve a strong contrast is to use complementary colours. These are colours that sit opposite one another on the colour wheel.

However this doesn’t always guarantee strong contrast and the tone, tint or shade may need to be adjusted to ensure a comfortable contrast.

Contrast is especially important for text. OpenLearning is in the process of making our platform WCAG accessible which includes making sure text is visible to people who are colour blind or have vision impairment. If you want to check that your course is accessible for everyone you can check your colour choices for contrast at webaim .

Before we make a colour palette it is important to reflect on the different meanings and emotions different colours evoke. How we interpret the emotional value of colour depends upon our culture, senses, and personal tastes. There are however a few generalised understandings of what specific colours often mean to a large cross-section of people. Knowing some colour meanings is a useful thing to keep in mind when choosing a colour palette for your course.

Yellow:  Is often associated with happiness. It can also mean fear, optimism, madness, energy and joy. In general yellow is not a popular colour in business usually due to the playful and youthful vibe it gives off.

 

google ads 1Artboard 12@2x

Orange: Is friendly and warm. It can also symbolise caution and warning.

google ads 1Artboard 12 copy@2x

Red: Has long symbolised life, passion and desire. It also universally means stop. It is very eye catching and many famous logo’s such as Coca-Cola use this colour as a cornerstone of their visual brand.

google ads 1Artboard 12 copy 2@2x

Pink: In western society is often associated with femininity. It can also represent joy, sweetness and an idealistic point of view.

google ads 1Artboard 12 copy 3@2x

Purple: Traditionally has been connected with royalty and the mystic. It can evoke a spiritual feeling. It also can represent ambition.

google ads 1Artboard 12 copy 4@2x

Blue: Is the most popular colour in the world. When asked what is their favourite colour majority of people will say blue. It is a colour that can represent positivity (blue skies) and sadness. It is reliable and trustworthy colour, and very popular colour for logos such as Facebook, Samsung, IBM and twitter to name a few.

google ads 1Artboard 12 copy 5@2x

Turquoise: Is a calming colour. Not many companies use turquoise a part of their visual language, one example however is Tiffany’s & Co. which have taken advantage of the peaceful and sophisticated connotations of turquoise.

google ads 1Artboard 12 copy 6@2x.png

Green: Has many meaning from environmentalism to capitalism. Green is connected to healing and freshness. This is clear in its use in companies which want to associate themselves with these things such as Woolworths or Whole Foods.

google ads 1Artboard 12 copy 7@2x

Brown: Is associated with honesty and humility. These days it is a popular colour for packaging for organic products. Brown is generally not a very popular colour.

google ads 1Artboard 12 copy 8@2x

The following 3 are technically shades however are often Teated as colours.

Grey: Being in between white and black has many different meanings, some of which include reliability, monotony, maturity, technology and sophistication

google ads 1Artboard 12 copy 10@2x

Black: Has long been associated with nothingness and mystery. However in modern times it has taken on new meanings of sophistication, power and technology.

google ads 1Artboard 12 copy 9@2x

White: like black can symbolise nothingness, however traditionally it has been connected to goodness and positivity. It also can represent innocence, crispness, coldness and peace.

google ads 1Artboard 12 copy 11@2x

Now that we have thought about the possible meanings of various colours we can begin to combine them into a colour palette.

Creating a Colour Palette

Now we are ready to create a colour palette. Pairing colours can seem overwhelming so here are some basic rules to guide you.

Monochromatic uses various values (tints, tones, and shades) within the same colour family.

google ads 1Artboard 5 copy@2x

Complementary: these are colours that sit opposite each other on the colour wheel

google ads 1Artboard 5 copy 3@2x

Analogous harmonies are based on three or more colours that sit side-by-side on the colour wheel.

google ads 1Artboard 5 copy 2@2x

A split-complementary colour arrangement results from one colour paired with two colours on either side of the original colour’s direct complement creating a scheme containing three colours.

google ads 1Artboard 5 copy 4@2x

Triad colours are three colours equally spaced from one another, creating an equilateral triangle on the colour wheel.

google ads 1Artboard 5 copy 5@2x

To learn more you can read up on colour harmonies here 

 

Once you have a basic understanding of colours, choosing your course colours and creating effective course graphics becomes a lot easier. With these tips in mind, students will be looking forward to navigating through your beautiful courses in no time.

Happy creating! 🙂

 

 

Posted by Rommany O'Sullivan

Graphic Designer for OpenLearning

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s