Understanding Color – Youtube video

~I only summarized what was mentioned in the video and do not own anything here~

~All images here are screenshots of the video~

Saturation

Don’t overdo it – lots of bright saturated color looks incredibly fake and leave no time for the eye to rest, hence irritating when view for sometime.

Guide viewers by using bright saturated color sparingly a line of bright red along the back guide the direction of camels

Use it to tell a story – animated flim used alot of bright saturated color for a sense of animation

Affects mood – brightness and saturation = happy, dull and desaturated = sadness

Draws attention to something – highly saturated point is used for viewer to anchor

Color Harmony

Monochromatic

only one colour
Best for single subject
atmospheric

Analogous

easy on the eye
peaceful, comfortable mood
seen alot in nature

Triadic

best for cartoon/ surreal
hard to pull off

Complementary

very popular
naturally pleasing on eye
use one color predominantly – the weaker colour

Split complementary

More creative freedom
Feels lively/ joyous

Tetratic (Double Complementary)

best used for foreground/background – a set at foreground/ a set at background
hard to pull off
never 25% for each

Color Research

Black – HEX:#000000 RGB:0, 0, 0 CMYK 0, 0, 0, 100

Sophistication, glamour, security, emotional safety, efficiency, substance

Oppression, coldness, menace, heaviness.

White – HEX:#FFFFFF RGB: 255, 255, 255 CMYK 0, 0, 0, 0

Hygiene, sterility, clarity, purity, cleanness, simplicity, sophistication, efficiency

Sterility, coldness, barriers, unfriendliness, elitism

Red – HEX:#FF0000 RGB: 255, 0, 0 CMYK: 0, 100 , 100, 0

Physical courage, strength, warmth, energy, basic survival

Defiance, aggression, visual impact, strain

Blue – HEX:#0000FF RGB: 0, 0, 225 CMYK 100, 100, 0, 0

Intelligence, communication, trust, efficiency, serenity, duty

Coldness, aloofness, lack of emotion, unfriendliness

Green – HEX:#00FF00 RGB:0, 255, 0 CMYK: 100, 0, 100, 0

Harmony, balance, refreshment, universal love, rest, restoration, reassurance, environmental awareness

Boredom, stagnation, blandness, enervation.

Yellow – HEX:#FFFF00 RGB:255, 255, 0 CMYK: 0, 0, 100, 0

Optimism, confidence, self-esteem, extraversion, emotional strength, friendliness

Irrationality, fear, emotional fragility, depression, anxiety, suicide

Cyan – HEX:#00FFFF RGB 0, 255, 255 CMYK 100, 0, 0, 0

nature and the natural world, tranquility, good luck, health, and jealousy.fertility

Boredom, stagnation, blandness, enervation.

Magenta – HEX:#FF00FF RGB:255, 0, 255 CMYK:0, 100, 0, 0

harmony and emotional balance, passion, transformation, uplifting, cheerfulness, happiness, contentment

depression and despair, arrogance and bossiness, anxious and intolerant

Pink – HEX:#FF0066 RGB:255, 0, 102 CMYK: 0, 100, 60, 0

Physical tranquillity, nurture, warmth, femininity, love, sexuality

Inhibition, emotional claustrophobia, emasculation, physical weakness.

Orange – HEX:#FF9900 RGB:255, 153, 0 CMYK:0, 40, 100, 0

Physical comfort, food, warmth, security, sensuality, passion, abundance, fun

Deprivation, frustration, frivolity, immaturity

Gray – HEX:#808080 RGB:128, 128, 128 CMYK: 52, 43, 43, 8

Psychological neutrality

Lack of confidence, dampness, depression, hibernation, lack of energy.

Teal – HEX:#008080 RGB:0, 128, 128 CMYK: 86, 31, 49, 8

emotional balance and stability, alleviating feelings of loneliness, cool, calm and collected

secrecy and confusion, lacking communication skills, being unreliable and deceptive

Lime – HEX:#BFFF00 RGB:191, 255, 0 CMYK: 30, 0, 100, 0

Harmony, balance, refreshment, universal love, rest, restoration, reassurance, environmental awareness

Boredom, stagnation, blandness, enervation.

Maroon – HEX:#800000 RGB:128, 0, 0 CMYK: 29, 100, 100, 38

Seriousness, warmth, Nature, earthiness, reliability, support.

Lack of humour, heaviness, lack of sophistication.

Violet – HEX:#8000FF RGB:127, 15, 255, CMYK: 50, 94, 0, 0

Spiritual awareness, containment, vision, luxury, authenticity, truth, quality

Introversion, decadence, suppression, inferiority

Principles of design

Unity/Harmony

When all elements are in agreement, a design is considered unified. No individual part is viewed as more important than the whole design.

Perspective: sense of distance between elements.
Similarity: ability to seem repeatable with other elements.
Continuation: the sense of having a line or pattern extend.
Repetition: elements being copied or mimicked numerous times.
Rhythm: is achieved when recurring position, size, color, and use of a graphic element has a focal point interruption.
Altering the basic theme achieves unity and helps keep interest.

Balance

It is a state of equalized tension and equilibrium, which may not always be calm.

Symmetry
Asymmetrical balance produces an informal balance that is attention attracting and dynamic.
Radial balance is arranged around a central element. The elements placed in a radial balance seem to ‘radiate’ out from a central point in a circular fashion.
Overall is a mosaic form of balance which normally arises from too many elements being put on a page. Due to the lack of hierarchy and contrast, this form of balance can look noisy but sometimes quiet.Symmetrical example in real life:

The left and right of the architecture is mirrored with the central plane which made the building symmetrical.

Asymmetrical example in art:

Hierarchy

contains elements that lead the reader through each element in order of its significance.

Images should be expressed starting from most important to the least important.

Example of hierarchy in art:

The Proportion and placing enthroned Madonna and Child make it the most important subject, followed by those wearing red, and lastly to those in the background.

Example of hierarchy in typography:

The most importation information to be read first with the biggest font, and at the top,

Secondly most in sequence information second and medium font and lastly the information that should be read last having the smallest font and placing at the bottom.

Scale/proportion

relative size of elements against each other can attract attention to a focal point.

When elements are designed larger than life, scale is being used to show drama.

Example of scale in photography:

The scale of the finger is way larger than the figurine, its is automatically processed by the brain that it is a small figurine instead of it is a giant hand.

Examples of Proportion in Sculpture:

The proportion of the arm is way larger than it should be for that small head, it attract attention due to the abnormality of the disproportion.

Dominance/emphasis

created by contrasting size, positioning, color, style, or shape.

The focal point should dominate the design with scale and contrast without sacrificing the unity of the whole.

Examples of dominance/emphasis in Photography:

A single bright blue raspberry stands out from a crowd of red raspberry, it draws attention to the blue raspberry making the other red raspberry to become the background.

Similarity and contrast

Planning a consistent and similar design is an important aspect of a designer’s work to make their focal point visible

Too much similarity is boring but without similarity important elements will not exist and an image without contrast is uneventful so the key is to find the balance between similarity and contrast.

Example of Similarity in graphic design:

The pattern is repeated, however the colour of a single stickman is different with other to show contrast.

Example of Contrast in Painting:

The flower is being emphasis by having a contrast with the black background which makes it stand out.