The Role of Colour in Character and Scene Design

WHY IS COLOUR IMPORTANT?

According to psychological market research, colour can account for up to 60% of the acceptance or rejection of a product (Kissmetrics, 2015). In the same way, a character or scene will look thrown together or implausible if colour is not carefully considered throughout the design process. This is because colour greatly contributes to the mood and story of a piece (Price, 2014). If compelling and meaningful choices are made, colour can be used to imply a characters personality or role within the story (Diaz, 2011). To use colour effectively, we must first understand basic colour theory, the different attributes of colour and to use them harmoniously.

BASIC COLOUR OVERVIEW

Basically, all colours originate from the three primary hues: yellow, blue and red (Lovett, 1999).

primary_secondary_tertiary

Secondary colours are created by mixing two adjoining primary hues and tertiary colours are created by mixing two adjoining secondary hues (Lovett, 1999). Compound colours are mixtures of the three primary hues (browns and khakis) (Lovett, 1999).

While this is important for blending colours, even more important is understanding the different attributes of colour and how they can be used to achieve a mood, focal point or atmosphere.

THE ATTRIBUTES OF COLOUR

Hue

This is the identity of a colour separate from its saturation or value. The hue establishes whether the colour is blue, orange, green-yellow etc (CGCookie, 2013).

disk-rays

Saturation and Value

Every colour has a hue, saturation and value. Saturation refers to the intensity of a colour while value refers to how light or dark it is (Price, 2014). These can be used to guide the viewer, set the mood and tell a story.

ColourMost commonly, saturation and value can be used to create a focal point. For example, areas of high saturation draw the eye (Price, 2014). This technique is used a lot in fashion photography. As seen below, the focal point is the bright lipstick.

fashion-photography-for-Marie-Claire-8449Similarly, areas of high value contrast, that is a difference of light and dark values, become the focal point (Lovett, 1998). For example, in Howard Pyle’s Marooned, the contrast between the bright sky and the darkened figure of the pirate make him the focus point of the piece.

Marooned_(close_up)However, it is important not to overdo saturation or value. High saturation and high value contrast should be used sparingly on selected focus points. Too many saturated colours gives no focal point and becomes confusing and ugly (Price, 2014). Some cartoons or animations try to use this as a style but it can look garish.

3nogifekeyimageidAdditionally, saturation can be used to influence the mood of a piece. High saturation gives a vibrant and joyous feel while desaturated colours feel serious, dull, old and sad (Price, 214). For example, the first shot of Shanghai in Skyfall is bright and vibrant suggesting opportunity and adventure.

vlcsnap-2015-11-30-09h37m57s984While the first shot of Skyfall is desaturated and dull symbolising the old memories and ghosts the James Bond associates with the estate.

vlcsnap-2015-11-30-09h35m33s185

But how can we use this in character design?

In terms of saturation we can try to explore the characters personality. In Edward Scissorhands, Kim wears bright colours to show her vibrant, outgoing personality while Edward wears tones and even has pale makeup to demonstrate his more reserved and serious personality.

edward scissorhands53Alternatively, we could use saturation to direct of the eye of the viewer. Lilith, from Borderlands 2, wears slightly desaturated colours while her bright red hair is quite saturated. This creates a focal point on her face which her hair so nicely frames.

According to Diaz (2011) main characters should have values that make them distinctive, even in black and white. Looking at Spike from Cowboy Bebop, consider how the contrast of the yellow shirt and dark blue jacket catches the eye. This effectively frames his face, thus making it the focal point.

Spike_Spiegel_No_Background

Temperature

When looking at the colour wheel, we can cut it in half. On one side are the cool hues, on the other are the warm hues. A colour’s temperature is measured in degrees Kelvin (K) but this is more important for editing photos than for design.

eveyyiqrlhnaxwzu9fhuCooler colours give an introspective vibe (Diaz, 2011). They tend to be calm, calculating and soothing and will often receded into a scene (CGCookie, 2013). In contrast to this, warm colours have an energetic feel (Diaz, 2011). They tend to feel brighter and more vibrant and will often ‘pop’ out of a scene (CGCookie, 2013).

With this in mind, temperature can be effectively used to convey a character’s personality. Consider Miguel and Tulio from The Road to El Dorado.

307544-the-road-to-el-doradoMiguel has a warm colour palette reflecting his optimistic, outgoing personality while Tulio has a cool palette reflecting his calculating, more cynical personality.

For design, using a harmony of both cool and warm colours is highly effective (CGCookie, 2013). However, combining excessive amounts of both can make the design seem busy, chaotic and ugly (Kissmetrics, 2015). For this reason, it is good idea to pick a dominant temperature and use the other temperature as a highlight (CGCookie, 2013). For example, in a predominantly cool design, a warm colour will pop out and vice versa. This can be used to great effect when designing both characters and scenes.

For example, Aang, from Avatar: The Last Airbender, is composed of warm colours with the cool highlight of his arrow tattoo.

avatar-the-last-airbender-flyingThe warm colours reflect his sunny, outgoing personality and make the blue tattoo stand out even more. You can’t help but to notice it thus constantly reminding the viewers that Aang is the Avatar (as signified by these tattoos).

Katara_Aang_Sokka_-_The_Avatar_StateIn addition to this, Aang is the only character that has a combination of cool and warm colours (other characters have only one or the other). This again makes him stand out against the rest of the cast and positions him as the main character. Not to mention that, in the beginning of the series, the secondary characters wear cool colours to provide even more of a contrast.

COLOUR HARMONY

Colour schemes are different ways to harmony between colours within a piece. Different schemes and different levels of harmony can create different moods or feelings. Extreme harmony can make an image seem boring or flat while no harmony can seem chaotic and messy (Morton, 2015). A couple of basic schemes are explained below:

Monochromatic

A single hue is used while the value and saturation is varied (Price, 2014).

AndyWarhol-Grey-Marilyn-Monroe-1967

Analogous

Three adjacent hues (Morton, 2015). As this is frequently seen in nature, this scheme is harmonious and pleasing to the eye (Kissmetrics, 2015). It appears natural, serene and comforting (Price, 2014).

2992389-green_arrow

Complementary

Two hues on opposite sides of the wheel (Morton, 2015). As this creates maximum contrast is it good to use one as the dominant colour and the other for splashes or highlights (Kissmetrics, 2015; Price, 2014).

Disney-s-Robin-Hood-walt-disney-characters-22260111-900-547

Split Complementary

A variation of the complementary scheme (Price, 2014). Uses the two hues adjacent to one of the complementary hues (Kissmetrics, 2015). Again, this scheme has a high degree of contrast but is not as drastic as the complementary scheme. This scheme creates a joyous mood (Price, 2014).

Genie5

Triadic

A triangle of hues. This is hard to do well and can seem childish. If all three are used in equal amounts it will look chaotic and ugly (Price, 2014). It’s best to use one as a background and the others as highlights (Kissmetrics, 2015).

1231178185_super-mario-cheers

Tetradic

Also called rectangle, two sets of complementary pairs (Kissmetrics). Again, equal amounts of each will be chaotic. Works best when one pair is used for the foreground and the other for the background (Price, 2014). Warm and cool hues need to be balanced well.

joker-comic

From Nature

Nature has an abundance of unique and interesting colour schemes that might not fall into the traditional schemes or rules (Morton, 2015). Have a look around and see if you can find something that captures the mood or feel that you need.

36795-work-011 - Copy

The colours of this Nudibrach could work well for cyberpunk / hacker story.

desktop-1427985029 - Copy

The colours of this Mantis Shrimp could work well for acid trip or similar.

REMEMBER THAT COLOUR REACTS TO ITS SURROUNDINGS. IT WILL BEHAVE DIFFERENTLY IN RELATION TO OTHER COLOURS SO IT IS IMPORTANT TO EXPERIMENT.

FINAL CONSIDERATIONS

When designing a scene or character it is important to understand what you want before you begin choosing colours. You must consider what you are trying to say or convey about the character. Remember characters don’t exist in a vacuum, they live in a world or environment. Consider the colours around them and what it says.

Do they fit in?

THE HOBBIT: AN UNEXPECTED JOURNEY

Earthy tones in both character and scene design suggest that he belongs.

Or do they stand out?

08 - Copy

Contrast between bright colours and dark tones suggests he doesn’t fit in.

Think about how you will demonstrate this through hue, saturation, value and harmony.

Additionally, if a character appears in a single environment it is important that they work well in that one environment (Diaz, 2011). While a character that is in multiple environments must be able to work in all of them.

17474-desktop-wallpapers-fireflyNeutral colours help the more action orientated characters from Firefly blend into every environment. This makes them seem competent in every situation.

Finally, don’t overdo it. Colour can be used subtly to great effect. Think about interesting ways that you can incorporate colour and what it can say about your characters and world.

project_image - Copy


REFERENCES

CGCookie. (2013). Getting Started: Color Basics. Retrieved from
http://cgcookie.deviantart.com/art/Getting-Started-Color-Basics-398299191

Diaz, A. (2011). Tips on Character and Costume Design. Retrieved from
http://floobynooby.blogspot.com.au/2011/12/tips-on-character-and-costume-design-by.html

Kissmetrics. (2015). The Art of Color Coordination. Retrieved from
https://blog.kissmetrics.com/art-of-color-coordination/?wide=1

Lovett, J. (1998). Tonal Contrast. Retrieved from
http://www.johnlovett.com/tonal.htm

Lovett, J. (1999). Colour Theory. Retrieved from
http://www.johnlovett.com/colour.htm

Morton, J.L. (2015). Basic Color Theory. Retrieved from
http://www.colormatters.com/color-and-design/basic-color-theory

Price, A. (2014). Understanding Color. Retrieved from
http://www.blenderguru.com/tutorials/understanding-colors/

Advertisements

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 )

Twitter picture

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

Facebook photo

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

Google+ photo

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

Connecting to %s