visual and graphic design color theory 1. lesson objectives define terminology related to color...

39
Visual and Graphic Design Color Theory 1

Upload: alban-copeland

Post on 29-Dec-2015

224 views

Category:

Documents


0 download

TRANSCRIPT

Visual and Graphic Design

Color Theory

1

Lesson Objectives• Define terminology related to color theory• Identify types of color schemes• Develop a color scheme• Identify the RGB values for drawing objects• Design a color wheel using RGB values• Establish the CYMK values for drawing objects

2

PART ONE

Color Terminology &Color Schemes

3

Color Terminology• Color: Color results when light is reflected

off of an object. As the light hits an object, some of the light wave is absorbed into the object. A portion of the light wave is reflected back to your eyes.

• The color that is reflected is determined by the LENGTH of the light wave that is reflected from the object.

4

Color Terminology• Primary colors:

– Red, Yellow, and Blue– These are considered the basic colors.– All other colors can be created by using a mixture of any

of these three colors.

5

RED YELLOW BLUE

Color Terminology• Tints

– Created by adding white to a color

• Shades– Created by adding black

to a color

6

BlackBlue

Shade

White

Blue + =

Blue TintBlue + =

Color Terminology• Secondary colors:

– Orange, Violet, and Green

– Created by mixing equal amounts of two primary colors

7

Blue+Red Violet=

Yellow+Blue Green=

Yellow+Red Orange=

Color Terminology• Tertiary colors:

– These colors can be created by mixing a primary color with an adjacent secondary color

– OR they can be made by mixing unequal amounts of two primary colors.

8

Violet

Blue

GreenYellow

Red

OrangeRed-

Orange

YellowGreen

Blue-Green

Red-Violet

+ =

+ =

+ =Red

Green+ =

Primary + Secondary = Tertiary

Color Terminology• Neutral colors:

– White– Brown– Black– Varying shades of each

9

Black

Gray

White

Tan

Brown

Red-Orange

Yellow-Orange

Yellow-Green

Blue-Green

Blue-Violet

Red-Violet

Color Terminology• Color Wheel:

– If we arrange the primary, secondary, and tertiary colors in a circle, adjacent to the colors according to their mixture combinations, we get a color wheel.

10

Violet

Blue

Green

Yellow

Red

Orange

Red-Orange

Yellow-Orange

Yellow-Green

Blue-Green

Blue-Violet

Red-Violet

Color Schemes• Complementary

colors: – Any two colors that are

exactly opposite on the color wheel

11

Violet

Blue

Green

Yellow

Red

Orange

Red-Orange

Yellow-Orange

Yellow-Green

Blue-Green

Blue-Violet

Red-Violet

Color Schemes• Split-complement

colors: – Has three colors– Pick a color– Find the two adjacent

colors of its complementary color

12

Violet

Blue

Green

Yellow

Red

Orange

Color Schemes• Analogous colors:

– Any three colors that are side by side on the color wheel

13

Violet

Blue

Green

Yellow

Red

Orange

Red-Orange

Yellow-Orange

Yellow-Green

Blue-Green

Blue-Violet

Red-Violet

Color Schemes• Triad colors:

– 3 colors that are equally distant from each other on the color wheel

– Most basic triad scheme is the 3 primary colors

– If you lay an equilateral triangle (triangle with all three sides the same length) in the middle of the color wheel, the tips of the triangle will point to three colors that make up a triadic scheme.

14

Violet

Blue

Green

Yellow

Red

Orange

Red-Orange

Yellow-Orange

Yellow-Green

Blue-Green

Blue-Violet

Red-Violet

Color Schemes• Square Scheme:

– Have four colors that are equally distant from each other on the color wheel

– If you lay a square in the middle of the color wheel, the tips of it will point to the four colors that make up a tetrad scheme.

15

Violet

Blue

Green

Yellow

Red

Orange

Red-Orange

Yellow-Orange

Yellow-Green

Blue-Green

Blue-Violet

Red-Violet

Color Scheme Example

• Square Pairs– Place a square in the

middle of the color wheel.

– Your four colors are located at the corners of the square.

– Choose two colors for the majority of your objects and let the other two colors be accents.

16

Color Scheme Example

• Analogous Scheme – Choose any 3 colors

that are side by side on the color wheel.

– Any neutral color may be brought in as an accent.

17

The Meaning of Color

Click on a color to learn about its meaning.

Black

White

The Meaning of Color-Red• Red is the color of fire. It is associated with energy,

war, danger, strength, power, determination and love.

• Red is a very emotionally intense color. It enhances human metabolism, increases respiration rate, and raises blood pressure. It has very high visibility, which is why stop signs, stoplights, and fire equipment are usually painted red. It is a color found in many national flags.

• Red brings text and images to the foreground. Use it as an accent color to stimulate people to make quick decisions; it is a perfect color for 'Buy Now' or 'Click Here' buttons on Internet banners and websites. Red is widely used to indicate danger (high voltage signs, traffic lights). Return to

Meaning of Color

Main Page

The Meaning of Color-Orange

• Orange combines the energy of red and the happiness of yellow. It is associated with joy, sunshine, and the tropics. Orange represents enthusiasm, fascination, happiness, creativity, determination, attraction, success, and encouragement.

• To the human eye, orange is a very hot color, so it gives the sensation of heat. Nevertheless, orange is not as aggressive as red. Orange increases oxygen supply to the brain, produces an invigorating effect, and stimulates mental activity. As a citrus color, orange is associated with healthy food and stimulates appetite. Orange is the color of fall and harvest.

• Orange has very high visibility, so you can use it to catch attention and highlight the most important elements of your design.

Return to

Meaning of Color

Main Page

The Meaning of Color-Yellow• Yellow is the color of sunshine. It's associated with joy,

happiness, intellect, and energy. • Yellow produces a warming effect, arouses cheerfulness,

stimulates mental activity, and generates muscle energy. Yellow is often associated with food. Bright, pure yellow is an attention getter, which is the reason taxicabs are painted this color. When overused, yellow may have a disturbing effect; it is known that babies cry more in yellow rooms. Yellow is seen before other colors when placed against black; this combination is often used to issue a warning.

• Use yellow to evoke pleasant, cheerful feelings. Yellow is very effective for attracting attention, so use it to highlight the most important elements of your design. Shades of yellow are visually unappealing because they loose cheerfulness and become dingy.

Return to

Meaning of Color

Main Page

The Meaning of Color-Green• Green is the color of nature. It symbolizes growth,

harmony, and freshness. Green has strong emotional correspondence with safety. Dark green is also commonly associated with money.

• Green has great healing power. It is the most restful color for the human eye; it can improve vision. Green suggests stability and endurance. Sometimes green denotes lack of experience; for example, a 'greenhorn' is a novice. Green, as opposed to red, means safety; it is the color of free passage in road traffic.

• Green is directly related to nature, so you can use it to promote 'green' products. Dull, darker green is commonly associated with money, the financial world, banking, and Wall Street.

• Dark green is associated with ambition, greed, and jealousy. Olive green is the traditional color of peace.

Return to

Meaning of Color

Main Page

The Meaning of Color-Blue• Blue is the color of the sky and sea. It symbolizes

trust, loyalty, wisdom, confidence, intelligence, and truth.

• Blue is considered beneficial to the mind and body. It slows human metabolism and produces a calming effect. Blue is strongly associated with tranquility and calmness.

• Blue is used to promote products and services related to cleanliness (water purification filters, cleaning liquids), air and sky (airlines, airports, air conditioners), water and sea (sea voyages, mineral water).

• When used together with warm colors like yellow or red, blue can create high-impact, vibrant designs; for example, blue-yellow-red is a perfect color scheme for a superhero.

Return to

Meaning of Color

Main Page

The Meaning of Color-Purple• Purple combines the stability of blue and the energy

of red. Purple is associated with royalty. It symbolizes power, nobility, luxury, and ambition. It conveys wealth and extravagance. Purple is associated with wisdom, dignity, independence, creativity, mystery, and magic.

• According to surveys, almost 75 percent of pre-adolescent children prefer purple to all other colors. Purple is a very rare color in nature; some people consider it to be artificial.

Return to

Meaning of Color

Main Page

The Meaning of Color-White• White is associated with light, goodness, and

innocence. It is considered to be the color of perfection.

• White means safety, purity, and cleanliness. As opposed to black, white usually has a positive connotation. White can represent a successful beginning.

• White is associated with hospitals, doctors, and sterility. White is also often associated with low weight, low-fat food, and dairy products.

Return to

Meaning of Color

Main Page

The Meaning of Color-Black• Black is associated with power, elegance, death,

evil, and mystery.• Black is a mysterious color associated with fear and

the unknown (black holes). Black denotes strength and authority; it is considered to be a very formal, elegant, and prestigious color (black tie event).

• Black gives the feeling of perspective and depth. When designing for a gallery of art or photography, you can use a black or gray background to make the other colors stand out. Black contrasts well with bright colors. Combined with red or orange – other very powerful colors – black gives a very aggressive color scheme.

Return to

Meaning of Color

Main Page

PART TWO

Electronic Color &RGB values

Copyright © Texas Education Agency, 2013. All rights reserved.

27

Electronic Color• Computer Monitors:

– Use light in 3 colors to create images on the screen

– Monitors use RED, GREEN, and BLUE color

– This is called RGB– Text and object color are

determined by its RGB values

28

Blue

Green

Red

Electronic Color• Setting RGB values:

– Click on the Shape Fill button – Choose the More Fill Colors

option– Click on the Custom tab

29

Electronic Color• Setting RGB values:

– A color is defined by three values

– These values must be within the number range 0-255

– Blue is created by a Blue value of 255; Red and Green values are 0

– Equal values of Red and Green create Yellow

30

Electronic Color• Setting RGB values:

– When all values are 0, it creates black

– When all values are 255, it creates white

31

Assignment #1• Create a color wheel:

– Create drawing objects and fill them with color by changing the RGB values.

– Move and rotate the objects to create a color wheel.

– There should be 4 color variations between each primary and secondary color.

32

PART THREE

Printed Color &CMYK values

33

Pigment Color• Color Printers:

– Use mixtures of 4 colors– Printers use CYAN, MAGENTA,

YELLOW, and BLACK color– This is called CMYK

34

Cyan

Magenta

Yellow

Black

Pigment Color• Color Printers:

– Combinations of CMYK will create Blue, Red, or Green

– The monitor screen displays color in RGB values; the printer will print that color in CMYK values.

– Sometimes, the translation causes the color on a printout to be different than that on the screen

35

CyanMagenta + = Blue

YellowMagenta + = Red

CyanYellow + = Green

Pigment Color• Setting CMYK values:

– In some programs, you can switch the color mode from RGB to CMYK

36

Pigment Color• Setting CMYK values:

– A color is defined by four values

– These values must be within the number range 0-100

– You can achieve the same color selection as RGB but using CMYK values instead

– The color Blue• in RGB values is 0, 0, 255• In CMYK values is 99, 67, 0,

20Copyright © Texas Education Agency, 2013. All rights reserved.

37

Assignment #2• Create a paint strip:

– Using a software program that allows CMYK values, recreate the color scheme of a paint chip sample.

– Print the document, then record the RGB values and CMYK values for each color.

– Print the document in color.– Staple the paint chip sample to the document.

38

The End

39