64
Alistair D N Edwards http://www-users.cs.york.ac.uk/ ~alistair/ POETry In-teraction

Alistair D N Edwards alistair/ POETry In-teraction

Embed Size (px)

Citation preview

Page 1: Alistair D N Edwards alistair/ POETry In-teraction

Alistair D N Edwards

http://www-users.cs.york.ac.uk/~alistair/

POETry In-teraction

Page 2: Alistair D N Edwards alistair/ POETry In-teraction

POETS

Psychology of Everyday Things

Don Norman

Page 3: Alistair D N Edwards alistair/ POETry In-teraction

POETS

Design of Everyday Things

Don Norman

DOETS

Page 4: Alistair D N Edwards alistair/ POETry In-teraction

Don Norman

http://www.jnd.org/NNg-Photographs/NNg-photographs.html

Page 5: Alistair D N Edwards alistair/ POETry In-teraction

Poetry in motion

Page 6: Alistair D N Edwards alistair/ POETry In-teraction

Outline

POETSNominationsExamples of everyday design

AffordancesValues

Application of these principles to interface designHomework

Page 7: Alistair D N Edwards alistair/ POETry In-teraction

Don Norman

http://www.jnd.org/NNg-Photographs/NNg-photographs.html

Page 8: Alistair D N Edwards alistair/ POETry In-teraction

Action cycle

Page 9: Alistair D N Edwards alistair/ POETry In-teraction

Affordance

‘Interfaces’ should be intuitive

Good designs afford their use

Page 10: Alistair D N Edwards alistair/ POETry In-teraction

Affordances are

Ill-defined

Why is the chair the favourite example?

Culturally dependent

Evolutionary

Don Norman on affordance

Page 11: Alistair D N Edwards alistair/ POETry In-teraction

Good affordance

http://www.dovetailcarpentry.co.uk/images/prime-images/push-bar-door-1.jpg

Page 12: Alistair D N Edwards alistair/ POETry In-teraction

Bad affordance

http://www.iqcontent.com/blog/files/push%20door%20jpeg%20small.jpg

Page 13: Alistair D N Edwards alistair/ POETry In-teraction

Good affordance

http://store.tread-ware.com/merchant2/graphics/00000001/1044.jpg

Page 14: Alistair D N Edwards alistair/ POETry In-teraction

Value in design

Every design embodies the designers’ values

What are they?

Possibly conflicting

Page 15: Alistair D N Edwards alistair/ POETry In-teraction

Example values

Accessibility

Aesthetics

Ease-of-use

Ecology

Money-making

Safety

Others?

Page 16: Alistair D N Edwards alistair/ POETry In-teraction

Conflicting values

Don Norman on the Macintosh on-switch

http://www.jnd.org/dn.mss/designing_future.html

Page 17: Alistair D N Edwards alistair/ POETry In-teraction

Form follows function?

Louis SullivanJet turbine blades

organic, complex curves

Page 18: Alistair D N Edwards alistair/ POETry In-teraction

Form follows function?

Louis SullivanOften cited as an example

But actually a counter-example, according to users

Page 19: Alistair D N Edwards alistair/ POETry In-teraction

What would you do with this object?

http://www.freefoto.com/images/13/49/13_49_59---Cold-Water-Tap_web.jpg

Page 20: Alistair D N Edwards alistair/ POETry In-teraction

What would you do with this?

Page 21: Alistair D N Edwards alistair/ POETry In-teraction

…and this?

Page 22: Alistair D N Edwards alistair/ POETry In-teraction

Would you twist it?

Page 23: Alistair D N Edwards alistair/ POETry In-teraction

Affordances evolve?

What would you do with this object?

Page 24: Alistair D N Edwards alistair/ POETry In-teraction

Affordances evolve?

What can’t you do with this object?

Page 25: Alistair D N Edwards alistair/ POETry In-teraction

Hands-free tap

Page 26: Alistair D N Edwards alistair/ POETry In-teraction

Hand washer

Page 27: Alistair D N Edwards alistair/ POETry In-teraction

Hand washer – poor affordance?

Page 28: Alistair D N Edwards alistair/ POETry In-teraction

How would you close the plug?

Page 29: Alistair D N Edwards alistair/ POETry In-teraction

How would you close the plug?

Page 30: Alistair D N Edwards alistair/ POETry In-teraction

Bad design: Jailin Fan

Cold and hot faucets. [taps]

The hot (left) and the cold (right) water faucets are separate.

Now, for the life of me I don't understand the logic behind this (I had the same problem one years ago in London).

In the current configuration, either your hand is really cold or boiling hot - but never in a happy medium (no Intelligent Design here!).

Page 31: Alistair D N Edwards alistair/ POETry In-teraction

Good design: Jailin Fan

Oral-B Toothbrush

It has got timer. Bring very good experience of brushing teeth to user.

Page 32: Alistair D N Edwards alistair/ POETry In-teraction

Bathrooms

Page 33: Alistair D N Edwards alistair/ POETry In-teraction

Hand dryers

What do you know about someone who wants to dry their hands?

Their hands are wet

Page 34: Alistair D N Edwards alistair/ POETry In-teraction

Hand dryers

Page 35: Alistair D N Edwards alistair/ POETry In-teraction

Hand dryers

Page 36: Alistair D N Edwards alistair/ POETry In-teraction

Hand dryers

Page 37: Alistair D N Edwards alistair/ POETry In-teraction

What would you do with this dryer?

Page 38: Alistair D N Edwards alistair/ POETry In-teraction

Good design: Judith Borghouts

Macbook

Page 39: Alistair D N Edwards alistair/ POETry In-teraction

Good design: Judith Borghouts

Alessi kettle

Page 40: Alistair D N Edwards alistair/ POETry In-teraction

Good design: Pep Lopez Font

Food container bag

Page 41: Alistair D N Edwards alistair/ POETry In-teraction

Good design: Pep Lopez Font

Food container bag

Page 42: Alistair D N Edwards alistair/ POETry In-teraction

Good design: Grace Chen

I think the design of the light controler is good. It is simple but easy to understand.

Page 43: Alistair D N Edwards alistair/ POETry In-teraction

Bad design: light switch

What can you do with this switch?

Lights on

Lights off

How to tell the difference?

Dim the lights

Page 44: Alistair D N Edwards alistair/ POETry In-teraction

Poor design: Cash dispensers: Martin Rooney + Alistair

Page 45: Alistair D N Edwards alistair/ POETry In-teraction

Cash dispensers: Martin Rooney

When I go to a cash point, I am 99% of the time just wanting to get some money out. So my mental model is that I expect to find an option simply titled 'cash'. But (as this screenshot shows) there is often never just an option 'cash', its always coupled with some other stuff that I don't care about, that just waste my time and forces me to stop and think. In the screenshot I can choose between:

Cash with on-screen balanceCash with receipt

Why not just cash ?

Page 46: Alistair D N Edwards alistair/ POETry In-teraction

Cash dispensers: Alistair

Inconsistency

Allows me to enter how much I want before it tells me its empty

Offers me amounts that are multiples of £10 – and then says it’s only got 20s

An unusual document mix may be dispensed

Page 47: Alistair D N Edwards alistair/ POETry In-teraction

Cash dispensers

etc etc.

Edwards, A. D. N. (1997). How hard can it be to design a hole in the wall? Interfaces (36): p. 3.

http://www-users.cs.york.ac.uk/~alistair/publications/html/holeinthewall.html

Page 48: Alistair D N Edwards alistair/ POETry In-teraction

Poor design: door lock

Page 49: Alistair D N Edwards alistair/ POETry In-teraction

Poor design: door lock

I have tried – and so far failed – to build a state diagram of this lock

Page 50: Alistair D N Edwards alistair/ POETry In-teraction

Poor design: door lock

Locked or open

only apparent by trying the handle

Unlocking may be once-only or ‘permanent’

Depends on programming

and time of day

Flashing green light and beep

meaning…?

Page 51: Alistair D N Edwards alistair/ POETry In-teraction

Interface designed by an engineer

Page 52: Alistair D N Edwards alistair/ POETry In-teraction

Braille

Don’t get me startedhttp://www-users.cs.york.ac.uk/~alistair/braille.html

Edwards, A. D. N. (1998). Making elevators truly accessible to blind people. Elevator World, December, pp. 34-35.

Page 53: Alistair D N Edwards alistair/ POETry In-teraction

Bad design: Judith Borghouts

Jura Ena espresso machine

‘After years of

using it, I still can’t

remember how to

do certain things.’

Page 54: Alistair D N Edwards alistair/ POETry In-teraction

Bad design: Pep Lopez Font

Cooker in his house

Page 55: Alistair D N Edwards alistair/ POETry In-teraction

Bad design: Pep Lopez Font

Cooker in his house

Page 56: Alistair D N Edwards alistair/ POETry In-teraction

Pratyush Pandab

Students in Langwith Uni accommodation might agree with me. The induction cooker with 4 hot rings arranged in a square panel and their corresponding knobs aligned on one side of the panel. Its always fun to watch my flatmates turn the wrong one and then realize it later and mumble!

Page 57: Alistair D N Edwards alistair/ POETry In-teraction

Bad design: Grace Chen

I think the oven icon is not very good, I am not really understand what does it mean.

Page 58: Alistair D N Edwards alistair/ POETry In-teraction

Computer interfaces

Page 59: Alistair D N Edwards alistair/ POETry In-teraction

Button affordance

Page 60: Alistair D N Edwards alistair/ POETry In-teraction

Poor design: Pratyush Pandab

buttons in win XP affords clicking (bevel design)... contrast it with windows 8 metro overlay. all are 2 dimensional.

Page 61: Alistair D N Edwards alistair/ POETry In-teraction

What does this afford?

- Affordances can be culturally-related

Page 62: Alistair D N Edwards alistair/ POETry In-teraction

What does a padlock icon afford?

http://www.microsoft.com/library/media/1033/protect/images/online/padlock.jpg

Page 63: Alistair D N Edwards alistair/ POETry In-teraction

Other interface affordances

Evolved?

Scroll bars

Menus

Arrows

etc.

Page 64: Alistair D N Edwards alistair/ POETry In-teraction

Homework

Choose better labels than A and B

Design graphical alternatives (icons)

To be selected by a vote (user participation)