Usability for programmers, Markus Geiger, Mayflower GmbH
-
Upload
mayflower-gmbh -
Category
Technology
-
view
681 -
download
1
Transcript of Usability for programmers, Markus Geiger, Mayflower GmbH
© Mayflower GmbH 2010
Usability for ProgrammersThe Art of Social Interfaces
Markus Geiger I 16. September 2010
Mayflower GmbH I 2
http://www.flickr.com/photos/25451699@N04/2788734668
Who are you?
Mayflower GmbH I 3
You will not learn...
How to identify usergroups...How to build cool layouts...How to audit user testing...How to do perfect ui controls...
Mayflower GmbH I 4
?http://www.flickr.com/photos/raster/3380860520/
But we can talk about it...
Mayflower GmbH I 5
Actually, thereis a needsometimes...
Customer
http://www.flickr.com/photos/shonk/4112895587
Mayflower GmbH I 6
Costs of making changes
Concept Phase
DuringDevelopment
After Launch
1x
6x
100x
Mayflower GmbH I 7
User Testinghttp://www.flickr.com/photos/shonk/4112895587
Mayflower GmbH I 8
Conventional usertesting is a monster!
I Data analysis
I Usability Benchmarks
I Surveys
I Field studies
I Camera/diary studies
I Customer feedback
and so on…http://www.flickr.com/photos/shonk/4112895587
Mayflower GmbH I 9
When do you do usability testing...?
Are you working on
the site?
You alwaysdo testing.
YES?
Mayflower GmbH I 10
User testing in the office...
I Grab your chair neighbour (the least he knows the better)
I Or use your customer to the the job (product owner)
I Think about tools (screen recordings, checklists, …)
I Don't do do-it-yourself testing!
Mayflower GmbH I 11
User testing in the office...
I Pick up some tasks and make scenarios (do you have userstories?)
I Place restrictions on the task (e.g. don't use the search box or help!)
I Keep talking and take down notes (very important!)· Ask the test person to describe what they are thinking and doing· Ask test questions and give tasks to the test person!· You need to know what they problably don't say…
I Look exactly how they perceive the page!
Mayflower GmbH I 12
Some things to pay attention to during your tests...
I Don't make up elephants! (It's ok when it just works!)
I Does everyone understand how it works (your usergroups)?
I Are there all elements which would be expected?
I Mind your checklists!
I Alway take notes, make up questions...
Mayflower GmbH I 13
http://www.prweb.com/releases/2005/3/prweb213516.htm
Attention is always important...
Mayflower GmbH I 15
Usability and Psychology
Usability Principles
I Consistency
I Feedback
I Portability
I Ease of use
I Responsibilty
I [...]
Human Psychology
I Movement
I Perception
I Language
I Memory
I Thinking
I Experience
Mayflower GmbH I 16
Heuristics of Usability / Social Patterns
I Visibility of system status (Feedback)→ user feedback is mandatory, e.g. ajax-loaders
I Match between system and the real world→ e.g. use language which is known to your user
I Consistency and standards→ prevent user distraction, natural and logical sort orders
Mayflower GmbH I 17
Heuristics of Usability / Social Patterns
I Recognition rather than recall→ make important elements visible, use icons
I Flexibility and efficiency of use→ e.g. accelerators for pro-users
I Help users recognize, diagnose, and recover from errors→ the system is „sorry“ for not finding your expected search term
Mayflower GmbH I 18
Heuristics of Usability / Social Patterns
I Assumption & Practice
I Strict vs. fluid taxonomy
I 3-Clicks-Rule→ everything should be possible within three clicks
I Anti-patterns/unwanted behaviour→ prevent it!
I A morning a month, that's all we need... → not too much information!
Or simply what users want and how they act…
Mayflower GmbH I 19
Be a person, not a computer!
Mayflower GmbH I 20
I gentle - interested in me, remembers settings
I perceptive - shows me what will be next
I forthcoming - don't hold back useful information
I responsive - don't annoy your users
I forgiving - dialogs, history, undo options
I focused - focused on tasks
I fudgeable - allow partial completes
Pilote Computing
“Be a person – not a computer!”
Mayflower GmbH I 21
User Guidancehttp://www.flickr.com/photos/shonk/4112895587
Mayflower GmbH I 22
I Keep the main focus on tasks (one per screen)· Switching tasks takes effort and distracts users· Interruption burdens shorts memory!· Allow user to develop habits!
I Show only relevant information· Emphasize important parts· Don't distract the user with too much information
(perception vs. time, provide options for drill-downs)· Focus on user activities not on features
Being a good guide...
Mayflower GmbH I 23
I Give the user the illusion of choices· Don't ask users to make choices, be a good guide
(Not every person likes to make [hard] decisions)
I Give the user a good experience concerning the application· Reward the user for learning (Skinnerbox)· But let him still do his work or task
(= seperate between task-orientated viewsand what's around in your application)
Being a good guide...
Mayflower GmbH I 24
Focus on actions, not on features!http://www.flickr.com/photos/sherrattsam/3585024912/sizes/o/
...but bring the most frequently used features to the front ;)
Mayflower GmbH I 25
http://www.flickr.com/photos/buridan/8311216/sizes/l/
Don't be a cargo cultist*...!
Mayflower GmbH I 26
Don't be a cargo cultist*...!
I Focus on a usercentric design. Identify your users, theirgoals and tasks and provide solutions. Do not just copysomething because it's cool and others use it!
The Social Web· Users spend time in things from which they gain value· Allow users to develop their own habits· Good usability allows the application to be a contributing
part of our life we like and share with others.
*NOTE: Cargo cult science is not real science!
Mayflower GmbH I 27
Some links
I On usability itselfhttp://www.luckydogarts.com/dm158/docs/posit.pdf
I Guidelines for websites:http://www.usability.gov/guidelines/index.html
I Steve Krug - Rocket Surgery made easy
I Christian Crumlish & Erin Malone–Designing Social Interfaces (O'Reilly)
I http://germanupa.de/
22.11.2010 Mayflower GmbH 28
Vielen Dank für Ihre Aufmerksamkeit!
Kontakt Markus Geiger
+49 89 242054 1162
Mayflower GmbH
Mannhardtstraße 6
80538 München
Mayflower GmbH I 29
Bonus Slides: Cleaning up...http://www.flickr.com/photos/toms/105166597
Mayflower GmbH I 30
Know where the problem lies...
I Appearance – How does it look like?
I Interaction – How does the user interact with components?
I Information – Problems with information levels at different stages
I Structure – Less cluttering keeps the users focused
I Concept – How to gain value?
I Proposition – The value to the customer
Experience
Usability
Mayflower GmbH I 31
Fixing usabiltiy problems...
I Know exactly where the problem can be found
I Is it a core problem or just a problem of few test persons(including yourself)?
I Fix the least you can do – do not reinvent the wheel!
I Use checklists – if you don't know use books or the web!
Mayflower GmbH I 32
Common design flaws (some kind of checklist)
I Do we have unnecessary elements?
I Do images support the user or do they distract him?
I Is the application responsible for what it does?
I Is the layout/design supporting the users' tasks?
Is your application fullfilling these requirements?