SlideShare a Scribd company logo
1 of 24
•
•
•
PURPOSEPURPOSE
WHO IS LAURA HARLEY?
•
•
•
•
•
•
•
•
•
•
UX IS NOT INTERFACE DESIGN
•
•
•
UX stands for User Experience. It encompasses all aspects of the
end-user’s interaction with a company, its services, and products.
UX IS NOT INTERFACE DESIGN
•
•
•
•
UX is a major factor in successful software products.
UX IS NOT INTERFACE DESIGN
•
•
•
•
•
•
•
•
UX is a set of systematic activities in a process. The process
mirrors the software lifecycle process. UX does these things:
GOAL OF APPLICATION SOFTWARE?
WHAT IS USABILITY?
•
•
•
•
•
A quality of software that assesses how easy it is to use the
software.
WHAT MAKES AN INTUITIVE USER INTERFACE?
•
•
•
WHAT MAKES AN INTUITIVE USER INTERFACE?
•
•
•
WHY IS GOOD UX SO HARD?
Software systems are complex and abstract
Users typically don’t understand how programming, DBs, computers, networks
work.
Computer screen provides a 2D flat ‘information context’
• Tasks are complex, but screen provides a limited 2D visual space to convey
meaning.
• Trying to do work on a computer screen means working in an ‘abstract
context’ removed from the real world ‘work’ context.
WHY IS GOOD UX SO HARD?
People are complex and not abstract
• People are task and goal oriented, practical in trying to get work done
• Abstract thinking is more difficult than thinking in a concrete, real world task context
• Meaning is perceived through context (words change meaning given a context; 2D
screen terms often misconstrued or not recognized at all).
• People have ranges of knowledge, different motivations, different job roles and
focus. One software design can’t work for all without good knowledge of the user
and the tasks.
10 USABILITY PRINCIPLES OR GUIDELINES
1. Visibility of System Status
The system must always indicate to the user the system’s state.
State is indicated with visual, aural, verbal feedback, as appropriate for the state –
• Confirmation Msg – “Information Was Saved”
• Warning Msg -- “If you leave the page, your data will be lost.”
• “Ding!” [Computer sound]
• Visual, animated ‘Processing Spinner’ – System is taking time to process data
• Progress Indicator – How much of the process is complete?
• Visually Disabled Button – Grayed out, Button won’t respond, won’t function
10 USABILITY PRINCIPLES OR GUIDELINES
2. Match the System to User’s Mental Model
To the extent possible, reflect the context of the task and the user’s mental
model of the task in the software UI context.
• Use labels and terms common for the task, not software terms
• Mirror the user’s task flow, even if not optimal for the system
• Format information display as the user would expect for the task –
if “real world” task normally displays data in an accountant balance sheet,
recreate a balance sheet display in the software
10 USABILITY PRINCIPLES OR GUIDELINES
3. User Control and Freedom
The user should always feel in control of the system, not the other way around.
Users need a predictable world to feel “in control.”
• Users make mistakes, provide undo and reminders to “Save” data
• Provide auto-save or other recovery schemes (if the system fails)
• Label buttons and links to correctly set expectations
• Avoid controls that have two actions. Rule: one button, one action.
Dual action buttons “Save and Close” and “Accept and Continue” often confuse
users and/or create complexity.
10 USABILITY PRINCIPLES OR GUIDELINES
4. Consistency and Standards
Users should not have to guess the meaning of terms. Behavior across the system must be
consistent.
• One term, one meaning. One control, one behavior.
• It is difficult to maintain consistency of terms: across menus, button labels, tooltips, page
names, confirmation and error messages, help docs
• It is difficult to maintain consistency of behavior: tasks are complex, different steps
require different controls and outcomes, different developers work on different portions
of the system
• Review platform and device UI standards written by Google, Apple, Microsoft, Sun
Systems, W3C. – know the standards for the device = consistency
10 USABILITY PRINCIPLES OR GUIDELINES
5. Prevent Errors
Preventing errors is better usability than providing good error messages. Preventing is more
pleasant and satisfying than constantly being reminded that an action failed; it’s also more
efficient, quicker for the user to do and complete work
• Predictable labels on controls prevent errors.
• Consistent interactive behavior prevents errors.
• User control and Undo/Recovery prevent errors.
• Task flows that mirror the user’s mental model prevent errors.
10 USABILITY PRINCIPLES OR GUIDELINES
6. Recognition Rather Than Recall
Minimize the user’s need to memorize codes and commands.
• Make functions visible or easily discoverable (use menus, toolbars)
• Display menu options and let the user select from a list
• Make instructions easy to view and “sticky.” User controls the display.
• Visually indicate the data entry field with the invalid condition.
• Provide tooltips that define terms
• Provide tooltips to supplement button and control labels to better set expectations
10 USABILITY PRINCIPLES OR GUIDELINES
7. Flexibility and Efficiency
Provide adaptive and responsive user interfaces
New users and expert users require different “affordances” in the UI.
New users require more help, more instructions, less info density.
Expert users require accelerators, shortcuts, more info density.
• Don’t interrupt expert users with continual “Are you sure”” msgs.
• Provide “Preferences” for users to customize UI features
• Provide “Recents” so users can return to prior work quickly
• Provide keyboard shortcuts for frequently used actions
10 USABILITY PRINCIPLES OR GUIDELINES
8. Aesthetics and Minimal Design
Reduce the cognitive load on the user
• Provide only relevant information -- avoid polite words, adjectives.
• Use simple, informal language.
• Every extra word, icon or photo requires processing by the user.
• Clutter is anything the user deems irrelevant for the task/goal.
• Minimal design requires knowing the user and the user’s task domain extremely well.
10 USABILITY PRINCIPLES OR GUIDELINES
9. Help Users Recognize, Diagnose and Recover from Errors
Write good error messages
• State that an error has occurred in plain language, no codes
• Avoid terms like “kill,” “die,” “fatal error” – don’t scare the user
• Explain why the error occurred, in non-computer jargon
• Provide solutions to remediate the problem
• Provide someone to contact, if all else fails.
• Provide error code at the end, if needed for help desk
10 USABILITY PRINCIPLES OR GUIDELINES
10. Help, Documentation, Training
• If a system is intuitive, it requires little documentation.
• Users have different knowledge and abilities, however.
• Provide tooltips, in-context help in the UI, especially to identify functions and provide a
full description for a label.
• If separate Help or Documentation is needed, it must be searchable, especially for tasks
and doing work
• User Help must focus on user tasks: how the user should use the system to accomplish
tasks or do work. User help isn’t a system guide.
• Research shows that most users (75-85%) never use external help or documentation.
SOURCES OF INFORMATION
Usability 101 - Definition of Usability - Nielsen Norman Group
https://www.nngroup.com/articles/usability-101-introduction-to-usability/
10 Usability Heuristics for User Interface Design - Jakob Nielsen
https://www.designprinciplesftw.com/collections/10-usability-heuristics-for-user-interface-design
User Experience Design - Peter Morville
http://semanticstudios.com/user_experience_design/
Elements of User Experience - Jesse James Garrett
http://uxdesign.com/assets/Elements-of-User-Experience.pdf
The What and Why of Usability
https://www.usability.gov/
Questions?

More Related Content

What's hot

User interface design
User interface designUser interface design
User interface designSlideshare
 
Types of User interface
Types of User interfaceTypes of User interface
Types of User interfaceUtsavMandaviya
 
User Experience Design for Software Engineers, ICS & The Qt Company
User Experience Design for Software Engineers, ICS & The Qt CompanyUser Experience Design for Software Engineers, ICS & The Qt Company
User Experience Design for Software Engineers, ICS & The Qt CompanyQt
 
Human Computer Interaction Chapter 2
Human Computer Interaction Chapter 2Human Computer Interaction Chapter 2
Human Computer Interaction Chapter 2syxf10
 
Mobile User Experience - @iRajLal
Mobile User Experience - @iRajLalMobile User Experience - @iRajLal
Mobile User Experience - @iRajLalRaj Lal
 
User Interface Design - Module 1 Introduction
User Interface Design - Module 1 IntroductionUser Interface Design - Module 1 Introduction
User Interface Design - Module 1 IntroductionbrindaN
 
Eindpresentatie usability engels
Eindpresentatie usability engelsEindpresentatie usability engels
Eindpresentatie usability engelsHanzehogeschool
 
Many Devices, One Standard: Mobile Accessibility with WCAG 2.1
Many Devices, One Standard: Mobile Accessibility with WCAG 2.1Many Devices, One Standard: Mobile Accessibility with WCAG 2.1
Many Devices, One Standard: Mobile Accessibility with WCAG 2.1Interactive Accessibility
 
WRITE CLEAR TEXT AND MESSAGES
WRITE CLEAR TEXT AND MESSAGESWRITE CLEAR TEXT AND MESSAGES
WRITE CLEAR TEXT AND MESSAGESDhanya LK
 
User interface webpage
User interface webpageUser interface webpage
User interface webpagedhaval_tare
 
10 Usability Heuristics explained
10 Usability Heuristics explained10 Usability Heuristics explained
10 Usability Heuristics explainedCraft Design
 
Megan McKeever - design
Megan McKeever - designMegan McKeever - design
Megan McKeever - designmmm5014
 
Usability Testing - Sivaprasath Selvaraj
Usability Testing - Sivaprasath SelvarajUsability Testing - Sivaprasath Selvaraj
Usability Testing - Sivaprasath SelvarajSivaprasath Selvaraj
 
Smartphone Heuristics
Smartphone HeuristicsSmartphone Heuristics
Smartphone HeuristicsKathy Gill
 

What's hot (20)

User interface design
User interface designUser interface design
User interface design
 
Types of User interface
Types of User interfaceTypes of User interface
Types of User interface
 
User Experience Design for Software Engineers, ICS & The Qt Company
User Experience Design for Software Engineers, ICS & The Qt CompanyUser Experience Design for Software Engineers, ICS & The Qt Company
User Experience Design for Software Engineers, ICS & The Qt Company
 
Human Computer Interaction Chapter 2
Human Computer Interaction Chapter 2Human Computer Interaction Chapter 2
Human Computer Interaction Chapter 2
 
Mobile User Experience - @iRajLal
Mobile User Experience - @iRajLalMobile User Experience - @iRajLal
Mobile User Experience - @iRajLal
 
User Interface Design - Module 1 Introduction
User Interface Design - Module 1 IntroductionUser Interface Design - Module 1 Introduction
User Interface Design - Module 1 Introduction
 
Heuristic ux-evaluation
Heuristic ux-evaluationHeuristic ux-evaluation
Heuristic ux-evaluation
 
IntrIntroduction
IntrIntroductionIntrIntroduction
IntrIntroduction
 
Eindpresentatie usability engels
Eindpresentatie usability engelsEindpresentatie usability engels
Eindpresentatie usability engels
 
Unit2 hci
Unit2 hciUnit2 hci
Unit2 hci
 
Many Devices, One Standard: Mobile Accessibility with WCAG 2.1
Many Devices, One Standard: Mobile Accessibility with WCAG 2.1Many Devices, One Standard: Mobile Accessibility with WCAG 2.1
Many Devices, One Standard: Mobile Accessibility with WCAG 2.1
 
WRITE CLEAR TEXT AND MESSAGES
WRITE CLEAR TEXT AND MESSAGESWRITE CLEAR TEXT AND MESSAGES
WRITE CLEAR TEXT AND MESSAGES
 
User interface webpage
User interface webpageUser interface webpage
User interface webpage
 
10 Usability Heuristics Explained
10 Usability Heuristics Explained10 Usability Heuristics Explained
10 Usability Heuristics Explained
 
10 Usability Heuristics explained
10 Usability Heuristics explained10 Usability Heuristics explained
10 Usability Heuristics explained
 
Graphical User Interface
Graphical User InterfaceGraphical User Interface
Graphical User Interface
 
Megan McKeever - design
Megan McKeever - designMegan McKeever - design
Megan McKeever - design
 
Usability Testing - Sivaprasath Selvaraj
Usability Testing - Sivaprasath SelvarajUsability Testing - Sivaprasath Selvaraj
Usability Testing - Sivaprasath Selvaraj
 
Smartphone Heuristics
Smartphone HeuristicsSmartphone Heuristics
Smartphone Heuristics
 
Chapter 4 interaction design
Chapter 4 interaction designChapter 4 interaction design
Chapter 4 interaction design
 

Similar to UX Principles and Practice

Ten Usability Heuristics by Jakob Nielsen.pptx
Ten Usability Heuristics by Jakob Nielsen.pptxTen Usability Heuristics by Jakob Nielsen.pptx
Ten Usability Heuristics by Jakob Nielsen.pptxsharmiladevi941
 
UDSA Unit 4.pptx
UDSA Unit 4.pptxUDSA Unit 4.pptx
UDSA Unit 4.pptxSrilekhaK12
 
Introduction to User Experience Design for Engineers
Introduction to User Experience Design for EngineersIntroduction to User Experience Design for Engineers
Introduction to User Experience Design for EngineersICS
 
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 uiThanos Makaronas
 
Assessing the quality of usability
Assessing the quality of usabilityAssessing the quality of usability
Assessing the quality of usabilityAditya Karle
 
Game interface design part 2
Game interface design part 2Game interface design part 2
Game interface design part 2Durgesh Pandey
 
Design process design rules
Design process  design rulesDesign process  design rules
Design process design rulesPreeti Mishra
 
Evaluating User Interfaces
Evaluating User InterfacesEvaluating User Interfaces
Evaluating User InterfacesNancy Jain
 
Multi Platform User Exerience
Multi Platform User ExerienceMulti Platform User Exerience
Multi Platform User ExerienceTanya Zavialova
 
Design Theory - Ankur Sharma - Presentation
Design Theory - Ankur Sharma - PresentationDesign Theory - Ankur Sharma - Presentation
Design Theory - Ankur Sharma - PresentationMobileNepal
 
Usability Workshop at Lillebaelt Academy
Usability Workshop at Lillebaelt AcademyUsability Workshop at Lillebaelt Academy
Usability Workshop at Lillebaelt AcademyDániel Góré
 
SenchaCon 2016: Accessibility, Teamwork & Ext JS: A Customer Success Story - ...
SenchaCon 2016: Accessibility, Teamwork & Ext JS: A Customer Success Story - ...SenchaCon 2016: Accessibility, Teamwork & Ext JS: A Customer Success Story - ...
SenchaCon 2016: Accessibility, Teamwork & Ext JS: A Customer Success Story - ...Sencha
 
Lecturvxxxxxxxxxxxxxxxxxxxxxxxxe 17.pptx
Lecturvxxxxxxxxxxxxxxxxxxxxxxxxe 17.pptxLecturvxxxxxxxxxxxxxxxxxxxxxxxxe 17.pptx
Lecturvxxxxxxxxxxxxxxxxxxxxxxxxe 17.pptxaliyafatimauwu
 
ASSESSING THE QUALITY OF USABILTY
ASSESSING THE QUALITY OF USABILTYASSESSING THE QUALITY OF USABILTY
ASSESSING THE QUALITY OF USABILTYRadhika Dilip Kale
 
HCI Unit 3.pptx
HCI Unit 3.pptxHCI Unit 3.pptx
HCI Unit 3.pptxRaja980775
 
Intro to user experience design
Intro to user experience designIntro to user experience design
Intro to user experience designyaluna
 
Introductiontousability 090407053727-phpapp02
Introductiontousability 090407053727-phpapp02Introductiontousability 090407053727-phpapp02
Introductiontousability 090407053727-phpapp02Techved Consulting
 
Usability Evaluation
Usability EvaluationUsability Evaluation
Usability EvaluationSaqib Shehzad
 

Similar to UX Principles and Practice (20)

Ten Usability Heuristics by Jakob Nielsen.pptx
Ten Usability Heuristics by Jakob Nielsen.pptxTen Usability Heuristics by Jakob Nielsen.pptx
Ten Usability Heuristics by Jakob Nielsen.pptx
 
UDSA Unit 4.pptx
UDSA Unit 4.pptxUDSA Unit 4.pptx
UDSA Unit 4.pptx
 
Introduction to User Experience Design for Engineers
Introduction to User Experience Design for EngineersIntroduction to User Experience Design for Engineers
Introduction to User Experience Design for Engineers
 
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
 
Assessing the quality of usability
Assessing the quality of usabilityAssessing the quality of usability
Assessing the quality of usability
 
Game interface design part 2
Game interface design part 2Game interface design part 2
Game interface design part 2
 
Design process design rules
Design process  design rulesDesign process  design rules
Design process design rules
 
Evaluating User Interfaces
Evaluating User InterfacesEvaluating User Interfaces
Evaluating User Interfaces
 
Multi Platform User Exerience
Multi Platform User ExerienceMulti Platform User Exerience
Multi Platform User Exerience
 
Design Theory - Ankur Sharma - Presentation
Design Theory - Ankur Sharma - PresentationDesign Theory - Ankur Sharma - Presentation
Design Theory - Ankur Sharma - Presentation
 
Usability Workshop at Lillebaelt Academy
Usability Workshop at Lillebaelt AcademyUsability Workshop at Lillebaelt Academy
Usability Workshop at Lillebaelt Academy
 
SenchaCon 2016: Accessibility, Teamwork & Ext JS: A Customer Success Story - ...
SenchaCon 2016: Accessibility, Teamwork & Ext JS: A Customer Success Story - ...SenchaCon 2016: Accessibility, Teamwork & Ext JS: A Customer Success Story - ...
SenchaCon 2016: Accessibility, Teamwork & Ext JS: A Customer Success Story - ...
 
Lecturvxxxxxxxxxxxxxxxxxxxxxxxxe 17.pptx
Lecturvxxxxxxxxxxxxxxxxxxxxxxxxe 17.pptxLecturvxxxxxxxxxxxxxxxxxxxxxxxxe 17.pptx
Lecturvxxxxxxxxxxxxxxxxxxxxxxxxe 17.pptx
 
Hci lec 5,6
Hci lec 5,6Hci lec 5,6
Hci lec 5,6
 
ASSESSING THE QUALITY OF USABILTY
ASSESSING THE QUALITY OF USABILTYASSESSING THE QUALITY OF USABILTY
ASSESSING THE QUALITY OF USABILTY
 
User Support
User SupportUser Support
User Support
 
HCI Unit 3.pptx
HCI Unit 3.pptxHCI Unit 3.pptx
HCI Unit 3.pptx
 
Intro to user experience design
Intro to user experience designIntro to user experience design
Intro to user experience design
 
Introductiontousability 090407053727-phpapp02
Introductiontousability 090407053727-phpapp02Introductiontousability 090407053727-phpapp02
Introductiontousability 090407053727-phpapp02
 
Usability Evaluation
Usability EvaluationUsability Evaluation
Usability Evaluation
 

Recently uploaded

Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Miguel Araújo
 
Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...
Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...
Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...shyamraj55
 
Unblocking The Main Thread Solving ANRs and Frozen Frames
Unblocking The Main Thread Solving ANRs and Frozen FramesUnblocking The Main Thread Solving ANRs and Frozen Frames
Unblocking The Main Thread Solving ANRs and Frozen FramesSinan KOZAK
 
Understanding the Laravel MVC Architecture
Understanding the Laravel MVC ArchitectureUnderstanding the Laravel MVC Architecture
Understanding the Laravel MVC ArchitecturePixlogix Infotech
 
08448380779 Call Girls In Civil Lines Women Seeking Men
08448380779 Call Girls In Civil Lines Women Seeking Men08448380779 Call Girls In Civil Lines Women Seeking Men
08448380779 Call Girls In Civil Lines Women Seeking MenDelhi Call girls
 
08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking MenDelhi Call girls
 
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 Servicegiselly40
 
Enhancing Worker Digital Experience: A Hands-on Workshop for Partners
Enhancing Worker Digital Experience: A Hands-on Workshop for PartnersEnhancing Worker Digital Experience: A Hands-on Workshop for Partners
Enhancing Worker Digital Experience: A Hands-on Workshop for PartnersThousandEyes
 
A Call to Action for Generative AI in 2024
A Call to Action for Generative AI in 2024A Call to Action for Generative AI in 2024
A Call to Action for Generative AI in 2024Results
 
The Codex of Business Writing Software for Real-World Solutions 2.pptx
The Codex of Business Writing Software for Real-World Solutions 2.pptxThe Codex of Business Writing Software for Real-World Solutions 2.pptx
The Codex of Business Writing Software for Real-World Solutions 2.pptxMalak Abu Hammad
 
Slack Application Development 101 Slides
Slack Application Development 101 SlidesSlack Application Development 101 Slides
Slack Application Development 101 Slidespraypatel2
 
Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...
Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...
Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...Neo4j
 
SQL Database Design For Developers at php[tek] 2024
SQL Database Design For Developers at php[tek] 2024SQL Database Design For Developers at php[tek] 2024
SQL Database Design For Developers at php[tek] 2024Scott Keck-Warren
 
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdfThe Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdfEnterprise Knowledge
 
My Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 PresentationMy Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 PresentationRidwan Fadjar
 
08448380779 Call Girls In Greater Kailash - I Women Seeking Men
08448380779 Call Girls In Greater Kailash - I Women Seeking Men08448380779 Call Girls In Greater Kailash - I Women Seeking Men
08448380779 Call Girls In Greater Kailash - I Women Seeking MenDelhi Call girls
 
#StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
#StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024#StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
#StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024BookNet Canada
 
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 RobisonAnna Loughnan Colquhoun
 
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.pptxHampshireHUG
 
How to convert PDF to text with Nanonets
How to convert PDF to text with NanonetsHow to convert PDF to text with Nanonets
How to convert PDF to text with Nanonetsnaman860154
 

Recently uploaded (20)

Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
 
Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...
Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...
Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...
 
Unblocking The Main Thread Solving ANRs and Frozen Frames
Unblocking The Main Thread Solving ANRs and Frozen FramesUnblocking The Main Thread Solving ANRs and Frozen Frames
Unblocking The Main Thread Solving ANRs and Frozen Frames
 
Understanding the Laravel MVC Architecture
Understanding the Laravel MVC ArchitectureUnderstanding the Laravel MVC Architecture
Understanding the Laravel MVC Architecture
 
08448380779 Call Girls In Civil Lines Women Seeking Men
08448380779 Call Girls In Civil Lines Women Seeking Men08448380779 Call Girls In Civil Lines Women Seeking Men
08448380779 Call Girls In Civil Lines Women Seeking Men
 
08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men
 
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
 
Enhancing Worker Digital Experience: A Hands-on Workshop for Partners
Enhancing Worker Digital Experience: A Hands-on Workshop for PartnersEnhancing Worker Digital Experience: A Hands-on Workshop for Partners
Enhancing Worker Digital Experience: A Hands-on Workshop for Partners
 
A Call to Action for Generative AI in 2024
A Call to Action for Generative AI in 2024A Call to Action for Generative AI in 2024
A Call to Action for Generative AI in 2024
 
The Codex of Business Writing Software for Real-World Solutions 2.pptx
The Codex of Business Writing Software for Real-World Solutions 2.pptxThe Codex of Business Writing Software for Real-World Solutions 2.pptx
The Codex of Business Writing Software for Real-World Solutions 2.pptx
 
Slack Application Development 101 Slides
Slack Application Development 101 SlidesSlack Application Development 101 Slides
Slack Application Development 101 Slides
 
Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...
Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...
Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...
 
SQL Database Design For Developers at php[tek] 2024
SQL Database Design For Developers at php[tek] 2024SQL Database Design For Developers at php[tek] 2024
SQL Database Design For Developers at php[tek] 2024
 
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdfThe Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
 
My Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 PresentationMy Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 Presentation
 
08448380779 Call Girls In Greater Kailash - I Women Seeking Men
08448380779 Call Girls In Greater Kailash - I Women Seeking Men08448380779 Call Girls In Greater Kailash - I Women Seeking Men
08448380779 Call Girls In Greater Kailash - I Women Seeking Men
 
#StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
#StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024#StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
#StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
 
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
 
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
 
How to convert PDF to text with Nanonets
How to convert PDF to text with NanonetsHow to convert PDF to text with Nanonets
How to convert PDF to text with Nanonets
 

UX Principles and Practice

  • 3. WHO IS LAURA HARLEY? • • • • • • • • • •
  • 4. UX IS NOT INTERFACE DESIGN • • • UX stands for User Experience. It encompasses all aspects of the end-user’s interaction with a company, its services, and products.
  • 5. UX IS NOT INTERFACE DESIGN • • • • UX is a major factor in successful software products.
  • 6. UX IS NOT INTERFACE DESIGN • • • • • • • • UX is a set of systematic activities in a process. The process mirrors the software lifecycle process. UX does these things:
  • 8. WHAT IS USABILITY? • • • • • A quality of software that assesses how easy it is to use the software.
  • 9. WHAT MAKES AN INTUITIVE USER INTERFACE? • • •
  • 10. WHAT MAKES AN INTUITIVE USER INTERFACE? • • •
  • 11. WHY IS GOOD UX SO HARD? Software systems are complex and abstract Users typically don’t understand how programming, DBs, computers, networks work. Computer screen provides a 2D flat ‘information context’ • Tasks are complex, but screen provides a limited 2D visual space to convey meaning. • Trying to do work on a computer screen means working in an ‘abstract context’ removed from the real world ‘work’ context.
  • 12. WHY IS GOOD UX SO HARD? People are complex and not abstract • People are task and goal oriented, practical in trying to get work done • Abstract thinking is more difficult than thinking in a concrete, real world task context • Meaning is perceived through context (words change meaning given a context; 2D screen terms often misconstrued or not recognized at all). • People have ranges of knowledge, different motivations, different job roles and focus. One software design can’t work for all without good knowledge of the user and the tasks.
  • 13. 10 USABILITY PRINCIPLES OR GUIDELINES 1. Visibility of System Status The system must always indicate to the user the system’s state. State is indicated with visual, aural, verbal feedback, as appropriate for the state – • Confirmation Msg – “Information Was Saved” • Warning Msg -- “If you leave the page, your data will be lost.” • “Ding!” [Computer sound] • Visual, animated ‘Processing Spinner’ – System is taking time to process data • Progress Indicator – How much of the process is complete? • Visually Disabled Button – Grayed out, Button won’t respond, won’t function
  • 14. 10 USABILITY PRINCIPLES OR GUIDELINES 2. Match the System to User’s Mental Model To the extent possible, reflect the context of the task and the user’s mental model of the task in the software UI context. • Use labels and terms common for the task, not software terms • Mirror the user’s task flow, even if not optimal for the system • Format information display as the user would expect for the task – if “real world” task normally displays data in an accountant balance sheet, recreate a balance sheet display in the software
  • 15. 10 USABILITY PRINCIPLES OR GUIDELINES 3. User Control and Freedom The user should always feel in control of the system, not the other way around. Users need a predictable world to feel “in control.” • Users make mistakes, provide undo and reminders to “Save” data • Provide auto-save or other recovery schemes (if the system fails) • Label buttons and links to correctly set expectations • Avoid controls that have two actions. Rule: one button, one action. Dual action buttons “Save and Close” and “Accept and Continue” often confuse users and/or create complexity.
  • 16. 10 USABILITY PRINCIPLES OR GUIDELINES 4. Consistency and Standards Users should not have to guess the meaning of terms. Behavior across the system must be consistent. • One term, one meaning. One control, one behavior. • It is difficult to maintain consistency of terms: across menus, button labels, tooltips, page names, confirmation and error messages, help docs • It is difficult to maintain consistency of behavior: tasks are complex, different steps require different controls and outcomes, different developers work on different portions of the system • Review platform and device UI standards written by Google, Apple, Microsoft, Sun Systems, W3C. – know the standards for the device = consistency
  • 17. 10 USABILITY PRINCIPLES OR GUIDELINES 5. Prevent Errors Preventing errors is better usability than providing good error messages. Preventing is more pleasant and satisfying than constantly being reminded that an action failed; it’s also more efficient, quicker for the user to do and complete work • Predictable labels on controls prevent errors. • Consistent interactive behavior prevents errors. • User control and Undo/Recovery prevent errors. • Task flows that mirror the user’s mental model prevent errors.
  • 18. 10 USABILITY PRINCIPLES OR GUIDELINES 6. Recognition Rather Than Recall Minimize the user’s need to memorize codes and commands. • Make functions visible or easily discoverable (use menus, toolbars) • Display menu options and let the user select from a list • Make instructions easy to view and “sticky.” User controls the display. • Visually indicate the data entry field with the invalid condition. • Provide tooltips that define terms • Provide tooltips to supplement button and control labels to better set expectations
  • 19. 10 USABILITY PRINCIPLES OR GUIDELINES 7. Flexibility and Efficiency Provide adaptive and responsive user interfaces New users and expert users require different “affordances” in the UI. New users require more help, more instructions, less info density. Expert users require accelerators, shortcuts, more info density. • Don’t interrupt expert users with continual “Are you sure”” msgs. • Provide “Preferences” for users to customize UI features • Provide “Recents” so users can return to prior work quickly • Provide keyboard shortcuts for frequently used actions
  • 20. 10 USABILITY PRINCIPLES OR GUIDELINES 8. Aesthetics and Minimal Design Reduce the cognitive load on the user • Provide only relevant information -- avoid polite words, adjectives. • Use simple, informal language. • Every extra word, icon or photo requires processing by the user. • Clutter is anything the user deems irrelevant for the task/goal. • Minimal design requires knowing the user and the user’s task domain extremely well.
  • 21. 10 USABILITY PRINCIPLES OR GUIDELINES 9. Help Users Recognize, Diagnose and Recover from Errors Write good error messages • State that an error has occurred in plain language, no codes • Avoid terms like “kill,” “die,” “fatal error” – don’t scare the user • Explain why the error occurred, in non-computer jargon • Provide solutions to remediate the problem • Provide someone to contact, if all else fails. • Provide error code at the end, if needed for help desk
  • 22. 10 USABILITY PRINCIPLES OR GUIDELINES 10. Help, Documentation, Training • If a system is intuitive, it requires little documentation. • Users have different knowledge and abilities, however. • Provide tooltips, in-context help in the UI, especially to identify functions and provide a full description for a label. • If separate Help or Documentation is needed, it must be searchable, especially for tasks and doing work • User Help must focus on user tasks: how the user should use the system to accomplish tasks or do work. User help isn’t a system guide. • Research shows that most users (75-85%) never use external help or documentation.
  • 23. SOURCES OF INFORMATION Usability 101 - Definition of Usability - Nielsen Norman Group https://www.nngroup.com/articles/usability-101-introduction-to-usability/ 10 Usability Heuristics for User Interface Design - Jakob Nielsen https://www.designprinciplesftw.com/collections/10-usability-heuristics-for-user-interface-design User Experience Design - Peter Morville http://semanticstudios.com/user_experience_design/ Elements of User Experience - Jesse James Garrett http://uxdesign.com/assets/Elements-of-User-Experience.pdf The What and Why of Usability https://www.usability.gov/