Design of Everyday Things Don Norman on Design

  • Slides: 46
Download presentation
Design of Everyday Things Don Norman on Design & HCI

Design of Everyday Things Don Norman on Design & HCI

Summary Darn these hooves! I hit the wrong switch again! Who designs these instrument

Summary Darn these hooves! I hit the wrong switch again! Who designs these instrument Panels, raccoon? !

Don Norman ¢ ¢ ¢ Professor at Northwestern and Principal of Nielsen Norman group

Don Norman ¢ ¢ ¢ Professor at Northwestern and Principal of Nielsen Norman group Previously Professor at UCSD, senior positions at Apple & HP ACM/CHI Lifetime Achievement Award Prolific author http: //www. jnd. org/

Discussion ¢ What did you take away from DOET book so far?

Discussion ¢ What did you take away from DOET book so far?

Here are some Affordances are important ¢ Minimize the gulf of interpretation and gulf

Here are some Affordances are important ¢ Minimize the gulf of interpretation and gulf of execution ¢ Use natural mappings ¢ Make state visible ¢ Use a conceptual model that makes sense ¢ Provide feedback ¢

Daily Challenges ¢ How many of you can use all the functionality in your

Daily Challenges ¢ How many of you can use all the functionality in your VCR l Digital watch l Copy machine l Stereo system l Plumbing fixtures l

Hall of Shame Example ¢ Leitz slide projector To move forward, short press l

Hall of Shame Example ¢ Leitz slide projector To move forward, short press l To move backward, long press l ¢ What happens when you get frustrated?

Fun Examples Phones How do you - transfer a call - change volume -

Fun Examples Phones How do you - transfer a call - change volume - store a number -. . .

Changing Ringer Volume Press “Program” ¢ Press “ 6” ¢ Set volume ¢ Low

Changing Ringer Volume Press “Program” ¢ Press “ 6” ¢ Set volume ¢ Low - Press “ 1” l Medium - Press “ 2” l High - Press “ 3” l ¢ Press “Program”

Much better…

Much better…

Important Concepts Affordances ¢ Visibility ¢ Conceptual models ¢ Mapping ¢ Feedback ¢ Constraints

Important Concepts Affordances ¢ Visibility ¢ Conceptual models ¢ Mapping ¢ Feedback ¢ Constraints ¢

Affordances ¢ Perceived and actual properties of an object that determine how it could

Affordances ¢ Perceived and actual properties of an object that determine how it could be used Chair is for sitting l Button is for pushing l Door handle is for …. l Scroll arrow is for … l Icon is for … l

Door Opening Affordances 1 2 3 4 ¢ ¢ 6 7 ¢ 5 Which

Door Opening Affordances 1 2 3 4 ¢ ¢ 6 7 ¢ 5 Which doors are easy to open? Which doors are hard to open? Why?

Affordances in interfaces ¢ Interfaces are virtual and do not have ‘real’ affordances like

Affordances in interfaces ¢ Interfaces are virtual and do not have ‘real’ affordances like physical objects ¢ Interfaces have ‘perceived’ affordances l Learned conventions of arbitrary mappings between action and effect at the interface l Some mappings are better than others

Mantra ¢ Complex things may need explanation, but simple things should not l If

Mantra ¢ Complex things may need explanation, but simple things should not l If a simple thing requires instructions, it is likely a failed design

Designing for People ¢ Norman’s 2 main principles Provide a good conceptual model l

Designing for People ¢ Norman’s 2 main principles Provide a good conceptual model l Make things visible l • Affordances is part of this

Conceptual Models ¢ People build their own systems of how things work l ¢

Conceptual Models ¢ People build their own systems of how things work l ¢ Example - thermostat Designer can help user foster an appropriate conceptual model l Appearance, instructions, behavior. . .

Conceptual Models ¢ ¢ Mental models are not always right Two Classes: l Functional

Conceptual Models ¢ ¢ Mental models are not always right Two Classes: l Functional model • Stimulus - response • “Press the accelerator once, then turn the key” • At surface or superficial level l Structural model • Deeper sense of why it happens, not just what happens • “Press the accelerator to engage the automatic choke on a carburetor”

Visibility ¢ When functionality is hidden, problems in use occur l ¢ Occurs when

Visibility ¢ When functionality is hidden, problems in use occur l ¢ Occurs when number of functions is greater than number of controls When capabilities are visible, it does not require memory of how to use Recognition over Recall l in the world vs. in the head l

Simple Example ¢ Bathroom faucets l Two functions • Hot/cold • Flow

Simple Example ¢ Bathroom faucets l Two functions • Hot/cold • Flow

Bathroom Faucets 1 Can you figure out how to use it? Are two functions

Bathroom Faucets 1 Can you figure out how to use it? Are two functions clear and independent?

Bathroom Faucets 2 Can you figure out how to use it? Are two functions

Bathroom Faucets 2 Can you figure out how to use it? Are two functions clear and independent?

Bathroom Faucets 3 Can you figure out how to use it? Are two functions

Bathroom Faucets 3 Can you figure out how to use it? Are two functions clear and independent?

My parent’s microwave 5: 45

My parent’s microwave 5: 45

My microwave

My microwave

About that VCR… ¢ That old joke - “how many of you have a

About that VCR… ¢ That old joke - “how many of you have a VCR that is blinking 12: 00? ” : -) ¢ Still true today : -(

Which is Faster for Setting Time?

Which is Faster for Setting Time?

Two Important Principles Mapping ¢ Feedback ¢

Two Important Principles Mapping ¢ Feedback ¢

Mapping Relationship between control and action/result in the world ¢ Take advantage of physical

Mapping Relationship between control and action/result in the world ¢ Take advantage of physical analogies or cultural understandings ¢ l Good: • Car, various driving controls • Mercedes Benz seat adjustment example l Bad • Car stereo - Knob for front/back speakers

Which is better? or

Which is better? or

Mapping Example: Euros ¢ Size: : value

Mapping Example: Euros ¢ Size: : value

Mapping Example: Stove Which controls which?

Mapping Example: Stove Which controls which?

Why not this?

Why not this?

Yikes!

Yikes!

Why Not Design Better ¢ ¢ Stove Speakers Physical, monetary, convenience, etc. , constraints

Why Not Design Better ¢ ¢ Stove Speakers Physical, monetary, convenience, etc. , constraints dictate otherwise

Feedback ¢ ¢ Sending information back to the user about what has been done

Feedback ¢ ¢ Sending information back to the user about what has been done Includes sound, highlighting, animation and combinations of these l e. g. when screen button clicked on provides sound or red highlight feedback: “ccclichhk”

Example Affordances - Insert something into holes Constraints - Bigger hole for several fingers,

Example Affordances - Insert something into holes Constraints - Bigger hole for several fingers, small for thumb Mapping - How to insert fingers into holes suggested by visible appearance Conceptual model - Suggested by how parts fit together and move Scissors

Execution-Evaluation cycle Norman (DOET, p. 46) Physical System Gulf of Execution User Goals Gulf

Execution-Evaluation cycle Norman (DOET, p. 46) Physical System Gulf of Execution User Goals Gulf of Evaluation

Goals, Execution, Evaluation Goals What we want to happen (Gulf of Execution) Execution What

Goals, Execution, Evaluation Goals What we want to happen (Gulf of Execution) Execution What we do to the world Evaluation Comparing what happened (Gulf of Evaluation) with what we wanted to happen Physical System

Execution Goals What we want to happen An intention to act so as to

Execution Goals What we want to happen An intention to act so as to achieve the goal The actual sequence of actions that we plan to do The physical execution of that action sequence Physical System

Evaluation Goals What we want to happen Evaluation of the interpretations with what we

Evaluation Goals What we want to happen Evaluation of the interpretations with what we expected to happen Interpreting the perception according to our expectations Perceiving the state of the world Physical System

Seven Stages - All Together Goals What we want to happen An intention to

Seven Stages - All Together Goals What we want to happen An intention to act so as to achieve the goal Evaluation of the interpretations with what we expected to happen The actual sequence of actions that we plan to do Interpreting the perception according to our expectations The physical execution of that action sequence Perceiving the state of the world Physical System

Implications – Which Gulf does these Address? ¢ ¢ ¢ Make current state and

Implications – Which Gulf does these Address? ¢ ¢ ¢ Make current state and action alternatives visible Need good conceptual model with consistent system image Interface should include mappings that reveal relationships between stages User should receive continuous feedback Provide affordances

Goal: Minimize Gulfs ¢ Gulf of Execution l l l Conceptual model Affordances Natural

Goal: Minimize Gulfs ¢ Gulf of Execution l l l Conceptual model Affordances Natural mappings ¢ Gulf of Evaluation l l Make state visible Feedback

Try and Try Again Norman thinks that it often takes 5 or 6 tries

Try and Try Again Norman thinks that it often takes 5 or 6 tries to get something “right” ¢ Simply may not have that luxury in a competitive business environment ¢