Welcome to ”Aesthetics of Interaction” › research › group › idc › ituniv › ... · “The great work of the painter is the 'historia'; parts of the 'historia' are the

Sus Lundgren fall 2010

Coherency,

das Gesamtkunstwerk

and how to make design

decisions

Sus Lundgren 2010-02-10


Today’s goals

To introduce coherency/consistency as design

concept

To introduce the notion of das Gesamtkunstwerk,

– and interactive objects as being Gesamtkunstwerke

To show how you can use these concept in your

projects

– in order to make good designs

– and get high grades :)


Today’s goals

To introduce coherency/consistency as design

concept

To introduce the notion of das Gesamtkunstwerk

– and interactive objects as being Gesamtkunstwerke

To show how you can use these concept in your

projects

– in order to make good designs

– and get high grades :)


What is coherency?

What is coherency (consistency)?

Discuss

– Think of things that are incoherent

– …or coherent


Coherency

Coherency, consistency,

cohesion...

– That things ”work” in the same

way

– That one can draw conclusions

on not yet seen or tried things

on the basis of what one already

knows about the system

– That there is an underlying

idea/notion/logic that unites

different aspects of the design

– Common in all types of design


So it all boils down to...

coherent according to what???– Ease of use ?

– Other ideals

– Ideas


So it all boils down to...

coherent according to what???– Ease of use ?

– Other ideals

– Ideas

I’ll give a lot of examples..


Dragon’s Gold

Coherency-objectives

1. Usability / efficiency

2. Keeping as much of the

game’s core (rules,

gameplay) as suitable


Coherency in usability

Common ”usability” theme, related to foreseeing

what the program will/can do

–Hmmm… this icon has a diskette on it…


Coherency as ”beauty”

Coherency as the strive for harmony and unity

– Pythagoreans (Pythagoras ca 582-500 BC): Beauty is

built into the Universe: Simple symmetry and harmony,

geometric shapes

– Augustine (5th century): ”Modus, species et ordo”

(latin, measure, form and order)

– Thomas of Aquino (1225 –1274, philosopher): Beauty,

but also purpose

– Scholastics: Consonantia (accord, harmony) and

claritas (clearness, light)


Coherency via math & proportions

Math- and

proportion-based

coherency

Da Vinci’s paitning is based

on the ancient Roman

architecht Vitruvius’

description of the human

proportions.



Math- and

proportion-based

coherency

Map of body measures, this

one designed by Le Corbusier

(first half of 20ieth century), but

many similar maps have been

drawn throughout history



Math- and proportion-

based coherency

– Functionalism

– De Stijl

– Ulm



It is certainly true that at Ulm there was a

fixation on geometry as a visual language.

The emphasis on rationality favored

mathematical thinking in design. […] By

excluding from our teaching, from the very

beginning, not only art, but taste and

fashion, we freed ourselves to some extent

from the emotive and irrational

characteristics of these fields of activity.”

– Herbert Lindinger in ”Ulm Design: The

Morality of Objects”,1991, pp. 78 and 79


Form ever follows function

It is the pervading law of all things organic and

inorganic,

Of all things physical and metaphysical,

Of all things human and all things super-human,

Of all true manifestations of the head,

Of the heart, of the soul,

That the life is recognizable in its expression,

That form ever follows function.

This is the law.

– Louis H. Sullivan in “The tall office building artistically

considered” (1896)


Case: Riven

The Computer game

Riven is based on

two things

–An underlying

narrative of the D’ni,

writing books that

become worlds

–The number five; five

islands, five colors,

pentagon shapes

everywhere, e.g. tables

with five legs…


Case: Riven

Five islands


Case: Riven

Gehn’s crest; five

in five in five in

five in five…


Case: Riven


Case: Riven

Five pillars

Five beetles

Five-pointed star on wall, in pentagon

Five-pointed star on floor, with D’ni symbol for five

in the middle


Case: Riven

One of five paintings

Two five-pointed

stars in the upper

right symbol

D’ni-symbol for five

as medallion

…and it goes on like

that…


Ex2: Coherency via narrative

Leon Battista Alberti (1404 –1472)

– Della Pittura 1436

– Arti del designo was an exact science

– Still, art needed historia

“The great work of the painter is the 'historia'; parts of

the 'historia' are the bodies, part of the body is the

member, and part of the member is a surface. […]

Everything the people in the painting do among

themselves, or, perform in relation to the spectators,

must fit together to represent and explain the 'historia.'“


Coherency via narrative

Stylt’s design of Reval Hotel Sonya in St

Petersburg based on Dostoyevsky’s ”Crime and

Punishment”

– A giant bookcase in the lobby has been filled with versions

of “Crime and Punishment” in many different languages

– A sofa shaped like a huge Russian lacquerware box with

motifs from the novel.

– Desks inspired by Dostoyevsky’s own desk

– Parts of Rafael’s “Sistine Madonna” which appear in

many of Dostoyevsky’s novels, hanging in each room.


Coherency via narrative

Anthony Dunne – Hertzian

Tales: comment on invisible

signals around us

– Radio waves, electromagnetic

waves

The Faraday Chair

The Thief of Affections


Ex 3: Coherency via personality

“In ascribing a certain character to an artifact we make

a very simple, but powerful description that frequently

will be accurate enough to help us to manage the task of

handling the artifact and to appreciate the

consequences of our interaction with it.”

– Lars-Erik Janlert and Erik Stolterman in “The Character

of Things”, 1997 p. 300


Ex 3: Coherency via personality

Reeves & Nass, The Media Equation

– the theory that interactions with computers, television etc

are identical to real social relationships and to the

navigation of real physical spaces.

– Submissive/Dominant people prefer computers with same

personality; even more if it adapts its personality to them


Ex2: Coherency via personality

IxD: Dunne and Raby

– Technological Dreams series: No. 1, Robots:

” These objects are meant to spark a discussion about

how we'd like our robots to relate to us: subservient,

intimate, dependent, equal?”

Independent (goes about with its tasks)

Nervous (home security)

Sentinel (=vaktpost, guards personal data)

Needy (very smart)


Case: The Iron Horse

The Iron Horse was my

Project-course design

– The toy we always wanted

but never got

– A bike that sounded like a

horse


Iron Horse design decisions

Goal: Encourage play and imagination

Means: To give the bike horse-traits

Secondary goal: Safety

Means: Keep ordinary functions, not

interfere with use, just augment

Imagination”personality” and mimic behaviors

Play no rules

Imagination + safety only use sounds

Chosen

Forced


Choosing sounds

Whinny (friendly, aggressive)

Snort

Chewing

Digestion sounds

Urinate

Poop

”Movement”-sounds from hoofs

Kicking

Swooshing tail

Which ones

would you have

kept?


Choosing sounds

Whinny (friendly, aggressive)

Snort

Chewing

Digestion sounds

Urinate

Poop

”Movement”-sounds from hoofs

Kicking

Swooshing tail

Which ones

would you have

kept?


Choosing expressions/behaviors

Live in groups

– Know each other

– Greet each other

– Keep the group’s pace

– Graze in pairs

– Can sleep standing up

Movement

– Walk, trot, canter (three-beat) gallop (four-beat)

– Rear


The hardware of the Iron Horse

Hall sensor + magnets

– lock + spokes for speed, pinion + frame for pedal

movement & position

Accelerometer

Radio transmitter + reciever, key with transmitter


Expressing the horse character

Expression

Gait sounds

Greeting Whinny

Whinny (rear)

Whinny

Snort (prompt)

Snort

Keeping pace

Tail swoosh

How?

Speed of wheels

Radio signal from horse/key

Accelerometer

Randomized by code

Speed of pedals

Randomized by code

Radio signals from horses

Radio signals from horses

Probability

depending

on

individual


Horse-jumping application

We also came up with the concept of a horse-

jumping application

–Fences as white lines: width = height

–Jump = pedals in correct position

–Sound of falling fence if failed

–Explicitly no rules or points


Iron Horse design decisions








Play no rules

Chosen

Forced


The New Office Assistant

Have you ever owned a dog?

They do this…



…They don’t do this…



And they certainly do not do THIS!



Let’s improve this…

New

Save

Open

Print

Find and Replace


Multidisciplinary coherency

Coherency is easier to attain in one singular

medium:

Stories

Music

Adding more disciplines makes it more

complicated since they need to cooperate,

intertwine even, to become a

Gesamtkunstwerk!


Das Gesamtkunstwerk

Das Gesamtkunstwerk: “total artwork” or

“integrated artwork”

– Artworks or artifacts where several disciplines are used in

creation

– Introduced by Wagner: opera

– Fascinated artists ever since – especially architects

To make every aspect of an object – the form, the

details etc. – to accord, creating a conjoined

whole.

– Many Gesamtkunstwerk-houses

– Bauhaus school



Das Gesamtkunstwerk as house

Victor Horta:

Haus Tassel

1893-1895

Brussels


Das Gesamtkunstwerk as house

Friedensreich Regentag Dunkelbunt Hundertwasser: Waldspirale, Darmstadt, Germany,


Hundertwasser’s Mouldiness Manifesto

Today we live in a chaos of straight lines, in a jungle of

straight lines. If you do not believe this, take the trouble

to count the straight lines which surround you. Then

you will understand, for you will never finish counting.

[we are trapped in a jungle of straight lines]

Until now, man has always cleared away the jungles he

was in and freed himself. But to clear a jungle you must

first become aware that you are in one, for this jungle

took form stealthily, unnoticed by mankind. And this

time it is a jungle of straight lines.


Das Gesamtkunstwerk as profile

Peter Behrens (1868-1940): Graphic designer,

designer, self-taught architect

– Designed his own house as Gesamtkunstwerk in 1901

AEG 1907 – 1914: Groundbreaking!

– Started with graphic design (ads, stationary, invitations,

catalogues...

– exhibitions...

– interior decorations, buildings

– products (e.g. fans, water boilers, measuring instruments

= Profiling all aspects of the company


Behrens at the AEG


Behrens’ ideal

Behrens’ general ideal was to let the

visual form of the manufactured

product stand for itself

– No longer cultural, literal, mythological

connotations

The result was novel industrial design

– Used simple basic shapes

– Standard components and measures

– Rhythm by repeating shapes and patterns

– Sparse use of ornaments


Design languages / profiles

What Behren’s did for AEG, everyone does today;

company or product profiling

– Look & feel

– Colors, fonts, shapes

– Design languages concisting of words, objectives

– Values

– Ethics

…Coherency!


The gesamtkunstwerk in IxD

“LG Chocolate sold over one million

units in only eight weeks following its

introduction. This phone offers (from a

2006 point of view) a unique

interactive narrative which can be

called a real Gesamtkunstwerk –

directly engaging the three senses of

sight, hearing and touch, and evoking

the fourth sense of taste through the

phone's name and color.”

– Lev Manovich in ”Interaction as an

aesthetic event” (2006)


Case: Hipstamatic

Camera-app for iPhone mimicking old crappy

cameras from the 1970ies. How?


Consistent look&feel

Old-fashioned look&feel

Old-fashioned shutter sound

Old-fashioned flash sound


Mimicking film quality/decay


1) Mimicking effect of lenses


Mimicking effect of chosen film


Mimicking lense change


Mimicks lense change


Mimicking inexact aim


Mimicking waiting…


Slowness in seeing the pic…


Mimicking ”film roll” 24 slots


Consistent interaction

Swipe to change lense

– (to some extent mimicking that

oing this is a physical interaction

rather than a choice in a list)

Swipe through film roll

Flick/pan to change film

– (to some extent mimicking that

oing this is a physical interaction

rather than a choice in a list)


Consistent in its mimicking

I can ”get used”

to the lenses

and the film,

learning when

they work best

or which effect

they give.

(I knew this pic would be

better with hipsta than

with my regular iPhone

camera)


Why does this help you?

Because coherency is, has always been, and will

always been a design VIRTUE :)

But how?


Step 1: State objectives

At the start of each project:

1) State goals

2) State means

3) Take outer constraints into account

– Time

– Skill

– Resources

– Demands

Iterate!

Extract a

few design

guidelines

Rank

them!








Play no rules


Chosen

Forced


Step 2: Cling to them

Let your design guidelines serve as frame for the

project.

Do not make any one single design decision

without considering them.

(And remember; at some point coherency always

breaks; make sure it’s discrete)


Good luck with

your projects!

Documents

Welcome to ”Aesthetics of Interaction” › research › group › idc › ituniv › ... · “The great work of the painter is the 'historia'; parts of the 'historia' are the