Visual Perception Cecilia R. Aragon I247 UC Berkeley Spring 2010.

Visual Perception

Cecilia R. AragonI247

UC BerkeleySpring 2010

I 247 2

Acknowledgments

• Thanks to slides and publications by Marti Hearst, Pat Hanrahan, Christopher Healey, Maneesh Agrawala, and Lawrence Anderson-Huang, Colin Ware, Daniel Carr.

Spring 2010

I 247 3

Visual perception

• Thinking with our Eyes• Structure of the Retina• Preattentive Processing • Detection • Estimating Magnitude• Change Blindness• Multiple Attributes• GestaltSpring 2010

I 247 4

Thinking with our Eyes

• 70% of body’s sense receptors reside in our eyes• Metaphors to describe understanding often refer to

vision (“I see,” “insight,” “illumination”)• “The eye and the visual cortex of the brain form a

massively parallel processor that provides the highest-bandwidth channel into human cognitive centers.” – Colin Ware, Information Visualization, 2004

• Important to understand how visual perception works in order to effectively design visualizations

Spring 2010

I 247 5

Thinking with our Eyes

• Working memory is extremely limited• How to overcome?• “The processing of grouping simple concepts

into more complex ones is called chunking.” – Ware, 2004

• “The process of becoming an expert is largely one of learning to create effective chunks.” – Ware, 2004

Spring 2010

I 247 6

The Power of Visualization

• “It is possible to have a far more complex concept structure represented externally in a visual display than can be held in visual and verbal working memories.” – Ware, 2004

Spring 2010

I 247 7

How the Eye Works

The eye is not a camera!Attention is selective (filtering)Cognitive processesPsychophysics: concerned with establishing

quantitative relations between physical stimulation and perceptual events.

Spring 2010

I 247 8

How to Use Perceptual Properties• Information visualization should cause what is meaningful to

stand out

Spring 2010

I 247 9

The Optimal Display

• Typical monitor: 35 pixels/cm• = 40 cycles per degree at normal viewing

distances• Human eye: receptors packed into fovea at

180 per degree of visual angle• So a 4000x4000-pixel resolution monitor

should be adequate for most visual perception tasks

Spring 2010

I 247 10

Optimal spatial resolution

• Humans can resolve a grating of 50 cycles per degree (~44 pixels per cm)

• Sampling theory (Nyquist) states: need to sample at twice the highest frequency needed to detect

• So… why is 150 pixels per degree not sufficient (cf. laser printers at 460 dots per cm)?

• 3 reasons: aliasing, gray levels, superacuities• (will be discussed in future lecture)Spring 2010

I 247 11

Structure of the Retina

Spring 2010

I 247 12

Structure of the Retina

• The retina is not a camera!• Network of photo-receptor

cells (rods and cones) andtheir connections

Spring 2010

[Anderson-Huang, L. http://www.physics.utoledo.edu/~lsa/

_color/18_retina.htm]

I 247 13

Photo-transduction

• When a photon enters a receptor cell (e.g. a rod or cone), it is absorbed by a molecule called 11-cis-retinal andconverted to trans form.

• The different shapecauses it to ultimatelyreduce the electricalconductivity of thephoto-receptor cell.

Spring 2010

[Anderson-Huang, L. http://www.physics.utoledo.edu/~lsa/_color/18_retina.htm]

I 247 14

Retina• Photoreceptors:

– 120 million rods, more sensitive than cones, not sensitive to color

– 6-7 million cones, color sensitivity, concentrated in macula (central 12 degrees of visual field)

– Fovea centralis - 2 degrees of visual field – twice the width of thumbnail at arm’s length)

– Fovea comprises lessthan 1% of retinal sizebut 50% of visual cortex

Spring 2010

I 247 15

Electric currents from photo-receptors

• Photo-receptors generate an electrical current in the dark.

• Light shuts off the current.• Each doubling of light causes

roughly the same reduction of current (3 picoAmps for cones, 6 for rods).

• Rods more sensitive, recover more slowly.

• Cones recover faster, overshoot.• Geometrical response in scaling

laws of perception.

Spring 2010

[Anderson-Huang, L. http://www.physics.utoledo.edu/~lsa/_color/18_retina.htm]

Preattentive Processing

I 247 17

How many 5’s?

385720939823728196837293827382912358383492730122894839909020102032893759273091428938309762965817431869241024

Spring 2010

[Slide adapted from Joanna McGrenere http://www.cs.ubc.ca/~joanna/ ]

I 247 18

How many 5’s?

385720939823728196837293827382912358383492730122894839909020102032893759273091428938309762965817431869241024

Spring 2010

I 247 19

Preattentive Processing

• Certain basic visual properties are detected immediately by low-level visual system

• “Pop-out” vs. serial search• Tasks that can be performed in less than 200

to 250 milliseconds on a complex display• Eye movements take at least 200 msec to

initiate

Spring 2010

I 247 20

Color (hue) is preattentive

• Detection of red circle in group of blue circles is preattentive

Spring 2010

[image from Healey 2005]

I 247 21

Form (curvature) is preattentive

• Curved form “pops out” of display

Spring 2010

[image from Healey 2005]

I 247 22

Conjunction of attributes

• Conjunction target generally cannot be detected preattentively (red circle in sea of red square and blue circle distractors)

Spring 2010

[image from Healey 2005]

I 247 23

Healeyon preattentive processing

http://www.csc.ncsu.edu/faculty/healey/PP/index.html

Spring 2010

I 247 24

Preattentive Visual Features

Spring 2010

line orientationlengthwidthsizecurvaturenumberterminatorsintersection

closurecolor (hue)intensityflickerdirection of motionstereoscopic depth3D depth cues

I 247 25

Cockpit dials

• Detection of a slanted line in a sea of vertical lines is preattentive

Spring 2010

I 247 26

Detection

Spring 2010

I 247 27

Just-Noticeable Difference

• Which is brighter?

Spring 2010

I 247 28

Just-Noticeable Difference

• Which is brighter?

Spring 2010

(130, 130, 130) (140, 140, 140)

I 247 29

Weber’s Law• In the 1830’s, Weber made measurements of the

just-noticeable differences (JNDs) in the perception of weight and other sensations.

• He found that for a range of stimuli, the ratio of the JND ΔS to the initial stimulus S was relatively constant:

ΔS / S = k

Spring 2010

I 247 30

Weber’s Law

• Ratios more important than magnitude in stimulus detection

• For example: we detect the presence of a change from 100 cm to 101 cm with the same probability as we detect the presence of a change from 1 to 1.01 cm, even though the discrepancy is 1 cm in the first case and only .01 cm in the second.

Spring 2010

I 247 31

Weber’s Law

• Most continuous variations in magnitude are perceived as discrete steps

• Examples: contour maps, font sizes

Spring 2010

I 247 32

Estimating Magnitude

Spring 2010

I 247 33

Stevens’ Power Law

• Compare area of circles:

Spring 2010

I 247 34

Stevens’ Power Law

s(x) = axb

s is the sensationx is the intensity of the

attributea is a multiplicative constantb is the power

b > 1: overestimateb < 1: underestimate

Spring 2010

[graph from Wilkinson 99]

I 247 35

Stevens’ Power LawSensation Exponent Brightness 0.33

Smell 0.55 (Coffee)

Loudness 0.6

Temperature 1.0 (Cold)

Taste 1.3 (Salt)

Heaviness 1.45

Electric Shock 3.5

Spring 2010

[Stevens 1961]

I 247 36

Stevens’ Power Law

Experimental results for b:

Length .9 to 1.1Area .6 to .9Volume .5 to .8

Heuristic: b ~ 1/sqrt(dimensionality)

Spring 2010

I 247 37

Stevens’ Power Law• Apparent magnitude scaling

Spring 2010

[Cartography: Thematic Map Design, p. 170, Dent, 96]

S = 0.98A0.87

[J. J. Flannery, The relative effectiveness of some graduated point symbols in the presentation of quantitative data, Canadian Geographer, 8(2), pp. 96-109, 1971] [slide from Pat Hanrahan]

I 247 38

Relative Magnitude Estimation

Most accurate

Least accurate

Position (common) scalePosition (non-aligned) scale

LengthSlopeAngle

AreaVolumeColor (hue/saturation/value)

Spring 2010

I 247 39

Change Blindness

Spring 2010

I 247 40

Change Blindness

• An interruption in what is being seen causes us to miss significant changes that occur in the scene during the interruption.

• Demo from Ron Rensink: http://www.psych.ubc.ca/~rensink/flicker/

Spring 2010

I 247 41

Possible Causes of Change Blindness

Spring 2010

[Simons, D. J. (2000), Current approaches to change blindness, Visual Cognition, 7, 1-16. ]

I 247 42

Multiple Visual Attributes

Spring 2010

I 247 43

The Game of Set• Color• Symbol• Number• Shading

A set is 3 cards such that each feature is EITHER the same on each card OR is different on each card.

Spring 2010

[Set applet by Adrien Treuille, http://www.cs.washington.edu/homes/treuille/resc/set/]

I 247 44

Multiple Visual Attributes• Integral vs. separable

· Integral dimensions

· two or more attributes of an object are perceived holistically (e.g.width and height of rectangle).

· Separable dimensions

· judged separately, or through analytic processing (e.g. diameter and color of ball).

• Separable dimensions are orthogonal.• For example, position is highly separable from

color. In contrast, red and green hue perceptions tend to interfere with each other.

Spring 2010

I 247 45

Integral vs. Separable DimensionsIntegral

Separable

Spring 2010

[Ware 2000]

I 247 46

Gestalt

Spring 2010

I 247 47

Gestalt Principles• figure/ground• proximity• similarity• symmetry• connectedness• continuity• closure• common fate• transparencySpring 2010

I 247 48

Examples

Figure/Ground

Spring 2010

[http://www.aber.ac.uk/media/Modules/MC10220/visper07.html]

ProximityConnectedness

[from Ware 2004]

I 247 49

Conclusion

· What is currently known about visual perception can aid the design process.

· Understanding low-level mechanisms of the visual processing system and using that knowledge can result in improved displays.

Spring 2010