Transcript Intro to Color for Information Display    Color Theory Color Geometries Color applications Electronic Chart Example.

Intro to Color for Information
Display



Color Theory
Color Geometries
Color applications
Electronic Chart Example
Spectrum approximation,
visual segmentation
Double-Ended
Income

Olson ‘97, fig. 11-8.
Hue Saturation Bivariate.
Tufte ‘83, pg. 153.
Bivariate map
Color weaving (Hagh-Shenas et al, 2007)
Low errors but big patches (only 13)
These kinds of color sequences are known
to give very large errors
Attribute Blocks (Miller, 2007)
Ware:Vislab:CCOM
Temperature and Pressure
Physiology: Receptors

Rods




active at low light levels (night vision)
only one wavelength sensitivity function
100 million rod receptors
Cones




active at normal light levels
three types: sensitivity functions peaks at different
wavelengths (“red”, “green”, “blue”)
6 million cone receptors
Focused in the center of vision (fovea)
The basis of color vision
and measurement
Cone Sensitivity Functions
Color Measurement
A three primary
system
a
b
G+B
+R
Consider three lamps
Color measurement




Based on the
“standard observer”
CIE tristimulus values
XYZ
Y is luminance.
Assumes all humans
are the same
x = X/(X+Y+Z), y = Y/(X+Y+Z)
CIEluv
CIE
CIE Luv uniform color space
Colors
Are only
A very rough
Approximation.
The light-dark dimension






Luminance (physical)
Brightness (perceived amount of light)
Lightness (perceive reflectance)
Value – used in Computer graphics HSV
Hue (color)
Saturation (strength or vividness)
Luminance

Is a physical measurement of the amount of light
in the environment weighted by the sensitivity to
flickering light.
700

L=
VlEldl
400

Brightness: amount of perceived light



Brightness (in the dark) =L 1/3
Gamma and Gamma Correction
Lightness: perceived surface reflectance
Luminance is not Brightness





Eye sensitive over 9 orders or magnitude
5 orders of magnitude (room – sunlight)
Receptors bleach and become less
sensitive with more light
Takes up to half an hour to recover
sensitivity
We are not light meters
Short wavelength sensitive cones
Blue text on a dark background
is to be avoided. We have very few
short-wavelength sensitive cones in
the retina and they are not very sensitive
Blue text on dark background
is to be avoided. We have very few
short-wavelength sensitive cones in
the retina and they are not very sensitive
Blue text on a dark background
is to be avoided. We have very few
short-wavelength sensitive cones in
the retina and they are not very sensitive.
Chromatic aberration in the eye is also a
problem
Blue text on a dark background
is to be avoided. We have very few
short-wavelength sensitive cones in
the retina and they are not very sensitive
Opponent Process Theory

Cone signals transformed into new
channels
Color Channel Theory

Luminance contrast
needed to see detail
3:1 recommended
10:1 ideal for small text
Comparing the Channels

Spatial Sensitivity


Stereoscopic Depth



Suppose that these colors arise
from the accidental vapours
diffused in the air, which
communicates their own hues
to the shadow
Some natural philosophers
Suppose that these colors arise
from the accidental vapours
diffused in the air, which
communicates their own hues
to the shadow
Moving hue-change patterns seem to move slowly
Form


Pretty much can’t do it with hue alone
Temporal Sensitivity


Red/Green and Yellow/Blue each about 1/3 detail
of Black/White
Some natural philosophers
Shape-from shading works well
Shape-from-hue doesn’t
Some natural philosophers
Suppose that these colors arise
from the accidental vapours
diffused in the air, which
communicates their own hues
to the shadow
Information Labeling: Hue works well!
Luminance contrast
Lightness constancy






Visual system extracts surface information
Discounts illumination level
Discounts color of illumination
Mechanisms
1) Adaptation
2) Simultaneous contrast
Contrast for constancy
Contrast for constancy
Brightness Lightness and
Luminance





Luminance – a physical
measurement

Brightness refers to
perception of lights
Brightness non linear
g
Monitor Gamma: L = V
Gamma = approx 2.0
Lightness refers to
perception of
surfaces
Perceived lightness
depends on a
reference white
Luminance for Shape-fromshading
Playing with the background
Miscellaneous of contrast effects
Sharpening
Non-linear grey scales
Luminance contrast required for detail
Chromatic Color is Irrelevant…




To perceiving object shapes
To perceiving layout of objects in space
To perceiving how objects are moving
Therefore, to much of modern life

Laboratory assistant went 21 years without
realizing he was color-blind
Color is Critical…




To help us break camouflage
To judge the condition of objects (food)
To determine material types
Extremely useful for coding information
Other contrast effects
Chromatic contrast
Small field tritanopia
Color “blindness”





A 3D to a 2D space
8 % of males
R-G color blindness
Can generate color
blind acceptable
palette
Yellow blue variation
OK
Implications



Color perception is relative
We are sensitive to small differenceshence need sixteen million colors
Not sensitive to absolute values- hence
we can only use < 10 colors for coding
Channel Properties
Luminance Channel
 Detail
 Form
 Shading
 Motion
 Stereo
Chromatic Channels
 Surfaces of things
 Labels
 Berlin and Kay
 Categories (about 610)
 Red, green, yellow
and blue are special
(unique hues)
Applications




Color interfaces
Color coding
Color sequences
Color for multi-dimensional discrete data
Color Planes
Hue
Saturation
Data: code objects
code maps
Measurement Scales (Stevens)




Nominal (labeling)
Ordinal (orderable)
Interval (meaningful step sizes)
Ratio (Zero, ratios)
Color great for classification



Rapid visual
segmentation
Color helps us
determine type
Only about six
categories
green
white
black
yellow
red
blue
yellow
green
brown
pink
purple
orange
grey
Color Categories




Task: Name the colors
Regions same > 75%
Nonuniform sizes
Only 8 hues named
 small number of labels
Canonical colors
Color Coding
Large areas: low saturation
Small areas high saturation
Break isoluminance with borders
Must have luminance contrast with background to see details
Which colors
-Distinct and
-memorable
Cultural semantics
The fact that certain colors are
special is because they are
hard wired
The meaning of those colors is
culturally determined
Just enough color difference
Electronic Chart Example
Color Coding
The same rules apply to color
coding text and other similar
information. Small areas should
have high saturation colors.
Large areas should
be coded with low
saturation colors
Luminance contrast should be maintained
Color examples
Ordinal Data
Pseudo-color sequences

Examples





Grey scale
Saturation scale
Spectrum (hue, rainbow) scale (not good)
Issues: How can we see forms (quality)
How we read value (quantity)
Luminance Vs Spectrum
Spectrum not a Perceptual
Sequence. Visually
Segments
Luminance good for form
High contrast errors
Pseudo-color sequences
Spectrum sequence
Luminance (Gray) Scale
Saturation and Luminance
Scale
Spectrum approximation,
visual segmentation
Hue+Lightness - Highlighting
Ordinal data
Principles





Order: ordered values should be represented by
perceptually-ordered colors
Separation: significantly different levels should be
represented by distinguishable colors
Can use uniform color spaces
Luminance: good for showing form
Many hues: useful for showing readable values
Redundant Color
Scales


Two or more color components varied
together
Examples


Hue with lightness
Characteristics


Reinforces signal
Combines characteristics of simpler scales
Hue+Lightness Spiral
Spiral Sequence
Interval sequences: Contour
Lines and Color

Both indicate regions



Choice of spacing




Contour by showing the boundaries
Bands by showing the interiors
Regular intervals to enable interval comparison
Specific values to highlight regions (sea level)
Choice of spacing
Can attempt to use UCS
Interval – contours and color
Interval – step color Note
spectrum sequence
Not always bad
Uncertainty
Ratio sequence to represent
zero
Double-ended Scale

Represent neutral by neutral on opponentcolor channels
Ordered (and double-ended)

Tufte ‘97, pg. 76.
Double-Ended
Income

Olson ‘97, fig. 11-8.
Neutral = 0
Bivariate Maps

Rows and columns: to preserve univariate
information, display parameters should
should be perceptually orthogonal (ideally)
Hue Saturation Bivariate.
Tufte ‘83, pg. 153.
Bivariate map
Bivariate Map
Value 1  Luminance – shading
Value 2  Surface hue
Multi - Dimensional Scatterplot







V1 - xposition
V2 - yposition
V3 - red
V4 - green
V5 - blue
Can identify clusters and trends
Cannot read values back from visualization
Show grouping

Ware and Beatty ‘85, p. 22
Scatterplot
Scatterplot Results


For cluster
discrimination Color
adds as much as
space
Except for certain
special conditions
where one cluster lies
above another.
3
Take home messages





Use luminance for detail, shape and form
Use color for coding - few colors
Minimize contrast effects
Strong colors for small areas - contrast in
luminance with background
Subtle colors can be used to segment
large areas
More messages




Color excellent for multi-dimensional data
Use additional tools to get quantities
Beware of artifacts due to color resampling
We need precise color for specification
and standardization
Bivariate Map
Hue Saturation Bivariate.
Tufte ‘83, pg. 153.
Bivariate map
Consider Data




Nominal, ordinal interval or ratio
Map or point data coding
Amount of detail
High spatial frequency?

Vary lightness in addition to hue
Consider Audience

Color deficient viewers?



Application area conventions?




Don’t depend on red-green differentiation
Use redundant scales
Use familiar scales (or at least know when you’re not)
Use red for bad range (in U.S.)
Use red for hot
Distinguishable symbols


For rapid search – luminance contrast
Area rules
Color weaving (Hagh-Shenas et al, 2007)
Low errors but big patches (only 13)
These kinds of color sequences are known
to give very large errors
Attribute Blocks (Miller, 2007)
Ware:Vislab:CCOM