user-centered design in it: the low-hanging fruit august 25, 2014 ian crew, msc hci/e information...
TRANSCRIPT
![Page 1: User-Centered Design in IT: the low-hanging fruit August 25, 2014 Ian Crew, MSc HCI/E Information Services and Technology UC Berkeley icrew@berkeley.edu](https://reader035.vdocuments.site/reader035/viewer/2022070307/551aa93a5503466b3a8b5c2a/html5/thumbnails/1.jpg)
User-Centered Design in IT:the low-hanging fruit
April 11, 2023
Ian Crew, MSc HCI/E
Information Services and Technology
UC Berkeley
Allison Bloodworth, MIMS
Technology Program Office
UC Berkeley
© 2006-2007 Regents of the University of California
![Page 2: User-Centered Design in IT: the low-hanging fruit August 25, 2014 Ian Crew, MSc HCI/E Information Services and Technology UC Berkeley icrew@berkeley.edu](https://reader035.vdocuments.site/reader035/viewer/2022070307/551aa93a5503466b3a8b5c2a/html5/thumbnails/2.jpg)
Who’s heard of…
• HCI?
• Usability?
• User-Centered Design (UCD)?
• User Experience (UX)?
• Different aspects of a related set of concepts.
![Page 3: User-Centered Design in IT: the low-hanging fruit August 25, 2014 Ian Crew, MSc HCI/E Information Services and Technology UC Berkeley icrew@berkeley.edu](https://reader035.vdocuments.site/reader035/viewer/2022070307/551aa93a5503466b3a8b5c2a/html5/thumbnails/3.jpg)
What is …
• User-Centered Design (UCD)– a design philosophy and a process in which the
needs, wants, and limitations of the end user of an interface or document are given extensive attention at each stage of the design process1
– Goal: to make the user's interaction experience as simple and intuitive as possible
• User Experience (UX)– the overall experience and satisfaction a user has
when using a product or system2
- Goal: meet user goals and tasks while satisfying business and functional requirements
1From Wikipedia, http://en.wikipedia.org/wiki/User_centered_design2From Wikipedia, http://en.wikipedia.org/wiki/User_experience
![Page 4: User-Centered Design in IT: the low-hanging fruit August 25, 2014 Ian Crew, MSc HCI/E Information Services and Technology UC Berkeley icrew@berkeley.edu](https://reader035.vdocuments.site/reader035/viewer/2022070307/551aa93a5503466b3a8b5c2a/html5/thumbnails/4.jpg)
Presentation goals
• Explain why User-Centered Design and User Experience are important in IT
• Introduce a simple set of tools that can be used to improve the usability of your products and services
![Page 5: User-Centered Design in IT: the low-hanging fruit August 25, 2014 Ian Crew, MSc HCI/E Information Services and Technology UC Berkeley icrew@berkeley.edu](https://reader035.vdocuments.site/reader035/viewer/2022070307/551aa93a5503466b3a8b5c2a/html5/thumbnails/5.jpg)
Why UCD/UX?
• Increased customer satisfaction • Increased user productivity, efficiency, and
accuracy • Increased service/site usage and adoption • Decreased support and training costs • Reduced development time and costs
– Create only the features users need
• Reduced maintenance costs– Do it right the first time
Adapted from Usability Professionals’ Association website, http://www.upassoc.org/usability_resources/about_usability/definitions_of_usability.html
![Page 6: User-Centered Design in IT: the low-hanging fruit August 25, 2014 Ian Crew, MSc HCI/E Information Services and Technology UC Berkeley icrew@berkeley.edu](https://reader035.vdocuments.site/reader035/viewer/2022070307/551aa93a5503466b3a8b5c2a/html5/thumbnails/6.jpg)
Usability maturity model
• Stage 1: Hostile Toward Usability• Stage 2: Developer Centered Usability• Stage 3: Skunkworks Usability• Stage 4: Dedicated Usability Budget• Stage 5: Managed Usability• Stage 6: Systemic Usability Process• Stage 7: Integrated User-Centered Design• Stage 8: User-Driven Corporation
From Jakob Nielsen, “Corporate Usability Maturity: Stages 1-4,” http://www.useit.com/alertbox/maturity.html and “Corporate Usability Maturity: Stages 5-8,” http://www.useit.com/alertbox/process_maturity.html
![Page 7: User-Centered Design in IT: the low-hanging fruit August 25, 2014 Ian Crew, MSc HCI/E Information Services and Technology UC Berkeley icrew@berkeley.edu](https://reader035.vdocuments.site/reader035/viewer/2022070307/551aa93a5503466b3a8b5c2a/html5/thumbnails/7.jpg)
Typical User Centered Design activities
• User Interface Design
• Interaction Design
• Information Architecture
• User Research
• Usability Analysis
• Visual (Graphic) Design
![Page 8: User-Centered Design in IT: the low-hanging fruit August 25, 2014 Ian Crew, MSc HCI/E Information Services and Technology UC Berkeley icrew@berkeley.edu](https://reader035.vdocuments.site/reader035/viewer/2022070307/551aa93a5503466b3a8b5c2a/html5/thumbnails/8.jpg)
Basic UCD & usability evaluation techniques
1. User needs assessment
2. Competitive/Comparative analysis
3. Heuristic evaluation
4. Personas
5. Task analysis
6. Usability testinga. Card sorting
b. Prototype testing
![Page 9: User-Centered Design in IT: the low-hanging fruit August 25, 2014 Ian Crew, MSc HCI/E Information Services and Technology UC Berkeley icrew@berkeley.edu](https://reader035.vdocuments.site/reader035/viewer/2022070307/551aa93a5503466b3a8b5c2a/html5/thumbnails/9.jpg)
1. User needs assessment
• Surveys
• Interviews
• Focus groups
• Advanced observation techniques– Field studies– Contextual inquiries– Ethnography
![Page 10: User-Centered Design in IT: the low-hanging fruit August 25, 2014 Ian Crew, MSc HCI/E Information Services and Technology UC Berkeley icrew@berkeley.edu](https://reader035.vdocuments.site/reader035/viewer/2022070307/551aa93a5503466b3a8b5c2a/html5/thumbnails/10.jpg)
Interviews
• Structured and/or open-ended• Talk to actual end users
– They are usually not the project sponsors
• Encourage the user to speak freely and give you honest answers and feedback
• Determine the user’s needs, goals & tasks
![Page 11: User-Centered Design in IT: the low-hanging fruit August 25, 2014 Ian Crew, MSc HCI/E Information Services and Technology UC Berkeley icrew@berkeley.edu](https://reader035.vdocuments.site/reader035/viewer/2022070307/551aa93a5503466b3a8b5c2a/html5/thumbnails/11.jpg)
Interview Rules
1. Don’t ask questions that can be answered with “yes” or “no.”
2. Don’t ask leading questions. 3. Don’t draw attention to specific issues
that you care about.4. Don’t use jargon.5. Remain neutral: don’t react.6. Distance yourself from the product.
Adapted from Jakob Nielsen, “Field Studies Done Right: Fast & Observational,”http://www.useit.com/alertbox/20020120.html
![Page 12: User-Centered Design in IT: the low-hanging fruit August 25, 2014 Ian Crew, MSc HCI/E Information Services and Technology UC Berkeley icrew@berkeley.edu](https://reader035.vdocuments.site/reader035/viewer/2022070307/551aa93a5503466b3a8b5c2a/html5/thumbnails/12.jpg)
2. Competitive/Comparative analysis
• Try using other similar services or products
• What to do, what not to do
• Interface conventions
• “Must have” standard features
![Page 13: User-Centered Design in IT: the low-hanging fruit August 25, 2014 Ian Crew, MSc HCI/E Information Services and Technology UC Berkeley icrew@berkeley.edu](https://reader035.vdocuments.site/reader035/viewer/2022070307/551aa93a5503466b3a8b5c2a/html5/thumbnails/13.jpg)
3. Heuristic Evaluation
• Visibility of system status• Match between the system and the real
world• User control and freedom• Consistency and standards• Error prevention• Recognition rather than recall• Flexibility and efficiency of use
From Jakob Nielsen, “Ten Usability Heuristics,” http://www.useit.com/papers/heuristic/heuristic_list.html
![Page 14: User-Centered Design in IT: the low-hanging fruit August 25, 2014 Ian Crew, MSc HCI/E Information Services and Technology UC Berkeley icrew@berkeley.edu](https://reader035.vdocuments.site/reader035/viewer/2022070307/551aa93a5503466b3a8b5c2a/html5/thumbnails/14.jpg)
Heuristic Evaluation
• Aesthetic and minimalist design• Help users recognize, diagnose, and
recover from errors• Help and documentation
• One checklist: http://www.stcsig.org/usability/topics/articles/he-checklist.html
From Jakob Nielsen, “Ten Usability Heuristics,” http://www.useit.com/papers/heuristic/heuristic_list.html
![Page 15: User-Centered Design in IT: the low-hanging fruit August 25, 2014 Ian Crew, MSc HCI/E Information Services and Technology UC Berkeley icrew@berkeley.edu](https://reader035.vdocuments.site/reader035/viewer/2022070307/551aa93a5503466b3a8b5c2a/html5/thumbnails/15.jpg)
4. Personas
• Based on user research• Each one a profile of one particular “typical”
user of your system• Limit number of personas to one per
important user category• Be specific, make them real
– Pictures, posters– Include details about their life—humanize them
• Helps avoid “the elastic user”
![Page 16: User-Centered Design in IT: the low-hanging fruit August 25, 2014 Ian Crew, MSc HCI/E Information Services and Technology UC Berkeley icrew@berkeley.edu](https://reader035.vdocuments.site/reader035/viewer/2022070307/551aa93a5503466b3a8b5c2a/html5/thumbnails/16.jpg)
Example persona: Edward (Eddie) Calhoun
• 35 years old• IT Person, Computational
Physics Department• Came to UC Berkeley for his
masters degree in CP, graduated in June of 2005.
• Hired to continue working as an IT person for the CP department, where he had done some work as a student.
• Is very good with computers (even builds his own PCs), but they aren’t his whole life
• Fell in love with Angie while a student, they are busy planning a wedding for June of 2007.
![Page 17: User-Centered Design in IT: the low-hanging fruit August 25, 2014 Ian Crew, MSc HCI/E Information Services and Technology UC Berkeley icrew@berkeley.edu](https://reader035.vdocuments.site/reader035/viewer/2022070307/551aa93a5503466b3a8b5c2a/html5/thumbnails/17.jpg)
5. Task analysis
• Determine tasks based on user goals
• Frequency, importance, difficulty
• Tells you what functionality is important
![Page 18: User-Centered Design in IT: the low-hanging fruit August 25, 2014 Ian Crew, MSc HCI/E Information Services and Technology UC Berkeley icrew@berkeley.edu](https://reader035.vdocuments.site/reader035/viewer/2022070307/551aa93a5503466b3a8b5c2a/html5/thumbnails/18.jpg)
6. Usability testing
• Test early in the process• Test with 3-5 users (or less!)• Ask the user to think aloud• Same facilitation rules as with interviews,
plus:– Don’t help– Make clear you’re testing the product, not
the user
![Page 19: User-Centered Design in IT: the low-hanging fruit August 25, 2014 Ian Crew, MSc HCI/E Information Services and Technology UC Berkeley icrew@berkeley.edu](https://reader035.vdocuments.site/reader035/viewer/2022070307/551aa93a5503466b3a8b5c2a/html5/thumbnails/19.jpg)
Usability Testing
• No need to write down exactly what each user does – trends will emerge
• Main focus of testing is to improve the design, not to come up with metrics– One simple metric: % of tasks completed
successfully
![Page 20: User-Centered Design in IT: the low-hanging fruit August 25, 2014 Ian Crew, MSc HCI/E Information Services and Technology UC Berkeley icrew@berkeley.edu](https://reader035.vdocuments.site/reader035/viewer/2022070307/551aa93a5503466b3a8b5c2a/html5/thumbnails/20.jpg)
6a. Card sorting
• Helps figure out how to categorize items
• Each card should have item name and brief explanation
• Provide pre-defined and blank (make-your-own) category cards
• Same facilitation rules as a usability test
![Page 21: User-Centered Design in IT: the low-hanging fruit August 25, 2014 Ian Crew, MSc HCI/E Information Services and Technology UC Berkeley icrew@berkeley.edu](https://reader035.vdocuments.site/reader035/viewer/2022070307/551aa93a5503466b3a8b5c2a/html5/thumbnails/21.jpg)
6b. Prototype testing
• Scenario-based
• Paper
• Lo-fi
• Hi-fi
![Page 22: User-Centered Design in IT: the low-hanging fruit August 25, 2014 Ian Crew, MSc HCI/E Information Services and Technology UC Berkeley icrew@berkeley.edu](https://reader035.vdocuments.site/reader035/viewer/2022070307/551aa93a5503466b3a8b5c2a/html5/thumbnails/22.jpg)
Iterate!
DesignPrototype
Evaluate
Figure courtesy of James Landay
![Page 23: User-Centered Design in IT: the low-hanging fruit August 25, 2014 Ian Crew, MSc HCI/E Information Services and Technology UC Berkeley icrew@berkeley.edu](https://reader035.vdocuments.site/reader035/viewer/2022070307/551aa93a5503466b3a8b5c2a/html5/thumbnails/23.jpg)
First steps
• Which tools to use really depends on the context of your site/application & resource constraints– Designing a new service?
• Start with: User needs assessment and/or Comparative analysis
– Want to improve an existing site? • Start with: Heuristic evaluation
– Lots of information to organize?• Start with: Card sorting
![Page 24: User-Centered Design in IT: the low-hanging fruit August 25, 2014 Ian Crew, MSc HCI/E Information Services and Technology UC Berkeley icrew@berkeley.edu](https://reader035.vdocuments.site/reader035/viewer/2022070307/551aa93a5503466b3a8b5c2a/html5/thumbnails/24.jpg)
End-to-end user experience
• Does the whole system work for the user?
• Standards
• Users’ overall experience with all systems, or even entire organization
• Cross-platform considerations
![Page 25: User-Centered Design in IT: the low-hanging fruit August 25, 2014 Ian Crew, MSc HCI/E Information Services and Technology UC Berkeley icrew@berkeley.edu](https://reader035.vdocuments.site/reader035/viewer/2022070307/551aa93a5503466b3a8b5c2a/html5/thumbnails/25.jpg)
Case study: UC Berkeley Calendar Network
• UCD allows you to both get end user buy-in & design a system that meets their needs– Interviews, usability testing, focus groups
• The problem– More than 70 online campus event calendars, none of
which have an automated way to share info– No comprehensive view of campus events
• The solution– Create an event and calendar management tool with
all the features necessary to convince calendar owners to use a centralized system
![Page 26: User-Centered Design in IT: the low-hanging fruit August 25, 2014 Ian Crew, MSc HCI/E Information Services and Technology UC Berkeley icrew@berkeley.edu](https://reader035.vdocuments.site/reader035/viewer/2022070307/551aa93a5503466b3a8b5c2a/html5/thumbnails/26.jpg)
Case study: UC Berkeley Calendar Network
• Sample interview findings:– Very important that calendar maintain ‘look
and feel’ of website– Calendar owners have varying levels of
technical skill– Calendar owners want ability to update
event information easily and quickly– It can be helpful to publicize events with
other organizations on campus
![Page 27: User-Centered Design in IT: the low-hanging fruit August 25, 2014 Ian Crew, MSc HCI/E Information Services and Technology UC Berkeley icrew@berkeley.edu](https://reader035.vdocuments.site/reader035/viewer/2022070307/551aa93a5503466b3a8b5c2a/html5/thumbnails/27.jpg)
Case study: UC Berkeley Calendar Network
• Sample usability testing findingPaper prototype
1st Interactive prototype
3rd interactive prototype
![Page 28: User-Centered Design in IT: the low-hanging fruit August 25, 2014 Ian Crew, MSc HCI/E Information Services and Technology UC Berkeley icrew@berkeley.edu](https://reader035.vdocuments.site/reader035/viewer/2022070307/551aa93a5503466b3a8b5c2a/html5/thumbnails/28.jpg)
Case study: UC Berkeley Calendar Network
• And here’s what the Event Manager looks like today:
![Page 29: User-Centered Design in IT: the low-hanging fruit August 25, 2014 Ian Crew, MSc HCI/E Information Services and Technology UC Berkeley icrew@berkeley.edu](https://reader035.vdocuments.site/reader035/viewer/2022070307/551aa93a5503466b3a8b5c2a/html5/thumbnails/29.jpg)
Recommended books
• “The Inmates are Running the Asylum” – Alan Cooper
• “The Design of Everyday Things” and “Emotional Design” – Don Norman
• “Usability Engineering” – Jakob Nielsen
• “Don’t Make Me Think” – Steve Krug
• Other recommendations?
![Page 30: User-Centered Design in IT: the low-hanging fruit August 25, 2014 Ian Crew, MSc HCI/E Information Services and Technology UC Berkeley icrew@berkeley.edu](https://reader035.vdocuments.site/reader035/viewer/2022070307/551aa93a5503466b3a8b5c2a/html5/thumbnails/30.jpg)
Recommended websites
• User Interface Engineering Virtual Seminars: http://www.uie.com/events/virtual_seminars/
• Useit.com: http://www.useit.com/• Usability Professionals Association:
http://www.upassoc.org/• http://www.stcsig.org/usability/ • http://usability.gov/• http://www.usabilityfirst.com/• http://www.usableweb.com/• http://usabilitynet.org/ • ACM SIGCHI: http://acm.org/sigchi• UC Berkeley’s Technology Program Office
Resources: http://tinyurl.com/2cmx88