Design Matters

27
DESIGN MATTERS USABILITY NEED NOT CONFLICT WITH AESTHETICS. A HARMONY BETWEEN THE TWO MUST BE FOUND DONALD NORMAN Andi S. Boediman [email protected] @andisboediman

description

Design matters, especially on small screen. The growth of mobile enables developers and designers to create consumer apps. Design should not be an afterthought.

Transcript of Design Matters

Page 1: Design Matters

DESIGN MATTERSUSABILITY NEED NOT CONFLICT WITH AESTHETICS.A HARMONY BETWEEN THE TWO MUST BE FOUND

DONALD NORMAN

Andi S. [email protected]

@andisboediman

Page 2: Design Matters

THE CHALLENGE OF EVERYDAY THINGS

Page 3: Design Matters

How to open this door?

THE DESIGN OF EVERYDAY THINGS

Page 4: Design Matters

How to turn on the fire?

THE DESIGN OF EVERYDAY THINGS

Page 5: Design Matters

This is a Mop Sink

THE DESIGN OF EVERYDAY THINGS

Page 6: Design Matters

is this going to happen?

THE DESIGN OF EVERYDAY THINGS

Page 7: Design Matters

or is this more like it?

THE DESIGN OF EVERYDAY THINGS

Page 8: Design Matters

PRINCIPLES OF DESIGN

Page 9: Design Matters

mental models are what people really have in their heads and what guides

their use of things.

MENTAL MODEL

Page 10: Design Matters

PRINCIPLES OF DESIGN

•Make things visible

•Provide a good conceptual model• Affordance

• Mapping

• Constraints

• Feedback

Page 11: Design Matters

Just by looking the user should know the state of the system & possible actions

The correct parts must be visible and they must convey the correct message.

Visibility problems occur when clues are lacking or exist in excess

Don’t violate these principles to make something “look good”!

VISIBILITY

Page 12: Design Matters

Just by looking at the object, a user should know how to use it.

Make the appropriate actions visible and make the inappropriate actions invisible.

AFFORDANCE

Page 13: Design Matters

Controls and displays should exploit natural mapping.

Natural mapping takes advantage of physical analogies and cultural standards.

Physical: Steering wheelCultural: red means stop, green means go.

MAPPING

Page 14: Design Matters

Constraints limit the ways in which something can be used.

Ensure correct procedure by making it impossible to do otherwise.

CONSTRAINTS

Page 15: Design Matters

Feedback are clues given to the user that they have been successful

Good design contains feedback

FEEDBACK

Page 16: Design Matters

DESIGN PROCESS

Page 17: Design Matters

ITERATIVE DESIGN

“learning by creating”

“Iterating is designing and, more specifically, understanding what one is designing through actually creating it. . . . Iterative design also means that until

you have actually built what you are designing, you are not going to be able to fully understand it.

--Anders Ramsay, http://www.andersramsay.com/2009/03/01/three-reasons-to-start-designing-iteratively

“learning by reworking”

Page 18: Design Matters

USER CENTERED DESIGN

http://www.vinq.com/ucd.html

discover

define

design

Page 19: Design Matters

DESIGN TIPS

Page 20: Design Matters

USE WHAT’S FAMILIAR

Page 21: Design Matters

USE WHAT’S FAMILIAR

Page 22: Design Matters

USE WHAT’S FAMILIAR

Page 23: Design Matters

RULE OF THUMB

Page 24: Design Matters

SIMPLIFY! SIMPLIFY! SIMPLIFY!

Page 25: Design Matters

SIMPLIFY! SIMPLIFY! SIMPLIFY!

Page 26: Design Matters

SIMPLIFY! SIMPLIFY! SIMPLIFY!