1. Human Capabilities: Perception

2. Announcements
Upcoming due dates (web page).

3. Perception and the Senses
Senses: smell, taste, sight, hearing, touch, proprioception (body position awareness), pain, temperature, balance, ...
Change:
Habituation: Senses physically react to change.
Absence of change leads us to physically lose sensitivity.
Eye compensates some by shifting around, but nose can't (so we become sensitized to a smell).
But: there is a “just noticeable difference” (jnd)
eg: Doubling # photons does not double perceived intensity of a picture.

4. T&T #23 (Habituating): Wandering Element
Where’s that control now?
And speaking of Habituation, it can be POSITIVE too – unless you get in the way of it, like Wandering Element.
Imagine returning to the garage and your car had moved?
Same control, different location.
UI Tenets & Traps© | All Rights Reserved

5. T&T #23: Wandering Element
Where’s that control now?
Same control, different location.
UI Tenets & Traps© | All Rights Reserved

6. T&T #24 (Habituating): Inconsistent appearance
Are these the same thing?
Habituating
Same control, different appearance.
UI Tenets & Traps© | All Rights Reserved

7. Are these the same thing? Should they look the same?
Which trap?
Same cue, different appearance.
UI Tenets & Traps© | All Rights Reserved

8. Perception How information is acquired from the world by senses
they are the input devices to the brain’s “ALU”
so, if doesn’t make it thru senses => not delivered to brain.
UI: design UI features that are readily perceivable
Q: How can we tell when they are and when they aren’t?
A: see next slides.

9. Perception is Demand-driven and Expectation-driven
Pulls in only what it needs (lazy, not eager).
No change dulls perception:
UI: Repeated “Are you sure?” messages.
UI: The rightmost button is always “OK”?
Frames (patterns): Sense what you normally sense.
This is a a room in a house, so…
Priming: Sense what you expect to sense.
Look at this bathroom.
Biased by context.
Makes ventriloquism work (video: 0:52-2:01) Paul Zerdin
Habituation can be leveraged for efficiency/understandabitility in a UI too.
Great place for T&T #23 & #24: these are Habitation T&Ts, which show us how Habituation should be Leveraged.

10. Visual perception (low level)
Eye: Pupil/lens, place image on retina. From there, to brain.
Retina has photoreceptor cells: rods and cones.
Rods: tell us dark vs. light. Can detect in very dim light. Lots of rods (120M).
Cones can detect color. But need much light to do this. Only a few cones (6-7M).
64% of cones see red, 32% see green, only 2% see blue.

11. Our visual system reduces complexity
We see structure(s) (Gestalt principle).
Figure/ground.
Symmetry.
We see groups.
Proximity, similarity, continuity.
Common fate.
Figure/ground: rectangles are figure, enclosing rectangle and its content is background.
Symmetry: as per the caption.
Proximitry, similarity: Notice how they make us group things.
Continuity: notice that we still see the diamonds.
Common fate: demo on the desktop by moving a window.

12. Exercise: Gestalt Principles
Which one(s) do you see in here?
(Push “File” to pop it up)
(Click “File” again to make it go away)
Figure/ground? Symmetry? Proximitry? Similarity? Continuity?
Common fate: it appears together and disappears together.

13. T&T #6: Poor Grouping Quick, mute the call!
UI Tenets & Traps© | All Rights Reserved

14. T&T #6: Poor Grouping Going down?
UI Tenets & Traps© | All Rights Reserved

15. Colors Color-blindness Excessive/gratuitous colorings
Red/green color blindness most common: 7-8% of males red from green, 0.4% of women.
Excessive/gratuitous colorings
distracting
unprofessional
impart meaning where none/different intended
Interface Hall of shame: Compuserve's WinCim 2.0 application

16. Basic Principles Hue (“color”) vs. light
eg, Red
vs. light
“how much light it reflects” (regardless of hue)
eg: closeness to black
vs saturation (“how much paint you added”).
Light
Not much light

17. Contrast – Howto’s
Choose 1 hue, from light recommended hues, lighten, desaturate
Choose 2nd hue from dark recommendations, darken, saturate.
And not adjacent colors.
Not as effective
Effective
Not as effective

18. Which is easiest to read and why?
What is the time?
What is the time?
What is the time?
What is the time?
What is the time?

19. Other senses Sound (hearing): Touch:
Pitch – frequency, loudness – amplitude, location
We are good at sound! We have a lot of bandwidth, in part because of language facilities.
UIs can use when appropriate
but can hog our attention.
Touch:
Pressure, pain, temperature (hot/cold).
Potential for use in advanced UIs.
Motor system (input & output system): Often causes errors: wrong button, double-click vs. single-click, ...

20. Perception take-aways 1
Some UI devices/paradigms leverage more senses than others.
eg: WIMP?
eg: (fairly basic) cell phone?
eg: iPhone?
eg: Wii?

21. Perception take-aways 2
These are pre-brain (or at least pre-“ALU”)!
If you want info to get to/from brain, has to make it thru senses first.
These are the human UI to the brain.
Must be:
discernable
distinguishable from similar
if combined with Change, will be more likely to be perceived, but can steal your attention
eg: banner ad examples