1. SIMS 213: User Interface Design & Development
Marti Hearst
Thur, Feb 1, 2007

2. User-Centered Design Example
Course Registration (Tele-bears re-design)
SIMS 213, Spring 2003
Group Manager: Amy Todenhagen Documentation Manager: Kimberley Chambers Software Manager: Nadine Fiebrich Design Manager: Zhanna Shamis User Testing Manager: Anna Teplitskaya

3. User-centered Design Example
Problem Statement

4. User-centered Design Example
Participants

5. User-Centered Design Example
Needs Assessment Procedure:
Answer the needs assessment questions
Make a table showing
user types
tasks
(guesses about) relative frequencies of tasks
Decide which of the new tasks users may perform using the new interface.
Make note of which ideas you decided to drop based on your interviews.

6. Needs Assessment Questions
Who is going to use the system?
What tasks do they now perform?
What tasks are desired?
How are the tasks learned?
Where are the tasks performed?
What is the relationship between the user and the data?
Slide adapted from James Landay

7. Needs assessment Questions
What other tools does the user have?
How do users communicate with each other?
How often are the tasks performed?
What are the (time) constraints on the task?
What happens when things go wrong?
Slide adapted from James Landay

8. User-centered Design Example
Needs assessment techniques:
Observation
Interviews
Study existing successful designs

9. User-Centered Design Example
Interview
Prepare a list of questions about how people do their task now and what they would like to have be different.
Interview at least three people
Try to identify people with different needs and preferences, with respect to their attitudes about using online ordering systems.
Ask them what, if anything, must be in the system in order for them to prefer it over the current system
Refer to needs assessment questions shown above.
Go look at existing interfaces for the goal and see how they handle the necessary tasks.

10. User-centered Design Example
Interview Participants:
Graduate: 1st Year Masters
Graduate: PhD
Undergrad: Freshman1
Undergrad: Freshman2
Undergrad: Junior Transfer
Undergrad: Senior Transfer
Undergrad: Senior

11. User-centered Design Example
Interview Questions & Summary Results

12. User-centered Design Example
Interview Questions & Summary Results

13. User-centered Design Example

14. User-centered Design Example
Interview Questions & Summary Results

15. User-centered Design Example

16. Course Scheduler Example
Interview Results
Target user base: UCB Students
Developed from
8 interviews
personal experience as students
Discovered differences in approaches to tasks and needs
Some students shop around and interact intensively with the course scheduling system
Others consider only a narrow range of courses and/or have strict requirements to fill
Diversity in student body
Age, educational status, computer experience
Must work for all students since it is a must-use application

17. Course Scheduler Example
Interview Questions & Summary Results

18. Personas (from Cooper)
“Hypothetical Archetypes”
Archetype: (American Heritage)
An original model or type after which other similar things are patterned; a prototype
An ideal example of a type; quintessence
A precise description of a user and what they want to accomplish
Imaginary, but precise
Specific, but stereotyped
Real people have non-representative quirks

19. Let’s Practice

20. Course Scheduler Example

21. Course Scheduler Example

22. Course Scheduler Example

23. Course Scheduler Example

24. Course Scheduler Example

25. Course Scheduler Example

26. Course Scheduler Example

27. Course Scheduler Example

28. Cooper on Scenarios Daily Use Necessary Use Edge Cases
Fast to learn
Shortcuts and customization after more use
Necessary Use
Infrequent but required
Nothing fancy needed
Edge Cases
Ignore or save for version 2
Example: image cropping application
It works so intuitively, it feels like magic

29. Course Scheduler Example
Sample Scenario
Alicia is new to the registration process
  Its Monday morning and Alicia has just spent the weekend partying and getting to know more of her dorm-mates. Alicia has her first Tele-Bears session this morning and although she already has three good classes in mind, she needs to find 1 more, but she'll have to figure out her GE requirements first. Alicia logs onto the system. First, she signs up for Nutritional Science 10 because apparently heaps of cute water-polo guys take this class. Alicia is thinking about majoring in French Literature and so she signs up for English 1A which she must take before taking anymore English classes. Alicia then signs up for her third class, Biology 1A because she might want to major in this too. Then Alicia browses for her last class by searching all the GE classes, and decides to sign up for American Studies 10. Unfortunately this class must be really popular because its already full! So, Alicia decides to go on the waitlist for it just in case. She then adds another GE class that looked quite interesting called Film 24. This class is a Freshman Seminar on Film so Alicia hopes that she'll get to watch some cool movies! Someone is yelling Alicia's name down the hall, so she logs off.

30. Course Scheduler Example
Sample Scenario
Mike needs to make a minor schedule change
Mike is already well into his second week of this semester. As usual, Mike had no problem signing up for his classes as he had planned them ahead of time out in Excel. Unfortunately he needs to switch sections for his Dynamics and Control of Chemical Processes class. Mike is loving the lecture and enjoying the laboratory for the class, but the T.A who is teaching his discussion section is clearly inexperienced. Mike quickly logs onto Tele-Bears and changes to the discussion section on Fridays at 9am. Although Mike is certain that this small change to his schedule doesn't conflict with his job, he reviews his schedule and, satisfied that this is fine, prints out his new schedule and logs off Tele-Bears.

31. Cooper’s Perpetual Intermediaries
Beginners
Intermediates
Experts
Programmers design for experts

32. Perpetual Intermediaries
Beginners
Intermediates
Experts
Marketers design for beginners

33. Perpetual Intermediaries
Beginners
Intermediates
Experts
People spend most of their time as intermediates

34. Perpetual Intermediaries
Beginners
Intermediates
Experts
Paradoxical Curves