colormaps 101 sources – russell taylor comp 290 course notes colin ware – perception for design...
TRANSCRIPT
![Page 1: Colormaps 101 Sources – Russell Taylor Comp 290 course notes Colin Ware – Perception for Design IBM Web Site An Excellent Paper: A Rule-based Tool for](https://reader035.vdocuments.us/reader035/viewer/2022081603/56649efc5503460f94c0ecad/html5/thumbnails/1.jpg)
Colormaps 101
Sources – Russell Taylor Comp 290 course notesColin Ware – Perception for Design
IBM Web Site
An Excellent Paper:A Rule-based Tool for Assisting Colormap Selection, L. Bergman, B. Rogowitz and L. Treinish. Proceedings of the IEEE Computer Society Visualization '95 pp. 118-125, October 1995.
Rachael Brady
Visualization Friday Forum
November 22, 2002
![Page 2: Colormaps 101 Sources – Russell Taylor Comp 290 course notes Colin Ware – Perception for Design IBM Web Site An Excellent Paper: A Rule-based Tool for](https://reader035.vdocuments.us/reader035/viewer/2022081603/56649efc5503460f94c0ecad/html5/thumbnails/2.jpg)
Color is useful for classification
Color is not needed to understand shape, spatial relationships of objects, movementLaboratory assistant went 21 years without realizing he was color-blind
![Page 3: Colormaps 101 Sources – Russell Taylor Comp 290 course notes Colin Ware – Perception for Design IBM Web Site An Excellent Paper: A Rule-based Tool for](https://reader035.vdocuments.us/reader035/viewer/2022081603/56649efc5503460f94c0ecad/html5/thumbnails/3.jpg)
Color Space: RGB
Taken from Russell Taylor II, UNC CS 290 Course Notes
![Page 4: Colormaps 101 Sources – Russell Taylor Comp 290 course notes Colin Ware – Perception for Design IBM Web Site An Excellent Paper: A Rule-based Tool for](https://reader035.vdocuments.us/reader035/viewer/2022081603/56649efc5503460f94c0ecad/html5/thumbnails/4.jpg)
Colorspace: HSV
Taken from Russell Taylor II, UNC CS 290 Course Notes
![Page 5: Colormaps 101 Sources – Russell Taylor Comp 290 course notes Colin Ware – Perception for Design IBM Web Site An Excellent Paper: A Rule-based Tool for](https://reader035.vdocuments.us/reader035/viewer/2022081603/56649efc5503460f94c0ecad/html5/thumbnails/5.jpg)
Opponent Process Theory (Hering 1920)
The six elementary colors are paired on 3 orthogonal axis:Black-White, Red-Green, Yellow-Blue
Modified from Russell Taylor II, UNC CS 290 Course Notes
![Page 6: Colormaps 101 Sources – Russell Taylor Comp 290 course notes Colin Ware – Perception for Design IBM Web Site An Excellent Paper: A Rule-based Tool for](https://reader035.vdocuments.us/reader035/viewer/2022081603/56649efc5503460f94c0ecad/html5/thumbnails/6.jpg)
Color Category Perception
• Task: Name the colors• Regions same > 75%• Nonuniform sizes
• Why “rainbow scale” is so nonuniform
• The fact that only 8 hues were named out of 210 different colors indicates that there may be only a few colors available for labeling.
Taken from Russell Taylor II, UNC CS 290 Course Notes
![Page 7: Colormaps 101 Sources – Russell Taylor Comp 290 course notes Colin Ware – Perception for Design IBM Web Site An Excellent Paper: A Rule-based Tool for](https://reader035.vdocuments.us/reader035/viewer/2022081603/56649efc5503460f94c0ecad/html5/thumbnails/7.jpg)
Other Color Issues• Color Blindness
– Most red/green color blind (10% of males, 1% females)
• Field Size– Avoid small spots, especially in yellow/blue– Small areas: strong, highly-saturated colors– Large areas: low saturation with slight differences
• Conventions– U.S.: Red = danger, Green = life– China: Red = life, Green = death– Some scientific domains have color conventions
Taken from Russell Taylor II, UNC CS 290 Course Notes
![Page 8: Colormaps 101 Sources – Russell Taylor Comp 290 course notes Colin Ware – Perception for Design IBM Web Site An Excellent Paper: A Rule-based Tool for](https://reader035.vdocuments.us/reader035/viewer/2022081603/56649efc5503460f94c0ecad/html5/thumbnails/8.jpg)
Designing of a colormap•Perceptually Ordered Sequence is required, such as black-white, red-green, blue-yellow, or saturation (dull->vivid)
Note: a perceptually ordered sequence will result from a series of colors that monotonically increase or decrease with respect to one or more of the color opponent channels
•Use a Luminance Ordered Sequence for High Spatial Frequency Data
•Use a Saturation Ordered Sequence for Low Spatial Frequency Data
•Use several discrete colors when it is necessary to read back values (to avoid contrast effects)
![Page 9: Colormaps 101 Sources – Russell Taylor Comp 290 course notes Colin Ware – Perception for Design IBM Web Site An Excellent Paper: A Rule-based Tool for](https://reader035.vdocuments.us/reader035/viewer/2022081603/56649efc5503460f94c0ecad/html5/thumbnails/9.jpg)
Example Colormaps
Source: Ware, Perception for Design
![Page 10: Colormaps 101 Sources – Russell Taylor Comp 290 course notes Colin Ware – Perception for Design IBM Web Site An Excellent Paper: A Rule-based Tool for](https://reader035.vdocuments.us/reader035/viewer/2022081603/56649efc5503460f94c0ecad/html5/thumbnails/10.jpg)
Not ordered (red at both ends)
Taken from Russell Taylor II, UNC CS 290 Course Notes
![Page 11: Colormaps 101 Sources – Russell Taylor Comp 290 course notes Colin Ware – Perception for Design IBM Web Site An Excellent Paper: A Rule-based Tool for](https://reader035.vdocuments.us/reader035/viewer/2022081603/56649efc5503460f94c0ecad/html5/thumbnails/11.jpg)
Luminance (Gray) Scale
Taken from Russell Taylor II, UNC CS 290 Course Notes
![Page 12: Colormaps 101 Sources – Russell Taylor Comp 290 course notes Colin Ware – Perception for Design IBM Web Site An Excellent Paper: A Rule-based Tool for](https://reader035.vdocuments.us/reader035/viewer/2022081603/56649efc5503460f94c0ecad/html5/thumbnails/12.jpg)
Saturation Scale
Taken from Russell Taylor II, UNC CS 290 Course Notes
![Page 13: Colormaps 101 Sources – Russell Taylor Comp 290 course notes Colin Ware – Perception for Design IBM Web Site An Excellent Paper: A Rule-based Tool for](https://reader035.vdocuments.us/reader035/viewer/2022081603/56649efc5503460f94c0ecad/html5/thumbnails/13.jpg)
Hue Scale
Taken from Russell Taylor II, UNC CS 290 Course Notes
![Page 14: Colormaps 101 Sources – Russell Taylor Comp 290 course notes Colin Ware – Perception for Design IBM Web Site An Excellent Paper: A Rule-based Tool for](https://reader035.vdocuments.us/reader035/viewer/2022081603/56649efc5503460f94c0ecad/html5/thumbnails/14.jpg)
Hue+Luminence
Taken from Russell Taylor II, UNC CS 290 Course Notes
![Page 15: Colormaps 101 Sources – Russell Taylor Comp 290 course notes Colin Ware – Perception for Design IBM Web Site An Excellent Paper: A Rule-based Tool for](https://reader035.vdocuments.us/reader035/viewer/2022081603/56649efc5503460f94c0ecad/html5/thumbnails/15.jpg)
Hue+Saturation
Taken from Russell Taylor II, UNC CS 290 Course Notes
![Page 16: Colormaps 101 Sources – Russell Taylor Comp 290 course notes Colin Ware – Perception for Design IBM Web Site An Excellent Paper: A Rule-based Tool for](https://reader035.vdocuments.us/reader035/viewer/2022081603/56649efc5503460f94c0ecad/html5/thumbnails/16.jpg)
Black Body Radiation
Taken from Russell Taylor II, UNC CS 290 Course Notes
![Page 17: Colormaps 101 Sources – Russell Taylor Comp 290 course notes Colin Ware – Perception for Design IBM Web Site An Excellent Paper: A Rule-based Tool for](https://reader035.vdocuments.us/reader035/viewer/2022081603/56649efc5503460f94c0ecad/html5/thumbnails/17.jpg)
Colormap Choice Should be Linked to TaskAtmospheric Motion
Bergman, Rogowitz, Treinish, IEEE Vis ‘95
![Page 18: Colormaps 101 Sources – Russell Taylor Comp 290 course notes Colin Ware – Perception for Design IBM Web Site An Excellent Paper: A Rule-based Tool for](https://reader035.vdocuments.us/reader035/viewer/2022081603/56649efc5503460f94c0ecad/html5/thumbnails/18.jpg)
Colormap Choice Should be Linked to TaskPollution Levels
Bergman, Rogowitz, Treinish, IEEE Vis ‘95
![Page 19: Colormaps 101 Sources – Russell Taylor Comp 290 course notes Colin Ware – Perception for Design IBM Web Site An Excellent Paper: A Rule-based Tool for](https://reader035.vdocuments.us/reader035/viewer/2022081603/56649efc5503460f94c0ecad/html5/thumbnails/19.jpg)
Color Interaction
Bergman, Rogowitz, Treinish, IEEE Vis ‘95
![Page 20: Colormaps 101 Sources – Russell Taylor Comp 290 course notes Colin Ware – Perception for Design IBM Web Site An Excellent Paper: A Rule-based Tool for](https://reader035.vdocuments.us/reader035/viewer/2022081603/56649efc5503460f94c0ecad/html5/thumbnails/20.jpg)
Color Interaction
Bergman, Rogowitz, Treinish, IEEE Vis ‘95
![Page 21: Colormaps 101 Sources – Russell Taylor Comp 290 course notes Colin Ware – Perception for Design IBM Web Site An Excellent Paper: A Rule-based Tool for](https://reader035.vdocuments.us/reader035/viewer/2022081603/56649efc5503460f94c0ecad/html5/thumbnails/21.jpg)
Trumbo’s Principles
• Univariate– Order: ordered values should be represented by
perceptually-ordered colors
– Separation: significantly different levels should be represented by distinguishable colors
Modified from Russell Taylor II, UNC CS 290 Course Notes
![Page 22: Colormaps 101 Sources – Russell Taylor Comp 290 course notes Colin Ware – Perception for Design IBM Web Site An Excellent Paper: A Rule-based Tool for](https://reader035.vdocuments.us/reader035/viewer/2022081603/56649efc5503460f94c0ecad/html5/thumbnails/22.jpg)
Ordered (and double-ended)
• Tufte ‘97, pg. 76.Taken from Russell Taylor II, UNC CS 290 Course Notes
![Page 23: Colormaps 101 Sources – Russell Taylor Comp 290 course notes Colin Ware – Perception for Design IBM Web Site An Excellent Paper: A Rule-based Tool for](https://reader035.vdocuments.us/reader035/viewer/2022081603/56649efc5503460f94c0ecad/html5/thumbnails/23.jpg)
Not ordered
• Tufte ‘97, pg. 77.Taken from Russell Taylor II, UNC CS 290 Course Notes
![Page 24: Colormaps 101 Sources – Russell Taylor Comp 290 course notes Colin Ware – Perception for Design IBM Web Site An Excellent Paper: A Rule-based Tool for](https://reader035.vdocuments.us/reader035/viewer/2022081603/56649efc5503460f94c0ecad/html5/thumbnails/24.jpg)
Double-ended Scale
• Two distinct scales joined at neutral middle
• Characteristics– segments values into two groups– can emphasize both extremes of data range
Taken from Russell Taylor II, UNC CS 290 Course Notes
![Page 25: Colormaps 101 Sources – Russell Taylor Comp 290 course notes Colin Ware – Perception for Design IBM Web Site An Excellent Paper: A Rule-based Tool for](https://reader035.vdocuments.us/reader035/viewer/2022081603/56649efc5503460f94c0ecad/html5/thumbnails/25.jpg)
Double-Ended Income
• Olson ‘97, fig. 11-8.
Taken from Russell Taylor II, UNC CS 290 Course Notes
![Page 26: Colormaps 101 Sources – Russell Taylor Comp 290 course notes Colin Ware – Perception for Design IBM Web Site An Excellent Paper: A Rule-based Tool for](https://reader035.vdocuments.us/reader035/viewer/2022081603/56649efc5503460f94c0ecad/html5/thumbnails/26.jpg)
In Summary• Interesting values?
– Position striking colors at interesting values
• Zero in range?– Double-ended scale
• High spatial frequency?– Vary lightness in addition to hue
Taken from Russell Taylor II, UNC CS 290 Course Notes
![Page 27: Colormaps 101 Sources – Russell Taylor Comp 290 course notes Colin Ware – Perception for Design IBM Web Site An Excellent Paper: A Rule-based Tool for](https://reader035.vdocuments.us/reader035/viewer/2022081603/56649efc5503460f94c0ecad/html5/thumbnails/27.jpg)
Color Theory in Cartography is well developed.
Cynthia Brewer at Penn State has a great color creator for discrete, monotonic color sequences.
http://www.personal.psu.edu/faculty/c/a/cab38/ColorBrewerBeta.html