SlideShare a Scribd company logo
1 of 25
Download to read offline
Design Principles
 from Don Norman’s “Design of Everyday Things” and
Preece, Rogers and Sharp’s “Beyond Interaction Design”
Design of Everyday Things
•   Donald Norman - cognitive scientist and engineer who
    has pioneered many ideas surrounding user centred-
    design
•   worked for Apple, Hewlett Packard, Northwestern
    University, UCSD
•   critiques and examines many everyday items as examples
    of problematic designs
•   design principles a framework for discussing and thinking
    about everyday interactions
•   Norman, Donald A. (1988). The Design of Everyday Things. New
     York: Basic Books.
Design Principles
•   Visibility- can is see it?
•   Feedback - what is it doing now?
•   Affordance - how do I use it?
•   Mapping - where am 1 and where can I go?
•   Constraint - why can’t I do that?
•   Consistency - I think I have seen this before?
Visibility
•   Can see the state of a device and possible actions
•   Car controls are positioned in a way that they can
    be easily found and used
Visibility
•   Problems arise when we cannot “see” how to do use
    a device
•   Sensor technology like auto faucets - not sure how
    to use - guess where to put hands
•   Visible knobs, dials and buttons have been replaced
    by invisible and ambiguous “active zones”
Visibility
•   Hiding certain functions can be
    advantageous in interface design
•   Certain functions are kept invisible
    until needed; also contained within
    a group of similar types
•   Google search makes it clear
    where to enter text
Visibility
•   Other examples of poor or good visibility in design?
Feedback
•   what is it doing now? what action has been
    performed?
•   needs to be immediate and synchronized with user
    action
Feedback
•   Sound works as feedback - examples?
Feedback
•   Other examples of feedback in everyday design?
Affordance
•   Perceived and actual properties of an object that give
    clues to its operation
Affordance
•   Perceived and actual properties of an object that give
    clues to its operation
Affordance
•   Perceived and actual properties of an object that give
    clues to its operation
Affordance
•   Other examples of affordances in everyday interactions?
Mapping
•   Relationship to controls and their effect
Mapping
•   Relationship to controls and their effect
Mapping
•   Relationship to controls and their effect
Constraints
•   Restricting the kind of interactions that can take place
Constraints
•   Restricting the kind of
    interactions that can take place
•   Reduce the chance of error
•   Can also work to focus user’s
    attention to needed task
Constraints
•   Other examples of good and bad
    constraints?
Consistency
    •    designing interfaces to have similar operations and use similar
         elements for achieving similar task
    •    systems are usable and learnable when similar concepts are
         expresses in similar ways
    •    enables people to quickly transfer prior knowledge to new
         contexts and focus on relevant tasks
•       Four types of consistency:
    •    aesthetic
    •    functional
    •    internal
    •    external
Consistency
Aesthetic
•   style and appearance is repeated to enhance
    recognition, communicates membership and sets
    emotional tone
•   Mercedes Benz vehicles are instantly
    recognizable because the company consistently
    feature its logo on all its vehicles
•   associated with quality and prestige; respected
    and admired; fine craftsmanship and reliable
Consistency
Functional
•   meaning and action are consistent to improve
    learnability and understanding
•   consistent use of symbols to represent similar
    concepts, leverages prior knowledge and makes
    new things easier to use
•   traffic always turns yellow before red
•   cassette recorder control symbols used on a
Consistency
Internal
•   consistency with other elements in the
    system
•   cultivates a sense of orientation and trust
•   indicates system is well thought out and
    planned
•   eg. park and trail signage
Consistency
External
•   consistent with other elements in the environment
•   extends the benefit of internal consistencies across
    multiple, independent systems
•   more difficult to achieve because different systems rarely
    observe the same design standards

More Related Content

What's hot

What's hot (20)

User interface design
User interface designUser interface design
User interface design
 
UX RULES: 10 ESSENTIAL PRINCIPLES
UX RULES: 10 ESSENTIAL PRINCIPLESUX RULES: 10 ESSENTIAL PRINCIPLES
UX RULES: 10 ESSENTIAL PRINCIPLES
 
HCI 3e - Ch 7: Design rules
HCI 3e - Ch 7:  Design rulesHCI 3e - Ch 7:  Design rules
HCI 3e - Ch 7: Design rules
 
The Design of Everyday Things
The Design of Everyday ThingsThe Design of Everyday Things
The Design of Everyday Things
 
HCI Basics
HCI BasicsHCI Basics
HCI Basics
 
HCI - Chapter 4
HCI - Chapter 4HCI - Chapter 4
HCI - Chapter 4
 
HCI 3e - Ch 5: Interaction design basics
HCI 3e - Ch 5:  Interaction design basicsHCI 3e - Ch 5:  Interaction design basics
HCI 3e - Ch 5: Interaction design basics
 
Usability Testing 101 - an introduction
Usability Testing 101 - an introductionUsability Testing 101 - an introduction
Usability Testing 101 - an introduction
 
An Introduction to Usability Testing
An Introduction to Usability TestingAn Introduction to Usability Testing
An Introduction to Usability Testing
 
Heuristic evaluation
Heuristic evaluationHeuristic evaluation
Heuristic evaluation
 
Good bad design
Good bad designGood bad design
Good bad design
 
UX Lesson 1: User Centered Design
UX Lesson 1: User Centered DesignUX Lesson 1: User Centered Design
UX Lesson 1: User Centered Design
 
User interface and user experience ui ux design basics
User interface  and user experience ui ux design basicsUser interface  and user experience ui ux design basics
User interface and user experience ui ux design basics
 
Mobile Design
Mobile DesignMobile Design
Mobile Design
 
UX Experience Design: Processes and Strategy
UX Experience Design: Processes and StrategyUX Experience Design: Processes and Strategy
UX Experience Design: Processes and Strategy
 
UI vs UX workshop
UI vs UX workshopUI vs UX workshop
UI vs UX workshop
 
UX design
UX designUX design
UX design
 
UX Usability Heuristics
UX Usability HeuristicsUX Usability Heuristics
UX Usability Heuristics
 
UX Lesson 2: User Research
UX Lesson 2: User ResearchUX Lesson 2: User Research
UX Lesson 2: User Research
 
Understanding UI/UX Design by Aroyewun Babajide
Understanding UI/UX Design by Aroyewun BabajideUnderstanding UI/UX Design by Aroyewun Babajide
Understanding UI/UX Design by Aroyewun Babajide
 

Similar to Design Principles

Usability & Agile Development
Usability & Agile DevelopmentUsability & Agile Development
Usability & Agile Development
binuvt
 
Design Principlesfrom Don Norman’s Design of Everyday Thing.docx
Design Principlesfrom Don Norman’s Design of Everyday Thing.docxDesign Principlesfrom Don Norman’s Design of Everyday Thing.docx
Design Principlesfrom Don Norman’s Design of Everyday Thing.docx
theodorelove43763
 

Similar to Design Principles (20)

GHAMAS Design Principles
GHAMAS Design PrinciplesGHAMAS Design Principles
GHAMAS Design Principles
 
UX Workshop at Startit@KBC
UX Workshop at Startit@KBCUX Workshop at Startit@KBC
UX Workshop at Startit@KBC
 
Module 2nd USER INTERFACE DESIGN (15CS832) - VTU
Module 2nd USER INTERFACE DESIGN (15CS832) - VTUModule 2nd USER INTERFACE DESIGN (15CS832) - VTU
Module 2nd USER INTERFACE DESIGN (15CS832) - VTU
 
Experience the Interface
Experience the InterfaceExperience the Interface
Experience the Interface
 
Interaction design patterns
Interaction design patternsInteraction design patterns
Interaction design patterns
 
Week 8 & 10
Week 8 & 10Week 8 & 10
Week 8 & 10
 
Usability & Agile Development
Usability & Agile DevelopmentUsability & Agile Development
Usability & Agile Development
 
Ux Meets Code Interaction Usability
Ux Meets Code Interaction UsabilityUx Meets Code Interaction Usability
Ux Meets Code Interaction Usability
 
Design Principlesfrom Don Norman’s Design of Everyday Thing.docx
Design Principlesfrom Don Norman’s Design of Everyday Thing.docxDesign Principlesfrom Don Norman’s Design of Everyday Thing.docx
Design Principlesfrom Don Norman’s Design of Everyday Thing.docx
 
UXD - A quick overview on what you need to work with your UX team
UXD - A quick overview on what you need to work with your UX team UXD - A quick overview on what you need to work with your UX team
UXD - A quick overview on what you need to work with your UX team
 
Usability and User Experience Training Seminar
Usability and User Experience Training SeminarUsability and User Experience Training Seminar
Usability and User Experience Training Seminar
 
10 Hinweise für Architekten
10 Hinweise für Architekten10 Hinweise für Architekten
10 Hinweise für Architekten
 
Ten Advices for Architects
Ten Advices for ArchitectsTen Advices for Architects
Ten Advices for Architects
 
Intro to ux and how to design a thoughtful ui
Intro to ux and how to design a thoughtful uiIntro to ux and how to design a thoughtful ui
Intro to ux and how to design a thoughtful ui
 
COMP 4010: Lecture 5 - Interaction Design for Virtual Reality
COMP 4010: Lecture 5 - Interaction Design for Virtual RealityCOMP 4010: Lecture 5 - Interaction Design for Virtual Reality
COMP 4010: Lecture 5 - Interaction Design for Virtual Reality
 
Design process interaction design basics
Design process interaction design basicsDesign process interaction design basics
Design process interaction design basics
 
Lecture 6 Interaction Design for VR
Lecture 6 Interaction Design for VRLecture 6 Interaction Design for VR
Lecture 6 Interaction Design for VR
 
IxD talk
IxD talkIxD talk
IxD talk
 
Chapter 7 design rules
Chapter 7 design rulesChapter 7 design rules
Chapter 7 design rules
 
Validating Ideas Through Prototyping
Validating Ideas Through PrototypingValidating Ideas Through Prototyping
Validating Ideas Through Prototyping
 

Recently uploaded

一比一定(购)卡尔顿大学毕业证(CU毕业证)成绩单学位证
一比一定(购)卡尔顿大学毕业证(CU毕业证)成绩单学位证一比一定(购)卡尔顿大学毕业证(CU毕业证)成绩单学位证
一比一定(购)卡尔顿大学毕业证(CU毕业证)成绩单学位证
wpkuukw
 
一比一定(购)西悉尼大学毕业证(WSU毕业证)成绩单学位证
一比一定(购)西悉尼大学毕业证(WSU毕业证)成绩单学位证一比一定(购)西悉尼大学毕业证(WSU毕业证)成绩单学位证
一比一定(购)西悉尼大学毕业证(WSU毕业证)成绩单学位证
eqaqen
 
怎样办理伯明翰大学学院毕业证(Birmingham毕业证书)成绩单留信认证
怎样办理伯明翰大学学院毕业证(Birmingham毕业证书)成绩单留信认证怎样办理伯明翰大学学院毕业证(Birmingham毕业证书)成绩单留信认证
怎样办理伯明翰大学学院毕业证(Birmingham毕业证书)成绩单留信认证
eeanqy
 
Top profile Call Girls In Sonipat [ 7014168258 ] Call Me For Genuine Models W...
Top profile Call Girls In Sonipat [ 7014168258 ] Call Me For Genuine Models W...Top profile Call Girls In Sonipat [ 7014168258 ] Call Me For Genuine Models W...
Top profile Call Girls In Sonipat [ 7014168258 ] Call Me For Genuine Models W...
nirzagarg
 
一比一定(购)滑铁卢大学毕业证(UW毕业证)成绩单学位证
一比一定(购)滑铁卢大学毕业证(UW毕业证)成绩单学位证一比一定(购)滑铁卢大学毕业证(UW毕业证)成绩单学位证
一比一定(购)滑铁卢大学毕业证(UW毕业证)成绩单学位证
wpkuukw
 
一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样
一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样
一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样
yhavx
 
Minimalist Orange Portfolio by Slidesgo.pptx
Minimalist Orange Portfolio by Slidesgo.pptxMinimalist Orange Portfolio by Slidesgo.pptx
Minimalist Orange Portfolio by Slidesgo.pptx
balqisyamutia
 
一比一原版(WLU毕业证)罗瑞尔大学毕业证成绩单留信学历认证原版一模一样
一比一原版(WLU毕业证)罗瑞尔大学毕业证成绩单留信学历认证原版一模一样一比一原版(WLU毕业证)罗瑞尔大学毕业证成绩单留信学历认证原版一模一样
一比一原版(WLU毕业证)罗瑞尔大学毕业证成绩单留信学历认证原版一模一样
awasv46j
 
怎样办理伯明翰城市大学毕业证(BCU毕业证书)成绩单留信认证
怎样办理伯明翰城市大学毕业证(BCU毕业证书)成绩单留信认证怎样办理伯明翰城市大学毕业证(BCU毕业证书)成绩单留信认证
怎样办理伯明翰城市大学毕业证(BCU毕业证书)成绩单留信认证
eeanqy
 
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789
CristineGraceAcuyan
 
Anupama Kundoo Cost Effective detailed ppt with plans and elevations with det...
Anupama Kundoo Cost Effective detailed ppt with plans and elevations with det...Anupama Kundoo Cost Effective detailed ppt with plans and elevations with det...
Anupama Kundoo Cost Effective detailed ppt with plans and elevations with det...
sriharipichandi
 
How to Build a Simple Shopify Website
How to Build a Simple Shopify WebsiteHow to Build a Simple Shopify Website
How to Build a Simple Shopify Website
mark11275
 
Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...
Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...
Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...
instagramfab782445
 

Recently uploaded (20)

一比一定(购)卡尔顿大学毕业证(CU毕业证)成绩单学位证
一比一定(购)卡尔顿大学毕业证(CU毕业证)成绩单学位证一比一定(购)卡尔顿大学毕业证(CU毕业证)成绩单学位证
一比一定(购)卡尔顿大学毕业证(CU毕业证)成绩单学位证
 
一比一定(购)西悉尼大学毕业证(WSU毕业证)成绩单学位证
一比一定(购)西悉尼大学毕业证(WSU毕业证)成绩单学位证一比一定(购)西悉尼大学毕业证(WSU毕业证)成绩单学位证
一比一定(购)西悉尼大学毕业证(WSU毕业证)成绩单学位证
 
怎样办理伯明翰大学学院毕业证(Birmingham毕业证书)成绩单留信认证
怎样办理伯明翰大学学院毕业证(Birmingham毕业证书)成绩单留信认证怎样办理伯明翰大学学院毕业证(Birmingham毕业证书)成绩单留信认证
怎样办理伯明翰大学学院毕业证(Birmingham毕业证书)成绩单留信认证
 
Just Call Vip call girls Kasganj Escorts ☎️8617370543 Two shot with one girl ...
Just Call Vip call girls Kasganj Escorts ☎️8617370543 Two shot with one girl ...Just Call Vip call girls Kasganj Escorts ☎️8617370543 Two shot with one girl ...
Just Call Vip call girls Kasganj Escorts ☎️8617370543 Two shot with one girl ...
 
Call Girls Jalaun Just Call 8617370543 Top Class Call Girl Service Available
Call Girls Jalaun Just Call 8617370543 Top Class Call Girl Service AvailableCall Girls Jalaun Just Call 8617370543 Top Class Call Girl Service Available
Call Girls Jalaun Just Call 8617370543 Top Class Call Girl Service Available
 
Top profile Call Girls In Sonipat [ 7014168258 ] Call Me For Genuine Models W...
Top profile Call Girls In Sonipat [ 7014168258 ] Call Me For Genuine Models W...Top profile Call Girls In Sonipat [ 7014168258 ] Call Me For Genuine Models W...
Top profile Call Girls In Sonipat [ 7014168258 ] Call Me For Genuine Models W...
 
Essential UI/UX Design Principles: A Comprehensive Guide
Essential UI/UX Design Principles: A Comprehensive GuideEssential UI/UX Design Principles: A Comprehensive Guide
Essential UI/UX Design Principles: A Comprehensive Guide
 
一比一定(购)滑铁卢大学毕业证(UW毕业证)成绩单学位证
一比一定(购)滑铁卢大学毕业证(UW毕业证)成绩单学位证一比一定(购)滑铁卢大学毕业证(UW毕业证)成绩单学位证
一比一定(购)滑铁卢大学毕业证(UW毕业证)成绩单学位证
 
一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样
一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样
一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样
 
Minimalist Orange Portfolio by Slidesgo.pptx
Minimalist Orange Portfolio by Slidesgo.pptxMinimalist Orange Portfolio by Slidesgo.pptx
Minimalist Orange Portfolio by Slidesgo.pptx
 
一比一原版(WLU毕业证)罗瑞尔大学毕业证成绩单留信学历认证原版一模一样
一比一原版(WLU毕业证)罗瑞尔大学毕业证成绩单留信学历认证原版一模一样一比一原版(WLU毕业证)罗瑞尔大学毕业证成绩单留信学历认证原版一模一样
一比一原版(WLU毕业证)罗瑞尔大学毕业证成绩单留信学历认证原版一模一样
 
怎样办理伯明翰城市大学毕业证(BCU毕业证书)成绩单留信认证
怎样办理伯明翰城市大学毕业证(BCU毕业证书)成绩单留信认证怎样办理伯明翰城市大学毕业证(BCU毕业证书)成绩单留信认证
怎样办理伯明翰城市大学毕业证(BCU毕业证书)成绩单留信认证
 
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789
 
Anupama Kundoo Cost Effective detailed ppt with plans and elevations with det...
Anupama Kundoo Cost Effective detailed ppt with plans and elevations with det...Anupama Kundoo Cost Effective detailed ppt with plans and elevations with det...
Anupama Kundoo Cost Effective detailed ppt with plans and elevations with det...
 
How to Build a Simple Shopify Website
How to Build a Simple Shopify WebsiteHow to Build a Simple Shopify Website
How to Build a Simple Shopify Website
 
Sweety Planet Packaging Design Process Book.pptx
Sweety Planet Packaging Design Process Book.pptxSweety Planet Packaging Design Process Book.pptx
Sweety Planet Packaging Design Process Book.pptx
 
Lecture 01 Introduction To Multimedia.pptx
Lecture 01 Introduction To Multimedia.pptxLecture 01 Introduction To Multimedia.pptx
Lecture 01 Introduction To Multimedia.pptx
 
High Profile Escorts Nerul WhatsApp +91-9930687706, Best Service
High Profile Escorts Nerul WhatsApp +91-9930687706, Best ServiceHigh Profile Escorts Nerul WhatsApp +91-9930687706, Best Service
High Profile Escorts Nerul WhatsApp +91-9930687706, Best Service
 
The hottest UI and UX Design Trends 2024
The hottest UI and UX Design Trends 2024The hottest UI and UX Design Trends 2024
The hottest UI and UX Design Trends 2024
 
Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...
Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...
Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...
 

Design Principles

  • 1. Design Principles from Don Norman’s “Design of Everyday Things” and Preece, Rogers and Sharp’s “Beyond Interaction Design”
  • 2. Design of Everyday Things • Donald Norman - cognitive scientist and engineer who has pioneered many ideas surrounding user centred- design • worked for Apple, Hewlett Packard, Northwestern University, UCSD • critiques and examines many everyday items as examples of problematic designs • design principles a framework for discussing and thinking about everyday interactions • Norman, Donald A. (1988). The Design of Everyday Things. New York: Basic Books.
  • 3. Design Principles • Visibility- can is see it? • Feedback - what is it doing now? • Affordance - how do I use it? • Mapping - where am 1 and where can I go? • Constraint - why can’t I do that? • Consistency - I think I have seen this before?
  • 4. Visibility • Can see the state of a device and possible actions • Car controls are positioned in a way that they can be easily found and used
  • 5. Visibility • Problems arise when we cannot “see” how to do use a device • Sensor technology like auto faucets - not sure how to use - guess where to put hands • Visible knobs, dials and buttons have been replaced by invisible and ambiguous “active zones”
  • 6. Visibility • Hiding certain functions can be advantageous in interface design • Certain functions are kept invisible until needed; also contained within a group of similar types • Google search makes it clear where to enter text
  • 7. Visibility • Other examples of poor or good visibility in design?
  • 8. Feedback • what is it doing now? what action has been performed? • needs to be immediate and synchronized with user action
  • 9. Feedback • Sound works as feedback - examples?
  • 10. Feedback • Other examples of feedback in everyday design?
  • 11. Affordance • Perceived and actual properties of an object that give clues to its operation
  • 12. Affordance • Perceived and actual properties of an object that give clues to its operation
  • 13. Affordance • Perceived and actual properties of an object that give clues to its operation
  • 14. Affordance • Other examples of affordances in everyday interactions?
  • 15. Mapping • Relationship to controls and their effect
  • 16. Mapping • Relationship to controls and their effect
  • 17. Mapping • Relationship to controls and their effect
  • 18. Constraints • Restricting the kind of interactions that can take place
  • 19. Constraints • Restricting the kind of interactions that can take place • Reduce the chance of error • Can also work to focus user’s attention to needed task
  • 20. Constraints • Other examples of good and bad constraints?
  • 21. Consistency • designing interfaces to have similar operations and use similar elements for achieving similar task • systems are usable and learnable when similar concepts are expresses in similar ways • enables people to quickly transfer prior knowledge to new contexts and focus on relevant tasks • Four types of consistency: • aesthetic • functional • internal • external
  • 22. Consistency Aesthetic • style and appearance is repeated to enhance recognition, communicates membership and sets emotional tone • Mercedes Benz vehicles are instantly recognizable because the company consistently feature its logo on all its vehicles • associated with quality and prestige; respected and admired; fine craftsmanship and reliable
  • 23. Consistency Functional • meaning and action are consistent to improve learnability and understanding • consistent use of symbols to represent similar concepts, leverages prior knowledge and makes new things easier to use • traffic always turns yellow before red • cassette recorder control symbols used on a
  • 24. Consistency Internal • consistency with other elements in the system • cultivates a sense of orientation and trust • indicates system is well thought out and planned • eg. park and trail signage
  • 25. Consistency External • consistent with other elements in the environment • extends the benefit of internal consistencies across multiple, independent systems • more difficult to achieve because different systems rarely observe the same design standards