CS252. User Interface Design

Lecture Outline for Jan. 21
Computer-Generated Color


1.     How Color Is Described
     Most people organize their color experiences along three dimensions


     Color can be described in terms of three visually abstractable dimensions
     hue:


     value:


     chroma:


     Familiar model of color mixing (paints)   "subtractive mixing"









2.     Computer-Generated Colors
     Display color produced when electron beams light up colored phosphors
          phosphors are arranged in triads (1 triad per pixel)


     Now vary color by mixing lights, rather than pigments   "additive mixing"








     How computers display colors
     



	     VRAM



	     bit depth




      Monochrome displays



      8-bit color displays






      24-bit color displays






3.     Specifying Computer Colors
     Now use terms hue, saturation (relative purity), and brightness (relative strength)





     (1)  How would you change the RGB triad for a saturated red (e.g., 255-0-0) to make it pink instead?



     (2)  How would you obtain a duller red, without changing the hue or saturation?



     (3)  Given an arbitrary RGB triad, how can you identify the color's relative 
          (a) hue?


          (b) saturation?


          (c) brightness?



4.     Discrepancies between Science and Perception
     The RGB model is misleading




     Monitors vary too





     RGB space is mathematically uniform, but perceptually it's very non-uniform





      --> A large proportion of RGB space is perceptually worthless

5.     Guidelines for Color Use   Based on Technological Factors
     See "color guideline" Web pages for more info
     (1)  Where possible use hardware-independent "standard" color values, at least as a baseline RGB
          for modification.





     (2)  Be sure the duration of an image is long enough to allow the perception of color.



     
     (3)  Alternating colors too quickly will cause them to be perceived as a single, fused color.



     (4)  Display colors should be selected experimentally, not mathematically.



     (5)  To reduce the effects of flicker, use dark colors for backgrounds, large expanses of color, and 
          dense text.



     (6)  Put light colors next to dark colors to remain monochrome-compatible.



6.     Best and Worst Color Combinations
     Gerald Murch's (1984) work in color combinations for lines and text (see color handout)
     Also available as "guidelines on color combinations" on Web pages
          used "standard PC colors"   vary in hue rather than saturation or brightness
     Findings:




     In fact, color may be less important than font choice
     CS252 recommended font choices: