Usability Overview

Transcript

1. UX Episode #10: Usability Overview Design and User Experience
2. • Introduction • What is usability? • Why is usability important? • Usability testing • Usability examples in PageUp • Wrap up Agenda
3. What is usability?
4. What is usability? Learnability Efficiency Memorability Errors Satisfaction
5. Why is usability important?
6. Why is it important? https://dilbert.com/strip/2018-05-02
7. Usability Testing
8. • Identify usability/flow issues • Understand what users are doing • Help prioritise the work • In/validate assumptions Why we do Usability Testing
9. • The beginning • The middle • The end Testing throughout the project When to do Usability Testing
10. • Reduce bias in design • Alignment on what to work on • Value delivery • Consistent reporting of usability testing ◦ Accurate task completion ◦ Increase in task completion rates ◦ Increase in customer satisfaction What does success look like if it’s done right?
11. 1. Get hold of some representative users 2. Ask the users to perform representative tasks 3. Observe what the users do How to improve usability through testing
12. Questions?
13. Usability examples in PageUp
14. UI patterns
15. User interface patterns are reusable/recurring components which designers use to solve common problems in software design. UI patterns
16. • Getting user’s inputs ◦ Input fields, Calendar picker, Forms • Navigation ◦ Tabs, Table of Content, Breadcrumb, Stepper • Dealing with data or content ◦ Dashboard, Search, Table, Cards • Social ◦ Comments, Share, Activity feeds • Onboarding ◦ Empty states, Tooltips, Popover, Skeleton loading UI patterns Categories
17. Breadcrumbs serve as an effective visual aid, indicating the location of the user within the website’s hierarchy, making them a great source of contextual information for landing pages. UI Pattern - Breadcrumb
18. Problem: The user needs to know their location in the module’s hierarchical structure in order to possibly browse back to a higher level in the hierarchy. Usability failure: Efficiency Solution: UI Pattern - Breadcrumb use case
19. UI Pattern - Breadcrumb
20. Interactions
21. User interaction is the design of the interaction between users and software. Eg: Infinite scroll, Sticky header, Auto save, Responsiveness, Feedback messages Interaction Design
22. Usability failure: Learnability Satisfaction
23. Accessibility
24. Inclusive Design Accessibility Usability Human Centred Design Good usability includes accessibility. Accessibility is usability applied thoroughly and in consideration of users who may not have the same physical or cognitive capabilities as your “average” user.
25. Disability Types
26. Color blindness Usability failure: Errors
27. Questions?
28. Thank You! #ux