Psychological Basis for UI Design Rules

transcript

Psychological Basis forUI Design Rules

Thursday, January 5, 12

We Perceive What We Expect

NextBack

BackNext

• Our perception & attention focuses almost totally on our goal

• Tend not to notice things unrelated to goal

• Can you spot a snake?

• Can you spot a tank?

• how do I get to Dept. of Industrial Design?

• Website

Our Vision is Optimized to See Structure

• Proximity

• Similarity

• Continuity

• Closure

• Symmetry

• Figure/ground

• Commond fate

Gestalt Principles of Visual Perception

Gestalt Principle: Closure

• We tend to see whole, closed objects, not collection of fragments

• Overlapping circles & triangles, not odd fragments

Gestalt Principle: Symmetry

• We tend to see simple figures rather than complex ones

• E.g., two overlapping diamonds; not other, more complex combination

Gestalt Principle: Symmetry

We Seek & Use Visual Structure

• You are booked on United flight 237, which departs from Auckland at 10:30 and arrives at San Francisco at 11:40 Tuesday Jan 11

Structured info is easier to perceive

Unstructured

• Flight: United 237

Aukland San Francisco

Depart: 10:30 Tue Jan 11

Arrive: 11:40 Tue Jan 11

Structured

We Seek & Use Visual Structure

• Visual hierarchy gets people to goal faster

Our Color Vision is Limited

• Our vision is optimized to see contrast -- edges & changes, not absolute levels

• We have trouble discriminating:

• pale colors

• small color patches

• separated patches

• Some people have color-blindness

• ~8% of males

• ~0.5% of females

• E.g., colors that would be hard for red-green colorblind people to distinguish

Our Peripheral Vision is Poor

• Common methods of getting seen

• Put where users are looking

• Put near the error

• Use red for error

• Use error symbol

Our Peripheral Vision is Poor

• Heavy artillery: use sparingly

• Popup in error dialog box

• Audio: beep

• Flash or wiggle briefly

Psychological Basis for UI Design Rules

Documents