1. SIMS 213: User Interface Design & Development Marti Hearst Thurs, Jan 30, 2003

2. Beyond the Desktop Jun Rekimoto, Multiple-Computer User Interfaces: "Beyond the Desktop" Direct Manipulation Environments, ACM CHI2000 Video Proceedings, 2000.

3. Identify the mis-matched metaphors (from the Interface Hall of Shame) The classic (from the mac desktop) –To eject a disk you drag it to the trashcan

4. Identify the mis-matched metaphors (from the Interface Hall of Shame) VCR buttons to control a printer??

5. Identify the mis-matched metaphors (from the Interface Hall of Shame) Using tabs to make arbitrary groups

6. Direct Manipulation Metaphor DLITE makes heavy use of direct manipulation metaphors But it isn’t supposed to be just like in the real world Retain what works, omit the rest

7. Readings Cooper (Inmates, Chs. 9-11) Constantine & Lockwood Ch. 5

8. Slide by James Landay Why User-Centered Design? System will fail if it: –does not do what the user needs –is inappropriate for the user Why don’t we just define what a “good interface” is? –There is a huge variety of users and tasks –Guidelines are usually too vague e.g. “Provide feedback”, “Be intuitive”

9. Slide adapted from Ben Shneiderman Participatory Design A subset of user-centered design User actively participates in design of the system Pros: –potentially more accurate information about the tasks –more opportunity for users to influence the design decisions –buy-in from sense of participation –potential greater acceptance of final system

10. Slide adapted from Ben Shneiderman Participatory Design Cons (potential): –more costly –lengthier implementation period –antagonism from those whose suggestion are not incorporated –force designers to compromise design –exacerbate personality conflicts between designers and users –highlight organizational politics

11. User-Centered Design Overview Needs assessment –Find out who users are what their goals are what tasks they need to perform –Task Analysis Characterize what steps users need to take Create scenarios of actual use Decide which users and tasks to support Design based on this Evaluation –Test interface by “walking through” tasks –Do this before implementation

12. Slide by James Landay Caveats Politics –advocating change can cause controversy –get a sense of the organization –important to get buy-in from all those involved Don’t design forever without prototyping –rapid prototyping, evaluation, & iteration is key to technique Systems level apps are poor candidates –networking, etc.

13. Example: Student Course Enrollment: How to Help Students Achieve their Goals? enroll in sims 213 learn to build useful systems become successful IT manager achieve lifetime of success

14. Help Users Achieve Goals Example: Course Enrollment Software –What matters from the programmers’ point of view? –What matters from users’ point of view? –What about the course administrators?

15. User-Centered Design Example You have been hired by Pizzas R Us (PRU) Design a system to –make online orders from the web Also considering special features –online discount coupons –allowing party orders in advance –customer recommendations, linking to reviews –comparing local pizza parlors

16. User-centered Design Example Your job: figure out –how people do their pizza ordering now –how they would like to do it online –what features would make sense when –must also take into account the needs of the pizza parlor owners and workers. This is the needs assessment. Techniques: –Observation –Interview –Study existing successful designs

17. User-Centered Design Example Observation –Visit one or more pizza parlors. Observe how people achieve their pizza ordering goals. –Observe what the counter people need to do. Optionally: interview these people

18. User-Centered Design Example Interview –Prepare a list of questions about how people do their pizza ordering and what they would like in an automated ordering system. –Interview at least three people about what they would like in an automated ordering system and how they would like it to work. 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 a phone ordering system or an in- person ordering system. (E.g., no busy signals, cheaper prices, comparison shopping, faster service, or would they prefer anything over current methods.) – Go look at at least one existing on-line food ordering web site and see how they handle these tasks.

19. User-Centered Design Example Consider existing designs –Look at least one existing on-line food ordering web site and see how they handle these tasks.

20. User-Centered Design Example Procedure –Answer the needs assessment questions –Try to understand the basic tasks that are currently supported within pizza parlors and via phone orders –Make a table showing user types tasks (guesses about) relative frequencies of tasks –Decide which of the new tasks customers may perform using the new interface. Make note of which ideas you decided to drop based on your interviews.

21. Slide adapted from James Landay 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?

22. Slide adapted from James Landay 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?

23. Slide adapted from Ben Shneiderman Task Analysis Characterize what happens when users perform typical tasks Tools: –table of user communities vs. tasks Who x What –table of task sequences –flowchart or transition diagram –videotape depicting scenario

24. Slide adapted from James Landay's How Often Do Users Perform the Tasks? Frequent users remember more details Infrequent users may need more prompting Which function is performed –most frequently? –by which users? –optimize system for tasks that will improve perception of its performance

25. Augment Table with Percentages (What percentage of the is this task done by this person) (Numbers are only suggestive, adapted from Shneiderman 98 )

26. User-Centered Design Example Scenarios –Create three scenarios that will exercise these tasks in the proposed interface –Create a description in which you outline A person’s background Their goal(s) How they achieve these goals using the steps in the system –Note: this will change a bit when we use personas

27. User-Centered Design Example Sketch an initial design –Explain how the pizza ordering system will work. Either a textual description or a flow chart (or both) showing the sequences of steps that will be allowed in the system. Provide rough sketches showing at least three of the important screens. –Walk through at least one of the scenarios you developed and show how it can be handled by the interface.