E concept metaphors-representations_signs_semiotics

39
Metaphors & Representation Interaction Design OBJECTS—SIGNS—SYMBOLIC COMMUNICATION

Transcript of E concept metaphors-representations_signs_semiotics

Page 1: E concept metaphors-representations_signs_semiotics

Metaphors & Representation

Interaction DesignO B J E C T S — S I G N S — S Y M B O L I C C O M M U N I C A T I O N

Page 2: E concept metaphors-representations_signs_semiotics

Introduction to the tools

1. The sign and the representation:Signs as representative via basic semiotics

2. The metaphor:The basic metaphor as representation

3. The interactive design:Metaphors in interactive design

M e t a p h o r s & R e p r e s e n t a t i o n

Page 3: E concept metaphors-representations_signs_semiotics

1

The sign and the representation:Signs as representative via basic semiotics

M e t a p h o r s & R e p r e s e n t a t i o n

Page 4: E concept metaphors-representations_signs_semiotics

The sign and the representation: Signs as representative via basic semiotics

Communication is often the work of signs which represent something

Flags represent something (but what?) … Representation anchored with a text

M e t a p h o r s & R e p r e s e n t a t i o n

Page 5: E concept metaphors-representations_signs_semiotics

Semiotics is the study and the making use of signs as communication

Signs are words, written and spoken.

Signs can be seen, smelled and tasted

Signs are visual artefacts and visual representations.

Signs are cultural codes.

Semiotics is the communication strategy by which you decidewhat effect you want to achieve by the use of a particular sign.

M e t a p h o r s & R e p r e s e n t a t i o n

The sign and the representation: Signs as representative via basic semiotics

Page 6: E concept metaphors-representations_signs_semiotics

C O N N O T A T I O N(signified/mental concept)

D E N O T A T I O N(Signifier)

(I will give you)breakfast

in bed

Automaticscripting

In a certain context you often intuitively expect somethingparticular based on the signs you encode.

This proces is called scripting. Here’s an example:

(You expect)a particularkind of breakfast(you like)

M e t a p h o r s & R e p r e s e n t a t i o n

The sign and the representation: Signs as representative via basic semiotics(S

ourc

e: L

akof

f& Jo

hnso

n 19

80 /

Sau

ssur

e 19

16)

Page 7: E concept metaphors-representations_signs_semiotics

SignComposed of

SignifierExistense

of the signActivates …

Signified

the mental concept, which relates to …

SignificationReference to “reality” as meaning

Now, let’s look at the conceptual scopeof denotation and connotation …

the referent

tree

(Sou

rce:

Fis

ke 1

990)

M e t a p h o r s & R e p r e s e n t a t i o n

The sign and the representation: Signs as representative via basic semiotics

Page 8: E concept metaphors-representations_signs_semiotics

Tegneter struktureret af

Signifiantbetegneren

af eksisterende tegn Aktiverer …

SignifiéDet betegnede

et mentalt koncept, der relaterer til …

SignificationRefererer til “det virkelige” som meningsfuldt

referenten

træ

(Sou

rce:

Fis

ke 1

990)

M e t a f o r & r e p r æ s e n t a t i o n

EN DANSK GUIDE TIL BEGREBERNE

Page 9: E concept metaphors-representations_signs_semiotics

The sign is arbitrary

D E N O T A T I O N(Literal concept)

Signifier

Word, soundor image

C O N N O T A T I O N(Mental concept)

Signified

Percieved

Conceptual,perceptual

and culturalcontexts

(Sou

rce:

Fis

ke 1

990)

M e t a p h o r s & R e p r e s e n t a t i o n

The sign and the representation: Signs as representative via basic semiotics

APPLE ?

Page 10: E concept metaphors-representations_signs_semiotics

A sign never has any “real” meaning, it’s what you percieve as meaningful.

The sign corresponds with your codes of reality and the sign refers to your world.

The sign is always arbitrary and it is encoded in a certain context.

Tank ?

The sign activates … the mental concept, which relates to … the referent?

M e t a p h o r s & R e p r e s e n t a t i o n

The sign and the representation: Signs as representative via basic semiotics

Page 11: E concept metaphors-representations_signs_semiotics

SignComposed of

SignifierExistense

of the sign

SignifiedMental concept

Signification

This is important in relation to the way youintend to make people react to the signsin your strategic communication …

“Reality” / Meaning

SignUse of sign

(encoding/strategy)

InterpretantPercieving the sign

(decoding/scripting)

Effect of the sign(response/action)

M e t a p h o r s & R e p r e s e n t a t i o n

The sign and the representation: Signs as representative via basic semiotics

Page 12: E concept metaphors-representations_signs_semiotics

Contradictingscripting

And sometimes the strategy is to deliberately surprise youand contradict your expectations.

To experience and learn new things via signs: a new scripting proces

“What! Monkey food!?”(or)“It looks good!”

(you get served)an alternative

kind of breakfast (you

might like)

R E A C T I O NN E W S C R I P T I N G

M e t a p h o r s & R e p r e s e n t a t i o n

The sign and the representation: Signs as representative via basic semiotics(S

ourc

e: L

akof

f& Jo

hnso

n 19

80)

Page 13: E concept metaphors-representations_signs_semiotics

M e t a p h o r s & R e p r e s e n t a t i o n

The sign and the representation: Signs as representative via basic semiotics(S

ourc

e: F

iske

199

0 / A

nne

Met

te B

usch

201

1)

Semiotic Categories of the Sign

S E M I O T I C S I G N S

I C O N

I N D E X

S Y M B O L

The iconic sign bears a resemblance to its object.

The indexical sign has a direct connection to its object.

The symbolic sign has a rule- or convention connection to its object.

These categories often mix!

Page 14: E concept metaphors-representations_signs_semiotics

M e t a p h o r s & R e p r e s e n t a t i o n

The sign and the representation: Signs as representative via basic semiotics(S

ourc

e: F

iske

199

0 / A

nne

Met

te B

usch

201

1)

S E M I O T I C S I G N S

I C O N The iconic sign bears a resemblance to its object.

Examples:

Pictograms

Outlines and shapes

Specific denotations

Page 15: E concept metaphors-representations_signs_semiotics

M e t a p h o r s & R e p r e s e n t a t i o n

The sign and the representation: Signs as representative via basic semiotics(S

ourc

e: F

iske

199

0 / A

nne

Met

te B

usch

201

1)

S E M I O T I C S I G N S

I N D E X The indexical sign has a direct connection to its object.

Examples:

Smoke (of a fire)

Postures (of emotions)

Relational denotations

Page 16: E concept metaphors-representations_signs_semiotics

M e t a p h o r s & R e p r e s e n t a t i o n

The sign and the representation: Signs as representative via basic semiotics(S

ourc

e: F

iske

199

0 / A

nne

Met

te B

usch

201

1)

S E M I O T I C S I G N S

S Y M B O L The symbolic sign has a rule- or convention connection to its object.

Examples:

Logos and visual signs

Words (“war” means chaos)

Objects in a certain context

Denotations and connotationsvia rules or conventions meansthat we have learned how to decode the symbol.

Page 17: E concept metaphors-representations_signs_semiotics

M e t a p h o r s & R e p r e s e n t a t i o n

The sign and the representation: Signs as representative via basic semiotics(S

ourc

e: F

iske

199

0 / A

nne

Met

te B

usch

201

1)

S E M I O T I C S I G N S

I C O N

I N D E X

S Y M B O L

Exercise

Page 18: E concept metaphors-representations_signs_semiotics

S I G N S & B R A N D I N G

T O P - D O W N

Example

T O P : The sign as a promise

D O W N : Benefactor/product

Kres

s& L

eeuw

en19

96 v

ia B

arna

rd20

05)

M e t a p h o r s & R e p r e s e n t a t i o n

Page 19: E concept metaphors-representations_signs_semiotics

S I G N S & B R A N D I N G

L E F T - R I G H T

Example

L E F T : A symbol/sign

Kres

s& L

eeuw

en19

96 v

ia B

arna

rd20

05)

R I G H T : the anchorage(picture + text)ProductBenefactor

M e t a p h o r s & R e p r e s e n t a t i o n

Page 20: E concept metaphors-representations_signs_semiotics

M e t a p h o r s & R e p r e s e n t a t i o n

2

The metaphor:The basic metaphor as representation

Page 21: E concept metaphors-representations_signs_semiotics

Metaphoricalscripting

The metaphor means …an analogy and a connection between two different objects or ideas.

It depends on the scripting and the signs in the particular context.

An action can mean something.

“This must mean that youreally like me!”Or“ what have Idone to you?!”

The alternativekind of

breakfast(You happen

to like now)

R E A C T I O N

A C T I O N(Signifier)

P E R C I E V E D(Signified)

M e t a p h o r s & R e p r e s e n t a t i o n

The metaphor: The basic metaphor as representation

Page 22: E concept metaphors-representations_signs_semiotics

The metaphor means …an analogy and a connection between two different objects or ideas.

We can understand one aspect by the aid of another.

For example:“the city is acting like it’s on fire”can mean that “the city is celebrating” or “the city is in panic .”

Other examples:

The general concept of “discussion” can mean conflict.It opens for a wide range of metaphors:

“I will win this argument” or “You disagree? Ok, fire away!”

Or the concept of “good is up” and “bad is down”:

“I’m on top of the world today” vs. “I’m feeling down!”

M e t a p h o r s & R e p r e s e n t a t i o n

The metaphor: The basic metaphor as representation(S

ourc

e: L

akof

f& Jo

hnso

n 19

80)

Page 23: E concept metaphors-representations_signs_semiotics

M e t a p h o r s & R e p r e s e n t a t i o n

3

The interactive design:Metaphors in interactive design

Page 24: E concept metaphors-representations_signs_semiotics

“There are three dominant paradigms in the conceptual and visual design of user interfaces:implementation-centric, metaphoric, and idiomatic.

The implementation centric interfaces are based on understanding how things actually work under the hood—a difficult proposition.

Metaphoric interfaces are based on intuiting how things work—a risky method.

Idiomatic interfaces, however, are based on learninghow to accomplish things—a natural, human process.”

M e t a p h o r s & R e p r e s e n t a t i o n

The interactive design: Metaphors in interactive design(S

ourc

e: C

oope

r 200

7: 2

70)

Page 25: E concept metaphors-representations_signs_semiotics

“There are three dominant paradigms in the conceptual and visual design of user interfaces:implementation-centric, metaphoric, and idiomatic.

The implementation centric interfaces are based on understanding how things actually work under the hood—a difficult proposition.”

M e t a p h o r s & R e p r e s e n t a t i o n

The interactive design: Metaphors in interactive design(S

ourc

e: C

oope

r 200

7: 2

70)

Page 26: E concept metaphors-representations_signs_semiotics

“There are three dominant paradigms in the conceptual and visual design of user interfaces:implementation-centric, metaphoric, and idiomatic.

Metaphoric interfaces are based on intuiting how things work—a risky method. “

Yes, but not impossible:

“ When we talk about metaphors in the context of user interface and interaction design, we really mean visual metaphors: a picture used to represent the purpose or attributes of a thing. Users recognize the imagery of the metaphor and, by extension,can presumably understand the purpose of the thing.”

Remember an affordance strategy in visual metaphors.

M e t a p h o r s & R e p r e s e n t a t i o n

The interactive design: Metaphors in interactive design(S

ourc

e: C

oope

r 200

7: 2

70 ff

)

Page 27: E concept metaphors-representations_signs_semiotics

Visual metaphors

M e t a p h o r s & R e p r e s e n t a t i o n

The interactive design: Metaphors in interactive design

Nature Layout elements on a website

Cooper is not fond of the metaphor:

“Artifacts like resizable windows and endlessly nested file folders are not really metaphoric — they have no parallel in the real world. They derive their strength only from their easy idiomatic learnability.” (Cooper 2007: 275)(S

ourc

e: C

oope

r 200

7: 2

70 ff

)

Page 28: E concept metaphors-representations_signs_semiotics

Cooper argues for the idiomatic approach to UX/graphic interface design:

“We understand the idiom simply because we have learned it and because it is distinctive, not because we understand it or because it makes subliminal connections in our minds.” (Cooper 2007: 274)

Well … that is exactly what a good metaphor is (according to Lakoff & Johnson), but for the sake of the argument, you can choose yourself whether you want to operate with the concept of an idiom or a metaphor.

M e t a p h o r s & R e p r e s e n t a t i o n

The interactive design: Metaphors in interactive design(S

ourc

e: C

oope

r 200

7: 2

70 ff

)

Page 29: E concept metaphors-representations_signs_semiotics

DOS (1981)

M e t a p h o r s & R e p r e s e n t a t i o n

The interactive design: Metaphors in interactive design

Page 30: E concept metaphors-representations_signs_semiotics

Amiga 1000 (1985)

M e t a p h o r s & R e p r e s e n t a t i o n

The interactive design: Metaphors in interactive design

Page 31: E concept metaphors-representations_signs_semiotics

Apple Macintosh (1985)

M e t a p h o r s & R e p r e s e n t a t i o n

The interactive design: Metaphors in interactive design

Page 32: E concept metaphors-representations_signs_semiotics

Sun Workstation(1989)

M e t a p h o r s & R e p r e s e n t a t i o n

The interactive design: Metaphors in interactive design

Page 33: E concept metaphors-representations_signs_semiotics

Windows (1992)

M e t a p h o r s & R e p r e s e n t a t i o n

The interactive design: Metaphors in interactive design

Page 34: E concept metaphors-representations_signs_semiotics

Windows (1995)

M e t a p h o r s & R e p r e s e n t a t i o n

The interactive design: Metaphors in interactive design

Page 35: E concept metaphors-representations_signs_semiotics

Windows Bob (1995)

M e t a p h o r s & R e p r e s e n t a t i o n

The interactive design: Metaphors in interactive design

Page 36: E concept metaphors-representations_signs_semiotics

Word (1989: 1.0)

M e t a p h o r s & R e p r e s e n t a t i o n

The interactive design: Metaphors in interactive design

Pages Ipad (2012)

Thoughts (2012)

Page 37: E concept metaphors-representations_signs_semiotics

Apple Mac (2006: OS X 10.4.7)

M e t a p h o r s & R e p r e s e n t a t i o n

The interactive design: Metaphors in interactive design

Ipad (Apple 2012)

Page 38: E concept metaphors-representations_signs_semiotics

M e t a p h o r s & R e p r e s e n t a t i o n

The interactive design: Metaphors in interactive design

?

Page 39: E concept metaphors-representations_signs_semiotics

Curriculum

Cooper, Allan (ed.) (2007):About Face 3. The Essential of Interaction Design.Wiley Publishing

Chapters: 13.

Other references

Cours de linguistique générale. Suassure 1916. http://en.wikipedia.org/wiki/Course_in_General_Linguistics.

Lakoff og Johnson (1980, 2002):Metaphors we live by.Chicago Press, USA.

Fiske, John (1990):Introduction to Communication Studies.Routledge. References to signs p. 47. See Google books

Resources

Buhl, Claus (2005):Det lærende brand.Børsens Forlag.

Malcolm Barnard (2005):Graphic Design as CommunicationRoutledge.

Anne Mette Busch, David Engelby (m.fl.) (2011):Kommunikation i multimediedesign.Hans Reitzels Forlag.