Transcript Document

SIMS 213:
User Interface Design & Development
Marti Hearst
Tues, Jan 27, 2004
Metaphor in User Interfaces
Metaphor and Analogy
Metaphor
– L. metaphora, fr. to carry over, transfer; meta: beyond, over
– The transference of the relation between one set of objects to
another set for the purpose of brief explanation (Webster’s
revised)
Analogy
– A resemblance of relations; an agreement or likeness between
things in some circumstances or effects, when the things are
otherwise entirely different. (Webster’s revised)
– 1. Similarity in some respect between things that are otherwise dissimilar: "the
operation of a computer presents an interesting analogy to the working of the
brain“ (WordNet)
– 2: (logic) inference that if things agree in some respects they probably agree in
others (WordNet)
Metaphor
Lakoff & Johnson
– “...the way we think, what we experience, and what we do
every day is very much a matter of metaphor.''
– in our language & thinking - “argument is war”
• …he attacked every weak point
... criticisms right on target
... if you use that strategy
We can use metaphor to highlight certain features &
suppress others
– There is some systematicity to the transference
Slide adapted from James Landay
What are some example interface metaphors?
Direct Manipulation uses a Metaphor
Metaphor
– Computer objects as visible, moveable objects
Consequences
–
–
–
–
Items represented as icons
Items can be “picked up” and “moved” on a surface
Items can be “thrown out”
Items can be “copied”
• Do we really want to have to drag them to a photocopier?
How much is too much?
The Desktop Metaphor
Started at Xerox PARC
– Xerox Star (see video)
– Bitmapped screens made it possible
Not meant to be a real desktop
– Idea is to organize information in a way to allow people to use it
in the way they user information on their desktops
– Allow windows to overlap – make the screen act as if there
were objects on it
Apple took it farther
– Waste basket, etc
Microsoft took it to extremes
– Microsoft Bob – a recognized failure
Macintosh Desktop
Caldera’s Desktop
Microsoft Bob’s Desktop Metaphor
Microsoft Bob’s Livingroom –
Almost not a metaphor anymore!
Beyond the Desktop
Robertson, George et al. "The Task Gallery: A 3D Window Manager." In
Proceedings of CHI 2000
Beyond the Desktop
Jun Rekimoto, Multiple-Computer User Interfaces: "Beyond the Desktop" Direct
Manipulation Environments, ACM CHI2000 Video Proceedings, 2000.
Identify the mis-matched metaphors
(from the Interface Hall of Shame)
The classic (from the mac desktop)
– To eject a disk you drag it to the trashcan
Identify the mis-matched metaphors
(from the Interface Hall of Shame)
VCR buttons to control a printer??
Identify the mis-matched metaphors
(from the Interface Hall of Shame)
Using tabs to make arbitrary groups
Discussion
Kent Sullivan, The Windows 95 User Interface: A
Case Study in Usability Engineering, CHI 1996.
A case study of the iterative design process.
Sullivan Case Study
– 12 people on the Windows 95 team!!
– Waterfall design method (compartmentalized; UI done at the
end during quality assurance stage) would produce an
unusable product.
– Method:
•
•
•
•
Find most common tasks, and test on those
Compare to a baseline (Windows 3.1)
Rapid prototyping tools
Importance of usability testing!!
– Stepping back
• Found big problems
• Held a retreat to radically re-think things
Sullivan Case Study
– Decided to:
•
•
•
•
Focus on scaffolding (beginner -> intermediate-expert)
Give up on too much backwards-compatibility with 3.1
Dump the huge design spec (!) Encouraged social interaction.
Continually informed outsiders as well as team members about the
design
– Fine tuning with usablity tests
• Holistic interface test in the lab
– Many participants!
• Longitudinal field study
– About Windows 3.1
• … a good demonstration of what happens when usability is not taken
into account