Outline Color and Color Space Color for information visualization Color harmonization Visible Light Visible Spectrum of Light Wavelength Human Vision Human Cone Response to Color three cone types SIL correspond to BGR ID: 930765
Download Presentation The PPT/PDF document "Color Huamin Qu Hong Kong University of ..." is the property of its rightful owner. Permission is granted to download and print the materials on this web site for personal, non-commercial use only, and to display it on your personal computer provided you do not modify the materials and that you retain all copyright notices contained in the materials. By downloading content from our website, you accept the terms of this agreement.
Slide1
Color
Huamin QuHong Kong University of Science and Technology
Slide2Outline
Color and Color SpaceColor for information visualizationColor harmonization
Slide3Visible Light
Visible Spectrum of Light
Wavelength
Slide4Human Vision
Human Cone Response to Color
three cone types (S,I,L) correspond to B,G,R
400
460
530
650
600
700
500
Wavelength (nm)
Relative response
Blue
Cyan
Green
Red
490
I
L
S
Slide Courtesy of Chester F. Carlson Center for Imaging Science
Slide5Color Matching Process
From
“
Foundations of Vision
”
by B. Wandell
Slide6The Tristimulus Theory
Any perceived color could be generated by some combination of three primary colorsRGB CurveNegative Intensity
Figure courtesy of D. Forsyth
Slide7CIE XYZ
CIE (Commission Internationale d’Éclairage)CIE tristimulus values XYZY is luminanceAll positive curves
Figure courtesy of D. Forsyth
Slide8Color Spaces
Use color matching functions to define a coordinate system for color.Each color can be assigned a triple of coordinates with respect to some color space (e.g. RGB).Devices (monitors, printers, projectors) and computers can communicate colors precisely.
Slide9CIE XY Chromaticity Diagram
Slide10RGB Color Space
Slide11Some Colors Cannot Be Displayed
Slide12CIE LUV Color Space
A uniform color space used to illustrate or quantify relative color differences.The Euclidean distance between two points is a measure of the difference between the colors.
Slide131976 CIE u'v' Chromaticity Diagram
Slide14HSV Color Space
HSV: Hue Saturation Value - Hue: the color type - Saturation: the “vibrancy” of the color - Value: the brightness of the color
From Wikipedia
http://en.wikipedia.org/wiki/HSV_color_space
Slide15Color Wheel
Slide16Combining Colors
Additive (RGB)
Shining colored lights
on a white ball
Subtractive (CMYK)
Mixing paint colors and
illuminating with white light
Slide17Usage of Color for Visualization
To labelTo quantify
Slide18http://colorbrewer2.org/
Nature of your dataSequentialDivergingQualitative
Slide19Qualitative
Slide20Rules for Qualitative Color Scheme
The maximum number of colors which can be used is usually between 6 to 12The 12 recommended colors Red 2. Green 3. Yellow
4
.
Blue
5. Black
6
. White
7. Pink 8. Cyan 9. Gray 10 Orange 11. Brown 12. Purple
Slide21Slide22Color Family
Slide23Color for Sequential Data
Slide24Slide25Use a sequence that varies monotonically on at least one of the opponent color channels
Examples are red to green yellow to bluedark to lightlow saturation to high saturation
Slide26Slide27Slide28Slide29Divergent Color Scheme
Slide30Slide31Slide32Slide33Color Harmonization
https://www.youtube.com/watch?v=fH8qhDt3Z6Q
Slide34Color Harmonization
Slide35Monochromatic
Slide36Analogous
Slide37Complementary
Slide38Triadic
Slide39Tetradic
Slide40Color Used in Tableau
Slide41Slide42Slide43Slide44Color from DataWatch
Slide45Bad Color: Red + Blue
Slide46Slide47Slide48Slide49Colorblind
Slide50Logo color
Slide51Red = Adventure. Energy. (Coca Cola
)Pink = Compassion. Nurturing. (Breast Cancer Research Foundation; Barbie)Orange = Cheerful. Warm. Optimistic. (Amazon)
Yellow = Happy. Bright. Sunny. (McDonalds
)
Green = Health and Healing. Environment. Organic. (Whole Foods Market; Starbucks
)
Blue = Honesty. Trust. Dependability. (Facebook; Pfizer
)
…
Slide52Using Color for Visualization
Coding qualitative vs. quantitative data - use differing hues for qualitative data - use continuous variation for quantitative dataUse familiar color coding - “red
”
for hot, dangers, cautions, & warnings
>> watch for culture conflicts (e.g., red in Asian cultures)
Slide53Coding Information with Colors
Limit color numbers - (5- 10)Don’t have blue and red togetherBe careful with blue (small blue objects, blue objects on dark background). Our eyes are not sensitive to blueRed-Green are good color combinations. For people with red-green color blindness, Yellow-blue are usually OK.