Computers can do almost anything!

Sometimes expected, sometimes unexpected

What are metaphors good for

An expression that describes a person or object by referring to something that is considered to possess similar characteristics.

Cambridge Dictionary (online)

Xerox Star (1981)

Computer is like a desk with documents

Microsoft Bob (1995)

Beware of too literal interpretations

In physical world, you know you can do, but what about here?

Siri, Google, Echo

Personal assistant metaphor is back!

This time without childish graphics...

Metaphor in literature

[Metaphor is a] figure of speech in which a name or descriptive word or phrase is transferred to an object or action different from, but analogous to, that to which it is literally applicable.

Metaphor in literature

Romeo and Juliet

But, soft! what light through yonder window breaks? It is the east, and Juliet is the sun! Arise, fair sun, and kill the envious moon.

Metaphor in cognitive science

Metaphors are central to thought

• Explain new thing in terms of familiar
• Explain abstract concept in concrete terms
• Apparent from the language we use

Mathematics is constructed via metaphors

Innate arithmetic
Babies have basic mathematical capabilities
Addition and subtraction up to three

Grounding metaphors
Sets are like physical containers
Arithmetic is like motion along a path

Linking metaphors
Numbers are like sets, i.e. \(\emptyset, \{ \emptyset \}, \{ \emptyset, \{ \emptyset \} \}\)
Infinity as the end of an iterative process

Metaphors in user experience design

Transfer mental model from designer's to user's brain!

Metaphors in user experience design

Why and how of metaphors in UX design

Help build a metaphor that users will use anyway

Use familiar concepts to help learning

Give an abstract idea a concrete form

All metaphors are imperfect by design

First Draft of a Report on the EDVAC (1945)

Computer is like a living system, components are organs

Common computing metaphors

Twitter timeline

Showing tweets in chronological order

Facebook wall

The original profile space where you post things

Renamed from "wall" to "timeline" in 2011

Three types of metaphors plus a bonus

Orientational metaphors
How to use the screen space in user interface

Ontological metaphors
Explain computer ideas in concrete terms

Structural metaphors
Exploit structural similarity between concepts

Metonymy
Refer to something using an understood related thing

Orientational metaphors

Spatial and temporal orientation

Based on physical and cultural experience

Good is up, happiness is up, high status is up

Next is to the right, backwards is to the left

Locate abstract operations on 2D screen space

Magnitude controls

More is up
Less is down

Installers and wizards

Back is left
Next is right

Ontological metaphors

Understanding the nature of things

Explain ideas in more concrete terms

Inflation is an entity, we need to combat inflation

Container metaphor, such as set is a container

Referring to things and identifying their aspects

File is an object

It has properties
such as size

Enables commands such
as move the document
into a trash bin

Textbox is a container

"Type some text into the textbox"

Structural metaphors

Similarity between a computer and the real-world

Structural similarity between two things

Argument is war, i.e. "he attacked her position"

Never a perfect match - there are always misfits

May be more culturally dependent than others

Moving files to trash

Empty the trash to permanently delete

But you can always add more files to it.
Also does not smell!

Block languages

Program constructs
are pieces
of a puzzle

Can only fit in certain ways

Metonymy

Not a metaphor but related

• Explains concept in terms of another
• Use one entity to refer to another that is related
• Used in user interfaces in the form of icons
• Not used as heavily as it used to be...

Criticism of metaphors

Don Norman - The Invisible Computer (1998)

Metaphors are an attempt to use one thing to represent another, when the other is not the same. But if it is not the same, how can the metaphor help?

Alan Kay - User interface: A personal view (1990)

[Should designers] transfer the paper metaphor so perfectly that the screen is as hard as paper to erase (...)?

Criticism of metaphors

Why metaphors might not be good design device

Differences may outweigh the value of similarities

They are only useful when learning the system

Not everything can be seen via a metaphor

Empirical evidence against usefulness of metaphors

Designing with metaphors

Helpful when used carefully

• Often obvious in hindsight
• Shopping basket in e-shops
• Help designers think

Understand matches and mismatches

• Matches are where the similarity works
• Mismatch when computer cannot do something
• Mismatch when computer can do more

Designing with metaphors

Structured method for metaphorical design

1. Identify system functionality
2. Generate possible metaphors
3. Identify metaphor-interface matches
4. Identify interface-metaphor mismatches
5. Handle mismatches

Designing with metaphors

Handling mismatches in metaphors

Make actions without metaphorical equivalent visible

Expect users to try things that work in the world

Use composite (or backup) metaphor for misfits

Avoid being too literal to avoid misfits

Composite metaphor

Primary
Traffic lights
(red, orange green)

Secondary
Familiar signs
(cross, bar, stretch)

Metaphors: From literature to computing

Where metaphors come from

• Metaphor as a literary device
• Metaphor as fundamental cognitive science concept

Metaphors in computing

• Computing: Electronic brains, libraries, office
• User interface: Desktop, wall, timeline, basket

Metaphors: Designing with metaphors

Three kinds of user interface metaphors

• Organizational for mapping ideas to a space
• Ontological for explaining what abstract concepts are
• Structural for mapping between similar things

Understanding metaphorical fits and misfits

• Metaphors cannot, in principle, be perfect
• Exploit where it fits, careful about where it does not

CO582: Metaphors

What you should remember from this lecture

• What is a metaphor and user interface examples
• Orientational, ontological and structural
• Arguments for and against; fits and misfits

Tomas Petricek
t.petricek@kent.ac.uk | @tomaspetricek

Books, theses and resources

• Interaction Design: Beyond Human-Computer Interaction, H. Sharp, Y. Rogers, J. Preece
• Where Mathematics Comes From, G. Lakoff, R. Núñez
• Metaphors We Live By, G. Lakoff, M. Johnsen
• User-Interface Metaphors in Theory and Practice, Pippin Barr's MSc thesis