Presentation is loading. Please wait.

Presentation is loading. Please wait.

Introduction to Color Theory

Similar presentations


Presentation on theme: "Introduction to Color Theory"— Presentation transcript:

1 Introduction to Color Theory
Rationale: Welcome to “Introduction to Color Theory.” This presentation is designed to introduce your students to color theory, which will help them make color choices that are more than appeals to aesthetics. The nineteen slides presented here are designed to aid the facilitator in an interactive presentation of color theory.

2 Color Theory Color Theory is a system of rules and guidance for mixing various colors in order to: Create Aesthetically Pleasing Blends of colour Produce Maximum Readability and Clarity Visually Stimulate and Draw the Eye Draw on Cultural Associations to Create Meaning Color Theory will help your students create aesthetically pleasing color blends, produce communication with maximum readability, and use cultural association to effect meaning. The facilitator may want to ask students to discuss why they think certain colors work well together before moving on with the slides.

3 Why Learn Color Theory? Many people choose not to consult color theory. They think, “Well, I’ve got a good eye for these things.” The “good eye” for color may or may not be true based on who’s thinking it. . . . . . but in order to justify your choices it is good to have some theory to fall back on. Otherwise, all you can say is, “It just looks right!” Many students are accustomed to making color choices based on their own senses of what looks good. Sometimes that student’s eye may indeed make good choices. However, there are times when we need to justify our choices, and in those cases, it’s good to have theory supporting our decisions. Dealing with this problem is the whole reason a theory of color has developed.

4 The Foundation of Color
At its core, color is light. Light is composed of many different colors and the various mixtures of light compose the colors that we can see. Colours can be described by referring to its 3 characteristics: intensity (brightness) value (darkness or lightness) hue (actual wavelength mixture) Colors that can not be created by mixing other colors are called: PRIMARY COLORS To illustrate this point, the facilitator may want to discuss the differences in colors when viewed on a computer monitor versus colors viewed in print documents.

5 Primary Colors Primary colors are a good way to introduce the categorizations for the various color types. First, as the name suggests, they are the building blocks for all the other colors. Additionally, thinking about red, blue, and yellow as the primary colors predates current color theory and is therefore an important historical aspect of the topic. Finally, many of us have been introduced to (and likely retained) this concept from basic art courses. The primary colors are: red, blue, and yellow.

6 Secondary Colors (colors made by mixing primaries)
Secondary colors are created by mixing primaries. The secondary colors are purple, green, and orange.

7 Intermediate(Tertiary) Colors (colors that mix primary and secondary)
Tertiary colors are created by mixing primary and secondary colors.

8 Taken Together . . . The Color Wheel!
This is only one way of representing the color wheel visually. There are a number of different visual interpretations of the color wheel that may be more effective for different people. More complex color wheels show even more colors and set up a way to read them that highlight even more complex relationships. These can easily be found through a Google search; however, this basic color wheel should effectively introduce the concept.

9 Using the Wheel The colors are arranged on the wheel in such a way that purposeful color choices can be made. Choices of color combination depend on what you are trying to accomplish. Such as: Contrast elements Visual Blending Attract or Guide the eye Affect mood Communicate feeling The facilitator may want to revisit the question on which colors work well together after discussing the primary, secondary, and tertiary colors.

10 Color Contrast Contrast draws attention to the item that is most contrasting (or different) among a number of other design elements. Therefore, you can use color contrast to draw attention to an element of your design that is more important, relevant, or immediately pressing. Beyond aesthetic concerns, the decision to contrast an element of a design should be intimately tied with the communicative purpose of the document. If an item contrasts, it will stand out and draw attention. For what reason do you as the designer want that element to stand out? What is communicated?

11 Practical Example Neither of these flyers is completely ineffective and both provide shape contrast with the text box. But the orange box above provides a nice contrast with the blues and grays of the clothes rack. The blue box here, however, is too similar to the clothes’ color palette. This presentation is specifically about color; therefore, color contrast is the primary focus. However, contrast is obviously a more complex idea that this and involves a number of variables. Contrast can come in the form of colors, shapes, movements, fonts, sizes, and more. Learning to use different kinds of contrast together is another important technique in effective visual composing.

12 Types of Contrast Possible Using Colour
Value Contrast Simultaneous Contrast Intensity Contrast Temperature Contrast

13 Value Contrast The more a color contrasts with the colors around it, the more easily visible that color will appear. How much black or white each colour contains is one factor that controls this contrast. Value contrast is created by placing darker colours next to lighter ones. i.e. tints This fact is extremely important when using different colored texts or elements on backgrounds and we need things to either blend or stand out. This is why black text on a white background is so popular and effective. There’s a high degree of contrast. Black text on a white background is a convention that many of us simply write-off as a “it just is.” In other words, we are so accustomed to it that the rhetorical reasoning behind the contrast becomes invisible. In fact, the black/white combination is a purposeful choice based on maximum readability. On the other hand, blue on black offer little contrast. An extended read of this combination could be painful.

14 Here strong value contrasts in the main colours used within the work make the features of the face grab the attention and convey a certain personality.

15 In this work different values of blue contrast with each other and the outlining.

16 Notice the strong value contrasts in the left picture as compared to the right. The visual effect is blander and less eye catching.

17 “A Breeze at Work” by Sandy Skoglund uses value contrast to ‘hide’ the people in the work from immediate notice. The leaves command our attention first.

18 This piece uses many tints and shades of natural colours.

19 Simultaneous Contrast
But be careful, even though colors may contrast they may not always work well for pairing elements, or text, with background. Simultaneous contrast is the visual effect created when one colour appears to ‘vibrate’ against another. “Simultaneous Contrast” occurs when a color like red is fore grounded on blue, for example. Note how the text appears to slightly vibrate. This would get annoying really quickly. But also be aware of extreme lack of contrast between your elements, text, and background choices. Depending on the resolution of the computer on which this slide is displayed, and depending on how far away the audience is from the screen, the red/orange text box may be completely unreadable. This is one of those rare cases where that is actually all right. The impossibility will only further make the point that choosing contrasting colors is a medium and context specific decision. Honestly, this is just painful. Do not make your readers struggle with this!

20 Simultaneous contrast is most intense when the two colors are complementary colors. Complementary colors are pairs of colors, directly opposite on a color wheel. Yellow to orange and blue to blue-violet accentuate each other in van Gogh’s Café Terrace on the Place du Forum, Arles, 1888.

21 Equinox, Hans Hofmann, Note how the contrasting colors create energetic forms, which Hofmann famously termed “push and pull.” Simultaneous contrast affects our sense (perception) of the color that we see. For example, our perceptions of red and blue flowerbeds in a garden are modified where they border each other: the blue appears greener and the red, more orange. This is due to the way our eyes work. Leonardo da Vinci describes the simultaneous contrast of complementary colors, as follows: “Of different colors equally perfect, that will appear most excellent which is seen near its direct contrary: violet near yellow, green near red: because each color is more distinctly seen when opposed to its contrary than to any other similar to it.”

22 Here is a good example of use of simultaneous contrast
Here is a good example of use of simultaneous contrast. Notice how the orange colours of the sun vibrate against the blue, as does the yellow of the boat and the red-orange islands against the turquoise water.

23 Here is another example of simultaneous contrast in use
Here is another example of simultaneous contrast in use. In this work some colours in the sky are a bit ‘off’ due to how they vibrate against each other a bit too much.

24 Intensity Contrast Each colour has its own brightness, or intensity, as well as value and hue. Some colours are naturally brighter than others. This type of relationship between colours can be used to direct the eye through a work or draw it to a specific focal point. Intensity contrast is created when bright colours are placed next to dull ones. Black text on a white background is a convention that many of us simply write-off as a “it just is.” In other words, we are so accustomed to it that the rhetorical reasoning behind the contrast becomes invisible. In fact, the black/white combination is a purposeful choice based on maximum readability. 24

25 Intensity Contrast Which picture has greater Intensity contrast?

26 Temperature Contrast Temperature contrast is created when warm colours are placed next to cooler ones. Warm colours are colours which contain yellow or red in them. They make things appear closer. Cool Colours are colours which contain blue in them. They tend to recede in a composition.

27 Using the Wheel Warm Cool Warm vs Cool Colours
Designer can use the color wheel to determine color schemes for a number of media: documents (brochures, reports, etc.), websites, and slide presentations.

28 Not only do you have value contrast happening here but you also have warm vs cool colours – temperature contrast.

29 Colour Schemes Complementary Triadic Analagous Monochromatic
Split Complementary Double Complementary

30 Using the Wheel Monochromatic Colours
Compositions created using one colour on the wheel and its tints and shades. These colors will provide the most pleasing blends. Contrast is provided in various degrees. Designer can use the color wheel to determine color schemes for a number of media: documents (brochures, reports, etc.), websites, and slide presentations.

31 Monochromatic Colours

32 Monochromatic Colours

33 Using the Wheel Complementary Colors
Colors opposite from one another on the wheel. These colors will provide the most visual contrast, particularly simultaneous contrast. Contrast is the noticeable level of difference between two colors. Designer can use the color wheel to determine color schemes for a number of media: documents (brochures, reports, etc.), websites, and slide presentations.

34 Complementary Colours

35 Complementary Colours

36 Using the Wheel Analogous Colors
Colors positioned next to each other on the wheel. These colors have very little contrast; therefore, they will provide harmonious blends. Analogous colors work well together in blends.

37 Analogous Colors in Nature
Nature offers an excellent look at analogous colors in action. Question: what color of flower could be added to this photo to provide a strong and attention drawing contrast? This slide provides an opportunity to go back and actually use the color wheel the way it is intended. If we look at where these colors are on the wheel, and if we use the theory of analogous colors, the color wheel will suggest that a flower in a purple shade will provide the most contrast.

38 Analagous Colours

39 Using the Wheel Triadic Colour Scheme
Colors equidistant from one another on the wheel. These colors will provide the most visual variety. Designer can use the color wheel to determine color schemes for a number of media: documents (brochures, reports, etc.), websites, and slide presentations.

40 Triadic Colours

41 Triadic Colours

42 Using the Wheel Split Complementary Colour Scheme
Colors on either side of a direct complement of a colour on the wheel. These colors will provide the most visual variety. Designer can use the color wheel to determine color schemes for a number of media: documents (brochures, reports, etc.), websites, and slide presentations.

43 Split Complementary Colours

44 Using the Wheel Double Complementary Colour Scheme
Colors on either side of a pair of direct complements on a colour on the wheel. These colors will provide the most visual contrast as double pairs of colours. Designer can use the color wheel to determine color schemes for a number of media: documents (brochures, reports, etc.), websites, and slide presentations.

45 Double Complementary Colours

46 Color and Cultural Association
Color’s often come with feelings, moods, and associations that you can draw from in your work. For example, the color Red is largely associated with danger, aggression, stimulation, and excitement. Red stop signs signify danger if you don’t stop, and stimulates the senses with excitement less you don’t see one coming up! Although most people would agree with these associations that come with the color red, it is important to stress that these associations do not HAVE to go with this color. In other words, they are ultimately arbitrary connections that have developed through a history of social meaning making.

47 Color and Cultural Association
It’s an important to remember that these color associations do not come from the color itself. Without us to interpret it, red is simply light and doesn’t need an interpretive characteristic. Because these associations depend on us, they can differ from culture to culture, and they can also change over time. For example, purple use to be associated with solely belonging to royalty. When designing, it’s important to consider your audience. The people viewing your composition may not share your same cultural values. In Western cultures, red means Stop! or Attention! In Asian cultures, red means good luck or good fortune. When designing, it’s important to consider your audience. The people viewing your composition may not share your same cultural values. In Western cultures, red means Stop! or Attention! In Asian cultures, red means good luck or good fortune.

48 Resources for Color Association
There are a number of sources that list and suggest color associations that are commonly agreed upon by many people. A particularly interesting and useful one contains a number of fun Flash videos that illustrate these associations with music and animation. Color in Motion “Color in Motion” is an interactive, Flash-based movie tutorial composed by Maria Claudia Cortes. The video was her RIT MFA thesis project in computer graphics design (2003). She currently works for Eastman Kodak Company.


Download ppt "Introduction to Color Theory"

Similar presentations


Ads by Google