Practical usability - Making your apps better
•Download as PPTX, PDF•
0 likes•913 views
Presentation I did on making Android apps more usable and getting started with material design.
Recommended
Recommended
More Related Content
What's hot
What's hot (20)
Similar to Practical usability - Making your apps better
Similar to Practical usability - Making your apps better (20)
Recently uploaded
Recently uploaded (20)
Practical usability - Making your apps better
- 1. Android app usability Riaan Cornelius a.k.a Making an app useful
- 2. Topics Because nobody likes a surprise 2 • A quick intro to usability • What, Why, How andWhen? • Usability Heuristics • Quick intro to the design process • Let’s come up with some requirements for an app • A look at existing apps • Designing a new app • Requirements • Prototyping it • Testing it
- 3. What is usability 3 Usability is the ease of use and learnability of a human-made object. Usability includes methods of measuring usability, such as needs analysis and the study of the principles behind an object's perceived efficiency or elegance. In human-computer interaction and computer science, usability studies the elegance and clarity with which the interaction with a computer program or a web site is designed. Definition on Wikipedia
- 4. What is usability The 5 quality components 4 Usability is defined by 5 quality components: • Learnability • Efficiency • Memorability • Errors • Satisfaction
- 5. What is usability Quality metrics 5 Usability and utility are equally important. To study a design's utility, you can use the same user research methods that improve usability. Utility = whether it provides the features you need. Usability = how easy & pleasant these features are to use. Useful = usability + utility.
- 6. Why is usability important? Quality metrics 6 Usability is a necessary condition for survival. If an app is difficult to use, people uninstall. If users get lost in an app, they uninstall. If an apps information is hard to read or doesn't answer users' key questions, they uninstall.
- 7. How do we improve usability? Through hard work 7 Most basic and useful method: User testing. User testing has 3 components: 1. Find users 2. Let them do stuff 3. Observe them doing stuff Shut up and let the users do the talking.
- 8. How do we improve usability? Through hard work 8 Testing 5 users is typically enough to identify worst usability issues. Rather than 1 big study, do lots of small tests and fix issues between every test. The more interface ideas you test with users, the better. Iterative design is the best way to increase UX quality.
- 9. When do we look at usability? Short answer? Always! 9 Usability plays a role in each stage of the design process. Here are the main steps: • Before starting the new design, test the old design. • Test your competitors' designs. • Conduct a field study to see how users behave in their natural habitat. • Make paper prototypes of one or more new design ideas and test them. • Refine the design ideas that test best through multiple iterations • Inspect the design relative to established usability guidelines • Once you decide on and implement the final design, test it again.
- 10. Usability heuristics What we use to rate an app 10 Jakob Nielsen's 10 general principles for interaction design. They are called "heuristics" because they are broad rules of thumb and not specific usability guidelines. • Visibility of system status • Match between system and the real world • User control and freedom • Consistency and standards • Error prevention • Recognition rather than recall • Flexibility and efficiency of use • Aesthetic and minimalist design • Help users recognize, diagnose, and recover from errors • Help and documentation
- 11. When do we look at usability? The cold hard truth 11 I know what you’re thinking…
- 12. So, let’s design an app Requirements 12 What would a load shedding app need? • I need some help for this part
- 13. Let’s look at the competition Some existing apps 13 Relevant apps in top 25 when searching ‘Load Shedding’ • * GridWatch - Load Shedding (News24): 100k – 500k Downloads (4.3 Stars) • * Loadshedding CapeTown: 1k – 5k Downloads (4.2 Stars) • Load Shed Sched: 1k – 5k Downloads (4.2 Stars) • * Load Shedding Notifier (Sharenet): 10k – 50k Downloads (4.2 Stars) • Load Shedding Alert: 10k – 50k Downloads (4.1 Stars) • Load Shedding Notifier: 5k – 10k Downloads (4.1 Stars) • * SA Loadshed: 1k – 5k Downloads (3.9 Stars) • ShedAlert load shedding alerts: 10k – 50k Downloads (3.8 Stars) • Blackout: 500 – 1000 Downloads (3.6 Stars) • * Loadshed: 5k – 10k Downloads (3.3 Stars) • Load Shedding Schedules SA: 10k – 50k Downloads (2.9 Stars) • MyEskom (Eskom): 10k – 50k Downloads (2.8 Stars) • * Loadshedding SA: 5k – 10k Downloads (2.8 Stars) • Load Shedding SA: 10k – 50k Downloads (2.7 Stars)
- 14. Gridwatch – Load Shedding 100k – 500k Downloads (4.3 Stars) 14
- 15. Load Shedding CapeTown 1k – 5k Downloads (4.2 Stars) 15
- 16. Load Shedding Notifier 10k – 50k Downloads (4.2 Stars) 16
- 17. SA Loadshed 1k – 5k Downloads (3.9 Stars) 17
- 18. Loadshed 5k – 10k Downloads (3.3 Stars) 18
- 19. Loadshedding SA 5k – 10k Downloads (2.8 Stars) 19
- 20. So, let’s design an app Requirements 20 What would a load shedding app need? • Current load shedding status • Choose an area you are interested in • Multiple areas? • How about detecting your location and narrowing it down? • Maybe even detect my zone / region based on power outages? • Show load shedding times for my area • What about for the next week? • Push notifications • Countdown to start / end of load shedding? • Power utility contact details • Social media (Twitter, etc) for Eskom / power utility
- 21. So, let’s design an app Requirements 21 What about other usability issues? • How do you keep all schedules updated? • Which areas do you support? • Performance? • Updates? • App size?
- 22. Prototyping Make it real 22 Low fidelity: • Paper • Prototype On Paper (POP) • Balsamiq High fidelity • Photoshop • InDesign • InVisionApp • Axure RP Pro
- 23. Prototyping Make it real 23 Prototype On Paper (POP)
- 24. Demo Let’s see some prototypes 24 Demonstration http://invis.io/262VK87TU
- 25. 25 Questions? References: UsabilityWikipedia page: http://en.wikipedia.org/wiki/Usability Nielsen’s Usability 101: http://www.nngroup.com/articles/usability-101-introduction-to-usability/ Nielsen’sTop 10 Usability Heuristics: http://www.nngroup.com/articles/ten-usability-heuristics/ Prototyping: http://www.nngroup.com/courses/wireframing-and-prototyping/ Protoype On Paper: https://popapp.in/ Invision: http://www.invisionapp.com/ Material DesignTemplates: http://www.okilla.com/search.php?s=material+design Axure RP Pro: http://www.axure.com/ Axure Library: http://www.axure.com/c/forum/tips-tricks-examples/14842-material-design-axure-library.html
- 26. Reference: Load Shedding Apps Some existing apps 26 * GridWatch - Load Shedding (News24): https://play.google.com/store/apps/details?id=com.news24.loadshedding * Loadshedding CapeTown: https://play.google.com/store/apps/details?id=com.loadshedding.capetown Load Shed Sched: https://play.google.com/store/apps/details?id=za.co.antix.loadshedsched * Load Shedding Notifier (Sharenet): https://play.google.com/store/apps/details?id=com.uk.sharenet.loadshedding Load Shedding Alert: https://play.google.com/store/apps/details?id=com.bitzulu.loadsheddingalert Load Shedding Notifier: https://play.google.com/store/apps/details?id=com.abisoft.loadsheddingnotifier * SA Loadshed: https://play.google.com/store/apps/details?id=com.stoneagetechnologies.saloadshed * ShedAlert load shedding alerts: https://play.google.com/store/apps/details?id=com.ionicframework.clunk534363 Blackout: https://play.google.com/store/apps/details?id=com.rbg.loadshed * Loadshed: https://play.google.com/store/apps/details?id=com.ionicframework.loadshed186899 Load Shedding Schedules SA: https://play.google.com/store/apps/details?id=com.ionicframework.loadshedder235300 MyEskom (Eskom): https://play.google.com/store/apps/details?id=com.za.fogg.eskom.myeskom * Loadshedding SA: https://play.google.com/store/apps/details?id=co.rezonet.loadsheddingsa Load Shedding SA: https://play.google.com/store/apps/details?id=loadsheddingsa.darkwater.com.loadsheddingsa
Editor's Notes
- Usability is a quality attribute that assesses how easy user interfaces are to use. Learnability: How easy is it for users to accomplish basic tasks the first time they encounter the design? Efficiency: Once users have learned the design, how quickly can they perform tasks? Memorability: When users return to the design after a period of not using it, how easily can they reestablish proficiency? Errors: How many errors do users make, how severe are these errors, and how easily can they recover from the errors? Satisfaction: How pleasant is it to use the design?
- There are many other important quality attributes. A key one is utility, which refers to the design's functionality: Does it do what users need? Usability and utility are equally important and together determine whether something is useful: It matters little that something is easy if it's not what you want. It's also no good if the system can hypothetically do what you want, but you can't make it happen because the user interface is too difficult.
- Note a pattern here? There's no such thing as a user reading a manual or otherwise spending much time trying to figure out an interface. There are plenty of other apps available; uninstalling is the first line of defense when users encounter a difficulty.
- There are many methods for studying usability, but the most basic and useful is user testing, which has 3 components: - Get hold of some representative users - Ask the users to perform representative tasks with the design. - Observe what the users do, where they succeed, and where they have difficulties with the user interface. Shut up and let the users do the talking.
- To identify a design's most important usability problems, testing 5 users is typically enough. Rather than run a big, expensive study, it's a better use of resources to run many small tests and revise the design between each one so you can fix the usability flaws as you identify them. Iterative design is the best way to increase the quality of user experience. The more versions and interface ideas you test with users, the better. User testing is different from focus groups, which are a poor way of evaluating design usability. To evaluate interaction designs you must closely observe individual users as they perform tasks with the user interface. Listening to what people say is misleading: you have to watch what they actually do.
- Usability plays a role in each stage of the design process. The resulting need for multiple studies is one reason I recommend making individual studies fast and cheap. Here are the main steps: - Before starting the new design, test the old design to identify the good parts that you should keep or emphasize, and the bad parts that give users trouble. - Test your competitors' designs to get cheap data on a range of alternative interfaces that have similar features to your own. - Conduct a field study to see how users behave in their natural habitat. - Make paper prototypes of one or more new design ideas and test them. The less time you invest in these design ideas the better, because you'll need to change them all based on the test results. - Refine the design ideas that test best through multiple iterations, gradually moving from low-fidelity prototyping to high-fidelity representations that run on the computer. Test each iteration. - Inspect the design relative to established usability guidelines whether from your own earlier studies or published research. Once you decide on and implement the final design, test it again. Subtle usability problems always creep in during implementation.
- Visibility of system status The system should always keep users informed about what is going on, through appropriate feedback within reasonable time. Match between system and the real world The system should speak the users' language, with words, phrases and concepts familiar to the user, rather than system-oriented terms. Follow real-world conventions, making information appear in a natural and logical order. User control and freedom Users often choose system functions by mistake and will need a clearly marked "emergency exit" to leave the unwanted state without having to go through an extended dialogue. Support undo and redo. Consistency and standards Users should not have to wonder whether different words, situations, or actions mean the same thing. Follow platform conventions. Error prevention Even better than good error messages is a careful design which prevents a problem from occurring in the first place. Either eliminate error-prone conditions or check for them and present users with a confirmation option before they commit to the action. Recognition rather than recall Minimize the user's memory load by making objects, actions, and options visible. The user should not have to remember information from one part of the dialogue to another. Instructions for use of the system should be visible or easily retrievable whenever appropriate. (Read full article on recognition vs. recall in UX.) Flexibility and efficiency of use Accelerators -- unseen by the novice user -- may often speed up the interaction for the expert user such that the system can cater to both inexperienced and experienced users. Allow users to tailor frequent actions. Aesthetic and minimalist design Dialogues should not contain information which is irrelevant or rarely needed. Every extra unit of information in a dialogue competes with the relevant units of information and diminishes their relative visibility. Help users recognize, diagnose, and recover from errors Error messages should be expressed in plain language (no codes), precisely indicate the problem, and constructively suggest a solution. Help and documentation Even though it is better if the system can be used without documentation, it may be necessary to provide help and documentation. Any such information should be easy to search, focused on the user's task, list concrete steps to be carried out, and not be too large.
- That seems like a lot of work – I’ll just skip it because I know what my users want. Nope, It doesn’t work like that – you think you know. Often, you are wrong. Don't defer user testing until you have a fully implemented design. If you do, it will be impossible to fix the vast majority of the critical usability problems that the test uncovers. Many of these problems are likely to be structural, and fixing them would require major rearchitecting. The only way to a high-quality user experience is to start user testing early in the design process and to keep testing every step of the way.
- Design not platform appropriate Status not very visible Doesn’t speak user’s language – Zones? Needs a ridiculous amount of permissions
- It’s ugly Status not very visible Doesn’t speak user’s language – Zones? Yet – One of the highest rated apps!
- Design not platform appropriate Status not very visible Doesn’t speak user’s language – Zones? No way to see an overview of all zones. Why do I need an account?
- Really simple app Design not very good Delivers what it promises though
- Design just subtly wrong Error handling and messages lacking Good app though
- Big updates every couple of days Very tedious 3-step process to choose areas Shows information I don’t care about and makes important info hard to find