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

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

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

Page 1: Visual Perception Cecilia R. Aragon I247 UC Berkeley Spring 2010.

Visual Perception

Cecilia R. AragonI247

UC BerkeleySpring 2010

Page 2: Visual Perception Cecilia R. Aragon I247 UC Berkeley Spring 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

Page 3: Visual Perception Cecilia R. Aragon I247 UC Berkeley 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

Page 4: Visual Perception Cecilia R. Aragon I247 UC Berkeley Spring 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

Page 5: Visual Perception Cecilia R. Aragon I247 UC Berkeley 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

Page 6: Visual Perception Cecilia R. Aragon I247 UC Berkeley 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

Page 7: Visual Perception Cecilia R. Aragon I247 UC Berkeley 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

Page 8: Visual Perception Cecilia R. Aragon I247 UC Berkeley Spring 2010.

I 247 8

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

stand out

Spring 2010

Page 9: Visual Perception Cecilia R. Aragon I247 UC Berkeley 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

Page 10: Visual Perception Cecilia R. Aragon I247 UC Berkeley 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

Page 11: Visual Perception Cecilia R. Aragon I247 UC Berkeley Spring 2010.

I 247 11

Structure of the Retina

Spring 2010

Page 12: Visual Perception Cecilia R. Aragon I247 UC Berkeley 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]

Page 13: Visual Perception Cecilia R. Aragon I247 UC Berkeley Spring 2010.

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]

Page 14: Visual Perception Cecilia R. Aragon I247 UC Berkeley Spring 2010.

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

Page 15: Visual Perception Cecilia R. Aragon I247 UC Berkeley 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]

Page 16: Visual Perception Cecilia R. Aragon I247 UC Berkeley Spring 2010.

Preattentive Processing

Page 17: Visual Perception Cecilia R. Aragon I247 UC Berkeley Spring 2010.

I 247 17

How many 5’s?

385720939823728196837293827382912358383492730122894839909020102032893759273091428938309762965817431869241024

Spring 2010

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

Page 18: Visual Perception Cecilia R. Aragon I247 UC Berkeley Spring 2010.

I 247 18

How many 5’s?

385720939823728196837293827382912358383492730122894839909020102032893759273091428938309762965817431869241024

Spring 2010

Page 19: Visual Perception Cecilia R. Aragon I247 UC Berkeley 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

Page 20: Visual Perception Cecilia R. Aragon I247 UC Berkeley 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]

Page 21: Visual Perception Cecilia R. Aragon I247 UC Berkeley Spring 2010.

I 247 21

Form (curvature) is preattentive

• Curved form “pops out” of display

Spring 2010

[image from Healey 2005]

Page 22: Visual Perception Cecilia R. Aragon I247 UC Berkeley Spring 2010.

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]

Page 23: Visual Perception Cecilia R. Aragon I247 UC Berkeley Spring 2010.

I 247 23

Healeyon preattentive processing

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

Spring 2010

Page 24: Visual Perception Cecilia R. Aragon I247 UC Berkeley Spring 2010.

I 247 24

Preattentive Visual Features

Spring 2010

line orientationlengthwidthsizecurvaturenumberterminatorsintersection

closurecolor (hue)intensityflickerdirection of motionstereoscopic depth3D depth cues

Page 25: Visual Perception Cecilia R. Aragon I247 UC Berkeley Spring 2010.

I 247 25

Cockpit dials

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

Spring 2010

Page 26: Visual Perception Cecilia R. Aragon I247 UC Berkeley Spring 2010.

I 247 26

Detection

Spring 2010

Page 27: Visual Perception Cecilia R. Aragon I247 UC Berkeley Spring 2010.

I 247 27

Just-Noticeable Difference

• Which is brighter?

Spring 2010

Page 28: Visual Perception Cecilia R. Aragon I247 UC Berkeley Spring 2010.

I 247 28

Just-Noticeable Difference

• Which is brighter?

Spring 2010

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

Page 29: Visual Perception Cecilia R. Aragon I247 UC Berkeley Spring 2010.

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

Page 30: Visual Perception Cecilia R. Aragon I247 UC Berkeley 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

Page 31: Visual Perception Cecilia R. Aragon I247 UC Berkeley 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

Page 32: Visual Perception Cecilia R. Aragon I247 UC Berkeley Spring 2010.

I 247 32

Estimating Magnitude

Spring 2010

Page 33: Visual Perception Cecilia R. Aragon I247 UC Berkeley Spring 2010.

I 247 33

Stevens’ Power Law

• Compare area of circles:

Spring 2010

Page 34: Visual Perception Cecilia R. Aragon I247 UC Berkeley 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]

Page 35: Visual Perception Cecilia R. Aragon I247 UC Berkeley Spring 2010.

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]

Page 36: Visual Perception Cecilia R. Aragon I247 UC Berkeley Spring 2010.

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

Page 37: Visual Perception Cecilia R. Aragon I247 UC Berkeley 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]

Page 38: Visual Perception Cecilia R. Aragon I247 UC Berkeley Spring 2010.

I 247 38

Relative Magnitude Estimation

Most accurate

Least accurate

Position (common) scalePosition (non-aligned) scale

LengthSlopeAngle

AreaVolumeColor (hue/saturation/value)

Spring 2010

Page 39: Visual Perception Cecilia R. Aragon I247 UC Berkeley Spring 2010.

I 247 39

Change Blindness

Spring 2010

Page 40: Visual Perception Cecilia R. Aragon I247 UC Berkeley 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

Page 41: Visual Perception Cecilia R. Aragon I247 UC Berkeley 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. ]

Page 42: Visual Perception Cecilia R. Aragon I247 UC Berkeley Spring 2010.

I 247 42

Multiple Visual Attributes

Spring 2010

Page 43: Visual Perception Cecilia R. Aragon I247 UC Berkeley 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/]

Page 44: Visual Perception Cecilia R. Aragon I247 UC Berkeley Spring 2010.

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

Page 45: Visual Perception Cecilia R. Aragon I247 UC Berkeley Spring 2010.

I 247 45

Integral vs. Separable DimensionsIntegral

Separable

Spring 2010

[Ware 2000]

Page 46: Visual Perception Cecilia R. Aragon I247 UC Berkeley Spring 2010.

I 247 46

Gestalt

Spring 2010

Page 47: Visual Perception Cecilia R. Aragon I247 UC Berkeley Spring 2010.

I 247 47

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

Page 48: Visual Perception Cecilia R. Aragon I247 UC Berkeley Spring 2010.

I 247 48

Examples

Figure/Ground

Spring 2010

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

ProximityConnectedness

[from Ware 2004]

Page 49: Visual Perception Cecilia R. Aragon I247 UC Berkeley Spring 2010.

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