1 / 40

Outline

Outline. Color Terminology Color Wheels Additive vs. Subtractive Color Using the Color Wheel Computer Color Schemes Examples. C o l o r. Seeing color depends on 3 factors: The nature of light: consists of a large number of waves varying frequencies and wave length

tave
Télécharger la présentation

Outline

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Outline • Color Terminology • Color Wheels • Additive vs. Subtractive Color • Using the Color Wheel • Computer Color Schemes • Examples Color

  2. Color • Seeing color depends on 3 factors: • The nature of light: consists of a large number of waves varying frequencies and wave length • The interaction of light with matter: parts are absorbed and parts are reflected. • The physiology of human vision: photoreceptors receive the light and different frequencies gives different color sensations. Short wave colors like violet, blue, and green while longer frequencies gives yellow, orange, and red Color

  3. History of color • Newton (1704) used a prism to show that sunlight was composed of light with all colors in the rainbow. He defined it as the spectrum. Color

  4. Black and white • Light combining intensity of all frequencies is called white light • Sun light is called white light. It preserves the color of objects. • Black is the absence of light, not a color. Object that appear black absorb light of all visible frequencies. • Achromatic light has no color, but may vary in intensity, also called luminance (physical concept), which is perceived as brightness (psychological term) or level of grey. • We can represent it by a scalar between 0 (black) and 1 (white) Color

  5. The color of light • The brightness of a light source is usually unevenly distributed through a frequency spectrum. • Candlelight lacks high frequencies. It emits yellowish light. • Shining light emits light at all visible frequencies, but is richer towards the low frequencies and hence enhances the reds. • Fluorescent light is richer in high frequencies and enhances blues. • Sunlight has all frequencies but they have an uneven distribution: the mid-range (yellow, green) are stronger. • Since humans evolved in sunlight, we are most sensitive to yellow and green. Color

  6. Color Terminology • There are several other terms used to describe color, including • Hue • Saturation • Value Color

  7. Definition – a distinct color of the range of a color model Defined by a particular wavelength This is what most of us refer to when we say “color” ROY G. BIV = Red Orange Yellow Green Blue Indigo Violet Hue Color

  8. Saturation • Saturation: Refers to the amount of a color used. When a color is at full saturation, it is extremely bright and vibrant(نابض بالحياة). When a color is "desaturated," a large amount of color has been removed. Saturated colors tend to be close to being neutral because there is so much gray in them. • Low Saturated colors appear grayish in color High saturation Low saturation Color

  9. Value • Definition: the intensity of light present • how light or dark the color is • Also referred to as “brightness” or “intensity” • Range from “tints الصبغات” (light values) to “shades” (dark values) • Often accomplished by mixing the color with various amounts of white or black tints shades Color

  10. <------ hue ------> <------ lum ------> <------ sat ------> Color Model: HSV/HSL • HSV specifies a value from 0 to 255 for • Hue • Saturation • Value • HSL (Hue, Saturation, and Lightness/ Luminance) is a similar model, but “L” expands from white to black (rather than HSV’s black to hue), therefore providing a “double cone” Color

  11. The 3D space of additive colors Green (0,1,0) Yellow (1,1,0) Cyan (0,1,1) White (1,1,1) Black (0,0,0) Red (1,0,0) Where does the gray appear? Blue (0,0,1) Magenta (1,0,1) Color

  12. HSV color coding V Yellow Green • Hue: cyclic [0,360] R-Y-G-C-B-M • Saturation: pure color • Value: Luminance or Brightness Cyan Red White Green Yellow Magenta Blue White Cyan Red Black Blue Magenta S Black Color

  13. Webpage Example • The two screen shots primarily differ based on their saturation… • How has the appeal changed? • Is one of the slides more “generally appealing” than the others? Color

  14. Color Wheels • Help to arrange colors and determine appropriate combinations of color • Three types • subtractive color wheel(artist’s wheel or paint mixing) • additive color wheel Color

  15. Additive Color Wheel • Models how projected color combines • Black = no light (i.e., no color) • White = all light (i.e., all color) • Primary colors = • RED • GREEN • BLUE From which we getRGB • Used in computer monitors, TV sets, and stage lighting (LCD lights) Color

  16. Color Model: RGB • RGB stands for the primary additive colors • RED • GREEN • BLUE • Has become a standard and is often used in languages and programs (i.e., HTML, Flash) • Each value given an integer range from 0 to 255 • Can also be expressed as a hexadecimal value Color

  17. Subtractive Color Wheel • Models how painted color combines (since it is now on the paper and reflecting the light) • White = no color (all reflected) • Black = all color (none reflected) • Traditional (artist’s wheel) primary colors = • RED • YELLOW • BLUE OR… Color

  18. Subtractive Color Wheel • Printers (computer) use the following primary colors = • CYAN • MAGENTA • YELLOW From which we get CMYK • Subtractive color works through light absorption (what we see is the color not absorbed) • Magenta + Cyan = Blue • Cyan + Yellow = Green • Yellow + Magenta = Red Color

  19. Color Model: CMYK • CMYK stands for the primary additive colors • CYAN • MAGENTA • YELLOW • BLACK • The “K” stands for “key,” which is short for “key plate” (printing term) Color

  20. Subtractive color mixing • Colors can be mixed to combine their absorbing powers • Blue paint reflects blue, violet, green, but absorbs red, orange, yellow • Yellow paint reflects, red, orange, yellow, green, but absorbs blue, violet • When mixed, they reflect only green • This is called color mixing by subtraction • Primary subtractive colors: magenta, yellow, and cyan • The 3 most useful colors in subtractive mixing • Color printing uses 4 successive passes with different inks: • magenta, yellow, cyan and black Color

  21. Color Model: CMYK • Used especially in the printing of images + + + = ≈ Color

  22. Using the color wheel… • The color wheel makes it simple to determine color schemes for a multimedia project • Types of Colors • Primary • Secondary • Tertiary • Complementary colors • Split-complementary • Triad • Analogous Color

  23. Using the color wheel: Primary Colors • In the traditional wheel, the colors of the wheel that consist of • RED • BLUE • YELLOW • Primary colors are useful for designs or art that needs to have a sense of urgency. • Primary colors are the most vivid colors when placed next to each other, • Notice that most fast food joints use primary colors in their logos, as it evokes speed. Color

  24. Using the color wheel: Secondary Colors • colors equidistant between the primary colors • In the traditional wheel, these consist of • VIOLET (blue and red) • GREEN (yellow and blue) • ORANGE (red and yellow) • Secondary are usually more interesting than primary colors, but they do not evoke speed and urgency Color

  25. Using the color wheel… • Tertiary Colors • colors between the primary color and secondary color • In the traditional wheel, these consist of • RED-VIOLET • BLUE-VIOLET • BLUE- GREEN • YELLOW-GREEN • YELLOW-ORANGE • RED-ORANGE Color

  26. Using the color wheel: Complementary Colors • Exist across from each other on the color wheel that is a primary and a secondary • Contrast because they share no common colors (e.g., red and green (blue and orange)) • Produce excitement and “action” • Combining complements produces a neutral grey • Seen often in color schemes and logos • Example: • BLUE and ORANGE Color

  27. Using the color wheel… • Split-Complementary Colors • Exist on either side of the complementary color • A primary and two tertiary • Contrast, but not as significantly as complementary colors • Example: • BLUE and • YELLOW-ORANGE • RED-ORANGE Color

  28. Using the color wheel… • Triad Colors • Three colors located equidistantly around a color wheel • Primary colors • Secondary colors • Group of tertiary colors • Provides a balanced color scheme • Can be a good place to start exploring color palettes Color

  29. Using the color wheel: Analogous Colors • Colors adjacent to each other on the color wheel • Share enough common attributes that can complement each other • They are good for very serene-feeling designs and artwork where you want viewers to feel comfortable. • But, provides little contrast • Example: • BLUE • BLUE- GREEN • GREEN Color

  30. Webpage Example • The two screen shots differ based on their contrast… • Analogous colors are used • As well as various values and saturations • How has the appeal changed? • How has the perception of quality changed? Color

  31. Selecting Your Color Scheme Two Important Issues to consider… Message trying to send Audience you are trying to reach Color

  32. Webpage Example • Which would you feel most comfortable from buying from? Color

  33. Selecting Color • Warm Colors: Colors such as red, yellow, and orange. These colors evoke warmth because they remind us of things like the sun or fire. • Cool Colors: Colors like blue, green, and purple (violet). These colors evoke a cool feeling because they remind us of things like water or grass. • Neutral Colors: Gray, Brown. These aren't on most color wheels, but they're considered neutral because they don't contrast with much of anything. Color

  34. Selecting Your Color Scheme • Age Differences • Younger children prefer brighter, more solid colors • Adults prefer more pastel colors (i.e., light values/tints) • ClassDifferences • Working class prefer “named” colors: blue, red, green, etc. • More “highly educated” class prefers obscure colors: taupe, azure, mauve • Gender • Men tend to prefer cool colors (blues and greens) • Women tend to prefer warm colors (reds and yellows) • Seasonalissues • Winter = blacks, whites, grays • Spring = springgreens and bright colors • Summer = yellows • Fall = browns and golds Color

  35. Selecting Your Color Scheme • Cultural Issues • Geography • Warm climates = strong colors • Cooler climates = cooler, “more washed out” colors • Colors and their common connotations in Western culture Color

  36. Selecting Your Color Scheme Cultural Examples Color

  37. Selecting Your Color Scheme Cultural Examples Color

  38. Selecting Your Color Scheme • Setting Moods • Example: evidence suggests using green in the workplace results in less absenteeism through illness • Univ. of Iowa coach painted visitors locker room pink because research shows that it reduces aggression Color

  39. Webpage Example • The two screen shots differ based on their “temperature”… • Blue projects businesslike and authoritative • Explains use in many business websites • However, also cold, conservative, and unapproachable • Addition of red and yellow brings warmth and dynamism • Do you agree? Color

  40. Selecting Your Color Scheme • Using tools • MS color palette allows you to select rows for “harmonious” color schemes Color

More Related