Color - PowerPoint PPT Presentation

color n.
Download
Skip this Video
Loading SlideShow in 5 Seconds..
Color PowerPoint Presentation
play fullscreen
1 / 41
Color
195 Views
Download Presentation
kyne
Download Presentation

Color

- - - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript

  1. Color Background

  2. What is Color? • Aspect of vision • Physical reaction of the eye and the automatic interpretive response of the brain to wavelength characteristics of light • Color is light - different wavelengths are seen as different colors

  3. What is Color? Long Color is what we perceive as a result of different wavelengths of light. E.g., Sounds with long wavelengths = low noise. Light with long wavelength displays different colors than light with short wavelengths. Short Source: Bennett, J. (2005). Design Fundamentals for New Media. Thomson Delmar Learning: New York.

  4. What is Color? Gamut: refers to the entire spectrum of colors available for use in a specific medium. The entire visual spectrum. White triangle –colors that can be produced by a monitor. Black area – colors that can be produced using the CYMK color system for printing Monitor CYMK - print Source: Bennett, J. (2005). Design Fundamentals for New Media. Thomson Delmar Learning: New York.

  5. Computer monitor • Monitor made up of Red, Green and Blue dots. See them as homogenous color. RGB Color • EXAMPLE: If red and green dots are at 100%, while blue dots not lit, we see yellow color. • Dots can have value from 0 to 255. • Total number of possible colors is 256*256*256 = 16,777,216.

  6. RGB Colors • Color represented by three numbers: 0, 0, 255 • First number represents red • Second represents green • Third represents the blue. Pure blue color is 0, 0, 255.

  7. Colors | Terms • Hue - the edges of the square • Saturation – where color is placed between grey middle and the colored edge • Value (i.e., brightness or luminance) the intensity of the color and is the third attribute. http://www.colorotate.org/

  8. Colors • Contrasting colors (complements) are diametrically opposite on the color circle.

  9. Color complements • Red, Yellow, Blue primary colors • Colors opposite primary are complements • Green complement Red • Purple complement Yellow • Orange complement Blue

  10. Brain absorbs color and tries to balance total absorption of Red with its complement, Orange Source: http://poynterextra.org/cp/colorproject/color.html After Image will be Green

  11. After Image will be Orange

  12. After Image will be Purple

  13. Color & Science • Need a model that relates subjective sensation of color to measurable phenomena

  14. Color Models • An artist’s color wheel: red, yellow, and blue (RYB) • Additive color: red, green, blue (RGB) • Subtractive color: cyan, magenta, yellow, and black (CMYK) • Hue, saturation, and brightness (HSB)

  15. A color wheel

  16. Varying saturation, with brightness held constant

  17. Varying brightness, with saturation held constant

  18. http://kuler.adobe.com/#create/fromacolor Four Color-Harmony Schemes • Monochromatic: colors of same or similar hue, differing in brightness and/or saturation • Complementary: colors approximately opposite each other on a color wheel • Analogous: colors adjacent to each other, from any segment of a color wheel • Triadic: three colors approximately equally spaced around a color wheel

  19. Monochromatic color harmony: colors of same hue, differing in brightness and/or saturation All orange All blue

  20. Monochromatic color harmony: H16,S92,B38 H16,S18,B100 H16,S84,B100

  21. Monochromatic example

  22. Complementary Two opposite colors with any brightness or saturation

  23. Complementary: various blues, with red-orange highlights http://designwashere.com/complementary-colors-in-web-design/

  24. Complementary

  25. Analogous Two or more colors with hues close together.

  26. Analogous

  27. Analogous: red-orange through yellow-green

  28. Triadic: Any three colors spaced equally around CW.

  29. Triadic: red, yellow, blue

  30. Triadic: red, yellow, blue HSB values 240, 74, 80 55, 42, 100 351, 63, 83 240, 59, 57 55, 91, 91

  31. Sites | Color • http://websitetips.com/colortools/sitepro/ • http://colormixers.com/mixers/cmr/ • http://colorschemedesigner.com/ • http://learn.colorotate.org/learn-more.html • http://www.devwebpro.com/25-popular-color-scheme-and-palette-generators/ • http://www.allwebdesignresources.com/webdesignblogs/graphics/webdesigncolorcombinationsguide/

  32. Specifying Color Hexadecimal

  33. Color • Often for Web documents, colors are defined using a hexadecimal notation for the combination of Red, Green, and Blue color values (RGB). • The lowest value that can be given to one light source is 0 (hex #00). The highest value is 255 (hex #FF)

  34. Color Hexadecimal value: FF0000 FF 00 00 Red Blue Green

  35. Hexadecimal based-16 0 1 2 3 4 5 6 7 8 9 A B C D E F 0 1 2 3 4 5 6 7 8 9 A B C D E F 00 01 02 03 04 05 06 07 08 09 0A 0B 0C 0D 0E 0F 10 11 12 13 14 15 16 17 18 19 1A 1B 1C 1D 1E 1F - 31 F0 F1 F2 F3 F4 F5 F6 F7 F8 F9 FA FB FC FD FE - 254 FF - 255 Red value = 10 Hex value = 0a Red value = 11 Hex value = 0b Blue value = 16 Hex value = 10 Blue value = 26 Hex value = 1a Green value = 31 Hex value = 1f Green value = 32 Hex value = 20 RGB Values: 0 – 255 Hexadecimal: 00 - FF

  36. Web site • http://poynterextra.org/cp/colorproject/color.html