SlideShare una empresa de Scribd logo
1 de 62
Descargar para leer sin conexión
Psychological Basis for
UI Design Rules



    Jeff Johnson
    UI Wizards, Inc.



                          1
Many HCI researchers and
practitioners have offered
UI Design Guidelines




                             2
UI Design Guidelines
(Nielsen  Molich, 1993)
    Visibility of system status

    Match between system  real world

    User control  freedom

    Consistency  standards

    Error prevention

    Recognition rather than recall

    Flexibility  efficiency of use

    Aesthetic  minimalist design

    Help users recognize, diagnose,  recover from errors

    Provide online documentation  help


                                                            3
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules

Más contenido relacionado

La actualidad más candente

Project Synopsis Report For Online Job Portal.pdf
Project Synopsis Report For Online Job Portal.pdfProject Synopsis Report For Online Job Portal.pdf
Project Synopsis Report For Online Job Portal.pdf
Abhisheksur5
 
Project network chat presentation
Project network chat presentationProject network chat presentation
Project network chat presentation
Zahan Vlad
 

La actualidad más candente (20)

Ch7
Ch7Ch7
Ch7
 
Blood Bank Management System (including UML diagrams)
Blood Bank Management System (including UML diagrams)Blood Bank Management System (including UML diagrams)
Blood Bank Management System (including UML diagrams)
 
Java Multiple Choice Questions and Answers
Java Multiple Choice Questions and AnswersJava Multiple Choice Questions and Answers
Java Multiple Choice Questions and Answers
 
Android College Application Project Report
Android College Application Project ReportAndroid College Application Project Report
Android College Application Project Report
 
Railway booking & management system
Railway booking & management systemRailway booking & management system
Railway booking & management system
 
ORGAN DONATION MANAGEMENT SYSTEM (PROJECT: ODMS)
ORGAN DONATION MANAGEMENT SYSTEM (PROJECT: ODMS)ORGAN DONATION MANAGEMENT SYSTEM (PROJECT: ODMS)
ORGAN DONATION MANAGEMENT SYSTEM (PROJECT: ODMS)
 
Sdd template
Sdd templateSdd template
Sdd template
 
College Department Management System
College Department Management SystemCollege Department Management System
College Department Management System
 
Entity Relationship Model
Entity Relationship ModelEntity Relationship Model
Entity Relationship Model
 
Java DataBase Connectivity API (JDBC API)
Java DataBase Connectivity API (JDBC API)Java DataBase Connectivity API (JDBC API)
Java DataBase Connectivity API (JDBC API)
 
C++ student management system
C++ student management systemC++ student management system
C++ student management system
 
SRS For Online Store
SRS For Online StoreSRS For Online Store
SRS For Online Store
 
Project Synopsis Report For Online Job Portal.pdf
Project Synopsis Report For Online Job Portal.pdfProject Synopsis Report For Online Job Portal.pdf
Project Synopsis Report For Online Job Portal.pdf
 
Software Engineering- ERD DFD Decision Tree and Table
Software Engineering- ERD DFD Decision Tree and TableSoftware Engineering- ERD DFD Decision Tree and Table
Software Engineering- ERD DFD Decision Tree and Table
 
Abstract method
Abstract methodAbstract method
Abstract method
 
UML Diagram - Use-Case diagram, Activity Diagram, Sequence Diagram, Er Diagra...
UML Diagram - Use-Case diagram, Activity Diagram, Sequence Diagram, Er Diagra...UML Diagram - Use-Case diagram, Activity Diagram, Sequence Diagram, Er Diagra...
UML Diagram - Use-Case diagram, Activity Diagram, Sequence Diagram, Er Diagra...
 
Project network chat presentation
Project network chat presentationProject network chat presentation
Project network chat presentation
 
Data Structure - Elementary Data Organization
Data Structure - Elementary  Data Organization Data Structure - Elementary  Data Organization
Data Structure - Elementary Data Organization
 
Traning and placement management system
Traning and placement management systemTraning and placement management system
Traning and placement management system
 
Inheritance in java
Inheritance in java Inheritance in java
Inheritance in java
 

Destacado

1.introduction to interaction design
1.introduction to interaction design1.introduction to interaction design
1.introduction to interaction design
Keyur Sorathia
 
4.problem statement &_persona
4.problem statement &_persona4.problem statement &_persona
4.problem statement &_persona
Keyur Sorathia
 
5.interaction design framework
5.interaction design framework5.interaction design framework
5.interaction design framework
Keyur Sorathia
 
3 dimensional gestures
3 dimensional gestures3 dimensional gestures
3 dimensional gestures
Keyur Sorathia
 
Advanced JavaScript Techniques
Advanced JavaScript TechniquesAdvanced JavaScript Techniques
Advanced JavaScript Techniques
Dmitry Baranovskiy
 

Destacado (20)

Designing for the Mind - SXSW 2015
Designing for the Mind - SXSW 2015Designing for the Mind - SXSW 2015
Designing for the Mind - SXSW 2015
 
UX & UI Design - Differentiate through design
UX & UI Design - Differentiate through designUX & UI Design - Differentiate through design
UX & UI Design - Differentiate through design
 
Pre-Conference Course: Designing with the Mind in Mind: The Psychological Bas...
Pre-Conference Course: Designing with the Mind in Mind: The Psychological Bas...Pre-Conference Course: Designing with the Mind in Mind: The Psychological Bas...
Pre-Conference Course: Designing with the Mind in Mind: The Psychological Bas...
 
Jeff Johnson at BayCHI: Designing with the Mind in Mind
Jeff Johnson at BayCHI: Designing with the Mind in MindJeff Johnson at BayCHI: Designing with the Mind in Mind
Jeff Johnson at BayCHI: Designing with the Mind in Mind
 
UI Design Principles : 20 Essential Rules for User Interface Design
UI Design Principles : 20 Essential Rules for User Interface DesignUI Design Principles : 20 Essential Rules for User Interface Design
UI Design Principles : 20 Essential Rules for User Interface Design
 
What is UX?
What is UX?What is UX?
What is UX?
 
UX Design + UI Design: Injecting a brand persona!
UX Design + UI Design: Injecting a brand persona!UX Design + UI Design: Injecting a brand persona!
UX Design + UI Design: Injecting a brand persona!
 
Process and Purpose: Build a Media Start-Up That Matters. By Corey Ford. #Roc...
Process and Purpose: Build a Media Start-Up That Matters. By Corey Ford. #Roc...Process and Purpose: Build a Media Start-Up That Matters. By Corey Ford. #Roc...
Process and Purpose: Build a Media Start-Up That Matters. By Corey Ford. #Roc...
 
Lean UX von Yavuz Yilmaz | webulos.com
Lean UX von Yavuz Yilmaz | webulos.comLean UX von Yavuz Yilmaz | webulos.com
Lean UX von Yavuz Yilmaz | webulos.com
 
ASCC IPv6 建置經驗分享
ASCC IPv6 建置經驗分享ASCC IPv6 建置經驗分享
ASCC IPv6 建置經驗分享
 
Introduction to Interaction Design
Introduction to Interaction DesignIntroduction to Interaction Design
Introduction to Interaction Design
 
1.introduction to interaction design
1.introduction to interaction design1.introduction to interaction design
1.introduction to interaction design
 
4.problem statement &_persona
4.problem statement &_persona4.problem statement &_persona
4.problem statement &_persona
 
5.interaction design framework
5.interaction design framework5.interaction design framework
5.interaction design framework
 
3 dimensional gestures
3 dimensional gestures3 dimensional gestures
3 dimensional gestures
 
Mint
MintMint
Mint
 
Advanced JavaScript Techniques
Advanced JavaScript TechniquesAdvanced JavaScript Techniques
Advanced JavaScript Techniques
 
User Interface Design: Definitions, Processes and Principles
User Interface Design: Definitions, Processes and PrinciplesUser Interface Design: Definitions, Processes and Principles
User Interface Design: Definitions, Processes and Principles
 
UI/UX Foundations - Research
UI/UX Foundations - ResearchUI/UX Foundations - Research
UI/UX Foundations - Research
 
UX LIFE CYCLE
UX LIFE CYCLEUX LIFE CYCLE
UX LIFE CYCLE
 

Similar a Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules

Ten Usability Heuristics with Example -Sivaprasath Selvaraj
Ten Usability Heuristics with Example -Sivaprasath SelvarajTen Usability Heuristics with Example -Sivaprasath Selvaraj
Ten Usability Heuristics with Example -Sivaprasath Selvaraj
Sivaprasath Selvaraj
 
Simple usability testing
Simple usability testingSimple usability testing
Simple usability testing
Hans Põldoja
 
User interface design: definitions, processes and principles
User interface design: definitions, processes and principlesUser interface design: definitions, processes and principles
User interface design: definitions, processes and principles
David Little
 
How design decisions affect user performance
How design decisions affect user performanceHow design decisions affect user performance
How design decisions affect user performance
Rachna Mittal
 
Website Usability | Day 1
Website Usability | Day 1Website Usability | Day 1
Website Usability | Day 1
studiokandm
 
Usability Engineering Process Flow Model - Sivaprasath Selvaraj
Usability Engineering Process Flow Model - Sivaprasath SelvarajUsability Engineering Process Flow Model - Sivaprasath Selvaraj
Usability Engineering Process Flow Model - Sivaprasath Selvaraj
Sivaprasath Selvaraj
 
10+1 interaction principles on moible ui
10+1 interaction principles on moible ui10+1 interaction principles on moible ui
10+1 interaction principles on moible ui
bullfrogdesign
 
10+1 interaction principles on moible ui
10+1 interaction principles on moible ui10+1 interaction principles on moible ui
10+1 interaction principles on moible ui
bullfrogdesign
 
Engelman.2011.exploring interaction modes for image retrieval
Engelman.2011.exploring interaction modes for image retrievalEngelman.2011.exploring interaction modes for image retrieval
Engelman.2011.exploring interaction modes for image retrieval
mrgazer
 
Final_USER_EXPERIENCE_Yale_V1
Final_USER_EXPERIENCE_Yale_V1Final_USER_EXPERIENCE_Yale_V1
Final_USER_EXPERIENCE_Yale_V1
Michael Rawlins
 

Similar a Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules (20)

Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design RulesJeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules
 
Ten Usability Heuristics with Example -Sivaprasath Selvaraj
Ten Usability Heuristics with Example -Sivaprasath SelvarajTen Usability Heuristics with Example -Sivaprasath Selvaraj
Ten Usability Heuristics with Example -Sivaprasath Selvaraj
 
Simple usability testing
Simple usability testingSimple usability testing
Simple usability testing
 
User interface design: definitions, processes and principles
User interface design: definitions, processes and principlesUser interface design: definitions, processes and principles
User interface design: definitions, processes and principles
 
Heuristic ux-evaluation
Heuristic ux-evaluationHeuristic ux-evaluation
Heuristic ux-evaluation
 
Ebay News 2006 7 19 Earnings
Ebay News 2006 7 19 EarningsEbay News 2006 7 19 Earnings
Ebay News 2006 7 19 Earnings
 
How design decisions affect user performance
How design decisions affect user performanceHow design decisions affect user performance
How design decisions affect user performance
 
Introduction into User Experience
Introduction into User ExperienceIntroduction into User Experience
Introduction into User Experience
 
Interaction design introduction
Interaction design introductionInteraction design introduction
Interaction design introduction
 
Website Usability | Day 1
Website Usability | Day 1Website Usability | Day 1
Website Usability | Day 1
 
Usability Engineering Process Flow Model - Sivaprasath Selvaraj
Usability Engineering Process Flow Model - Sivaprasath SelvarajUsability Engineering Process Flow Model - Sivaprasath Selvaraj
Usability Engineering Process Flow Model - Sivaprasath Selvaraj
 
hci Evaluation Techniques.pptx
 hci Evaluation Techniques.pptx hci Evaluation Techniques.pptx
hci Evaluation Techniques.pptx
 
Assessing the quality of usability
Assessing the quality of usabilityAssessing the quality of usability
Assessing the quality of usability
 
User Interface Design- Module 2 Uid Process
User Interface Design- Module 2 Uid ProcessUser Interface Design- Module 2 Uid Process
User Interface Design- Module 2 Uid Process
 
HCI
HCI HCI
HCI
 
10+1 interaction principles on moible ui
10+1 interaction principles on moible ui10+1 interaction principles on moible ui
10+1 interaction principles on moible ui
 
10+1 interaction principles on moible ui
10+1 interaction principles on moible ui10+1 interaction principles on moible ui
10+1 interaction principles on moible ui
 
User Experience 3: User Experience, Usability and Accessibility
User Experience 3: User Experience, Usability and AccessibilityUser Experience 3: User Experience, Usability and Accessibility
User Experience 3: User Experience, Usability and Accessibility
 
Engelman.2011.exploring interaction modes for image retrieval
Engelman.2011.exploring interaction modes for image retrievalEngelman.2011.exploring interaction modes for image retrieval
Engelman.2011.exploring interaction modes for image retrieval
 
Final_USER_EXPERIENCE_Yale_V1
Final_USER_EXPERIENCE_Yale_V1Final_USER_EXPERIENCE_Yale_V1
Final_USER_EXPERIENCE_Yale_V1
 

Último

CNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of ServiceCNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of Service
giselly40
 
Artificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and MythsArtificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and Myths
Joaquim Jorge
 

Último (20)

08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
 
Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)
 
Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...
 
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
 
CNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of ServiceCNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of Service
 
Data Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt RobisonData Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt Robison
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024
 
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdfUnderstanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
 
[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf
 
Tech Trends Report 2024 Future Today Institute.pdf
Tech Trends Report 2024 Future Today Institute.pdfTech Trends Report 2024 Future Today Institute.pdf
Tech Trends Report 2024 Future Today Institute.pdf
 
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024
 
Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
GenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationGenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day Presentation
 
Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationScaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organization
 
GenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdfGenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdf
 
Evaluating the top large language models.pdf
Evaluating the top large language models.pdfEvaluating the top large language models.pdf
Evaluating the top large language models.pdf
 
Artificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and MythsArtificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and Myths
 

Jeff Johnson: Psych 101: The Psychological Basis for UI Design Rules

  • 1. Psychological Basis for UI Design Rules Jeff Johnson UI Wizards, Inc. 1
  • 2. Many HCI researchers and practitioners have offered UI Design Guidelines 2
  • 3. UI Design Guidelines (Nielsen Molich, 1993) Visibility of system status  Match between system real world  User control freedom  Consistency standards  Error prevention  Recognition rather than recall  Flexibility efficiency of use  Aesthetic minimalist design  Help users recognize, diagnose, recover from errors  Provide online documentation help  3