Human-Computer Interaction

CMSC 434/828S

Fall 2002

Prof. François Guimbretière (sec. 0101)

Project #1

Due Oct 03, 2001

 

Task Centered Design and Prototyping

Overview (this is the general description – there are six specific project options ( opt 1, opt 2, opt 3, opt 4, opt 5, opt 6) from which you will choose) as well as a set of hardware rules.

Note: there will be around fifteen teams in the class, and at most 5 teams will be allowed to select the same project option.

This project is a hands-on exercise on task-centered design and prototyping, which is the first step in an iterative user-centered system design. Fundamentally, this means that you begin your design by getting to know the intended users, their tasks, and the working context of their actions. Only then do you consider what the actual system design should look like, where you would base the design on real people, real tasks, and real needs. User centered system design is not an academic process where some cookbook formula can be applied. Nor is it an intuitive process where a programmer can sit in their office and think they know what the user and their tasks are. Rather, it is a hands-on process that requires you to go out and identify actual users, talk to them about what tasks they are trying to do, and understand the entire context of their work. You then base your designs on this information. Because your initial designs will be crude and problem-prone, you will have to identify potential usability problems by continually evaluating your design and by crafting new designs. This is called iterative design.

In this project, you will begin your iterative design of a particular system using task-centered system design methods and low fidelity prototyping methods. (You will be continuing this design in projects 2, 3 and 4). The immediate purpose of this project is to give you experience at:

The outcome of this project on task-centered system design is a design portfolio containing:

What to design

Your company is about to design, build, and market one of the following four new software systems:

Major Restriction

We are not designing Web pages in this course. For this reason, the default rule for your project is that your UI may not be browser-based. If after you have completed project 2, you feel that a browser is the best client, you can write a formal request to use a browser as your client for project 3, but you must be prepared for this request to be denied, so you should do your entire project 1 assuming that you will not be using a browser when you build this application in project 2.

Teams

You will work with 2-3 others from this course. The idea of working with others is to get alternate design ideas, alternate ways of looking at things, and more breadth at eliciting and interpreting evaluations. It is your responsibility to find team members that you can work with.

Note that if this were being done "for real", the best team would have people from diverse backgrounds, which will give the team different perspectives on the problem. For example, a real team could comprise a project manager, a marketing person, a programmer, a representative end user, and/or a help desk person who regularly deals with end users.  To this end, I encourage you to build teams with people with different strengths.  Picking a team with the 4 best programmers will not generate the best results.

Deliverables

Your group will deliver a system design and discussion portfolio written to the imaginary vice-president of your company. The portfolio will include the following sections.

Section 1: Tasks and requirements (~10 pages)

  1. Introduction. Describe in general terms the background to the system. You should describe (in general) the expected users, their work contexts, and what they will use the envisaged system for.
  2. Concrete task examples. You will list at least 5-7 concrete task examples that have the properties listed in Appendix 1. Try to keep task descriptions short and to the point. Each task should be accompanied by a paragraph that describes the class of the expected user (eg, a typical customer), the relative importance of the task (eg frequently done and important, infrequently done but still important, rare and not important, etc), and whatever other nuances you feel should be included. You should also describe how the task was validated.
  3. Tentative list of requirements. From the task examples, extract the major system requirements and prioritize them into a) absolutely must include; b) should include; and c) could include. Each category should be accompanied by a discussion as to why items were placed in that category.

Section 2: The first prototype and walkthrough (an annotated design + several pages)

  1. Prototype (storyboard or Pictive). Develop several low-fidelity prototypes of designs that you believe will satisfy the major requirements. You will include the prototypes in your portfolio.
  2. Team discussions and walkthrough. Discuss the prototypes with your team and (ideally) potential users. You should be concerned here with how the general interface representation fits the users' view of their tasks. The more different you are from the target users, the more important it is for representative users to give you feedback on your design.  For the prototype designs that seem promising, use the tasks from Section 1 to perform a task-centered walkthrough of your prototype. In point form, list the problems and successes for each task. In essay form, summarize the major design problems that must be corrected, as well as what seems to work well.

A note on the Portfolio: The portfolio is intended to document the progression of your design, which includes your final project. Your portfolio must be neat, well-organized, and visually appealing. Portfolios should be constructed out of a 1" or smaller 3-ring binder (we will not appreciate having to carry around larger binders). Your portfolio should also use titled section separators to separate the major sections. The cover of the portfolio should include the names of the group members, the group number, and the title of the project. The first page should be a table of contents, which will grow over time.

A note on the grading: Grading will be based upon the sophistication and maturity of the work, the elegance of the designs, the logic of the presentations, and the completeness of the work.

Method

Step 1. Generating a list of expected users, and an initial list of tasks. In this step, you interview knowledgeable people about their real-world tasks and observe them doing their tasks. Your goal is to generate an initial list of concrete task descriptions.

  1. The ideal: Interviewing the client. Get in touch with current or potential users. These users may now be using paper methods, competing systems, or antiquated systems for doing their tasks. Interview them about why and how they do their work activities, and what they expect out of a system. Ideally, this interview will occur while you are observing them do their work activities. These interviews and observations will give you some contact with customers and give you a feel for the real situation. This is more important than you think, for it will make you realize that ‘the user’ is not an abstract notion, but real people with real needs and concerns. It will help you put a face on the faceless, and will help you understand where they are coming from.
  2. A reasonable alternative: Interviewing the client representative. When you cannot get in direct contact with end users, you can use customer representatives instead. These will be people who have the most knowledge of the clients' needs. Examples are help desk people, or a worker's manager. However, it is crucial that the client representative has a deep and real (rather than idealized) understanding of what the workers actually do. People who work "in the trenches" with the staff are the best bet.

For whatever approach you chose, do the following steps. If you have a client and/or representative, you would do it with them.

  1. Have the client/representative recount a few (3-4) stories that typify the actual use of their system and/or process. Where possible, describe the people, the particular problems they wanted to solve, what information they brought into the meeting, the steps taken in the actual process, the constraints they had (e.g., time), what was produced, and whether they were satisfied with the outcome. All details are relevant. Alternatively, the task could be derived from direct observation of them doing their work. For example taking pictures of how users use, annotate, store, and more generally interact with books might be a great way to document key aspect of current paper book interface.
  2. On a more general and less detailed level, list as many related tasks and their variations as possible.
  3. There will be many task variations in the list. Identify (with the user, if possible) which tasks are frequent, which are infrequent but still important, and which are rarer and not very important.

At this point, you will have a set of concrete, detailed examples of tasks that people now perform, or would want to perform on your system. Each task description should have the attributes described in the appendix and the second reading (see attached).

Step 2. Validating the tasks. The next step is to get a reality check of your task list. Have end-users and/or client representatives review your tasks. They should check to see if the set of people are representative of potential end-users of your product, if tasks capture the variations of those done by real people, and if details are realistic (they will be, if they are based on real customers!). You should ask for details that were left out of the original task description, get corrections, clarifications, and suggestions, and then re-write the task descriptions.

Note: This step is critical if you used a client representative instead of a real client. While it may not be possible for you to interview and observe many real clients, you can probably get one to comment on a compiled list of prototypical tasks.

Step 3. Deciding upon key users and a tentative list of requirements. The task examples will provide clues on specific system requirements that you could use to design your system as well as who your target users will be. Because it is unrealistic to meet all requirements and address all users, it is your job to prioritize them. From the task examples (and possibly by further discussion with end users), decide upon the major system requirements and prioritize them into a) absolutely must include; b) should include; and c) could include. Similarly, decide upon what kind of users you must address, up to those you will exclude.

Step 4. Develop low fidelity prototypes. From the task examples and requirements, your team should sketch out several competing interfaces. Discuss and choose the most promising of these, and develop a low-fidelity prototype (using storyboards or Pictive methodology) that demonstrates how the interface fulfills the requirements.

Specifically, use the key users, their tasks, and the prioritized requirements as a type of requirements document to help you brainstorm prototypes that illustrate how your system would appear to the customer. You should be creating low fidelity prototypes e.g., paper sketches, storyboards, or Pictive (you can try a different method for each prototype!). You should not be concentrating on prettiness or completeness; rather, you are trying to show the overall interaction style of your system. Each prototype should contain the core screens that illustrate how the system will work as a whole, including (perhaps) a sample interaction based upon some of the key tasks.

Hint: To get diversity, each group member may want to try to create a few rough sketches before gathering as a group. You should also realize that some people may be better at this than others; this is not supposed to be a competition!

Step 5. Task-centered walkthrough. Test the prototype for usability bugs (problems, faults, weaknesses) by performing a task-centered walkthrough, as described in Appendix 1 and the readings.

 

Appendix 1.
Getting to Know Users and Their Tasks

Read the following papers (handed out in class):

Good task examples:

Example task description for a clerk in a video store, including discussion. The eventual system will assist the clerks to perform their tasks.

Mary Farness, an experienced full-time clerk at the video store, opens the store in the morning. She begins the day by checking in all the videos returned in the night video slot, which typically number between 90 to 150 videos. She pauses her task whenever customers ask for her services. She usually checks in ten videos, and then reshelves them before going onto the next ten.
Discussion. In this case, the "user" is the full time person who normally carries out this task. We expect them to be typical of an experienced clerk who will know the process well, and who will become well practiced at using the target system. The task is routine and frequently done.
George Marlay, a regular video store customer, approaches Mary and asks if they have the Frankenstein comedy video. She asks if he mean "Young Frankenstein" by Mel Brooks, and he say yes. She then directs him to the shelf where the video is expected to be. George retrieves the video card and brings it to the front desk. Mary asks for George's membership card, but George has forgotten it. Mary then looks up his membership number. Mary checks out the video, but reminds George that he has not yet returned the video "Brazil", which is now a day late. George says that he will bring it in later today, and leaves with the video.
Discussion. This task contains many typical clerk activities, which deals with vague requests about video titles, the location of the video in the store, forgotten membership cards, the video checkout activity, as well as reminders to customers about late videos. Most these tasks are frequently done, and important.
Anil, a part time clerk who works the telephone, comes in for an hour every third evening. His job is to search the rental records to find customers who are at least one day late on their video returns. For example, he phones Bob Jakobs, who is two days late. Bob answers, and Anil identifies himself, tells him that he still has the video "Volcano", and reminds him to return the video. Bob says he will bring it back in an hour or so, and Anil crosses his name off the list. He then phones Ania Sliven, and says (more or less) the same thing. However, Ania says that she has already returned the video the day before. Anil puts her on hold, runs to check the shelf and finds the video there. He apologizes and hangs up. He then phones Ang Lee, but there is no answer. He notes on another list that he should try this person again later. He continues in this manner. When he has finished the list, he starts again on those who have not answered.
Discussion. This task identifies a specific activity that is less frequently done but still quite important. It also indicates that a non-regular staff member may be doing this task.

Why these are good examples:

 

Appendix 2:
Developing and Evaluating Initial Prototypes

Read the following papers
Rettig, M. (1994) Prototyping for tiny fingers. Communications of the ACM, 37(4).

Step 1. Developing low fidelity prototypes.

Use the key users, tasks, and system requirements generated previously as a type of requirements document to help you brainstorm prototypes that illustrate how your system would appear to the customer. You should be creating several low fidelity prototypes e.g., paper sketches, storyboards, or Pictive (try a different method for each prototype!). You should also be thinking about what conceptual model the system will portray to its customers. You should not be concentrating on prettiness or completeness; rather, you are trying to show the overall representation and interaction style of your system. Each prototype should contain the core screens that illustrate how the system will work as a whole, including (perhaps) a sample interaction based upon some of the key tasks.

You should use the ideas of "psychology of everyday things" and "beyond screen design" to help you, as well as your general knowledge of other systems (there is nothing wrong with copying ideas, providing its legal!).

Hints: To get diversity, each of you may want to try to create a few rough sketches before gathering as a group. You may also want to talk to the systems people in your group, because there may be opportunities that already exist with the current way the information is stored and presented (e.g., if customers are already using software), or constraints that limit what you can do (e.g., if the system must be delivered as a Windows ’95 application). You should also realize that some people may be better at this than others; this is not supposed to be a competition!

 

Step 2. Evaluate the prototypes.

Your next step is to evaluate the prototypes.

Step 3. Reconsider priorities, and make a preliminary decision.

Based on the prototype and evaluation exercise, you may wish to reconsider what customers you will address as well as what tasks and requirements you will support. It could be that you were wildly optimistic about what you could do!

At this point, you should have a reasonable idea of which prototype styles are worth pursuing, or whether you should start again. Make your decision on what direction(s) to follow. If you have more than one direction, you may want to continue developing both a bit further. If you have no worthy candidates, return to step 2.

Hint. Don't feel committed to any prototype. This is the time where prototypes are quick to generate and cheap to discard. Use this time to explore the design space. While you may want to just get on with it, a bad design choice now can have disastrous and expensive repercussions later.

 

Step 4. Refinement and evaluation

(Just a sneak peek, this is not to be started until Project 2).

Refine your prototype by considering the nuances of each task, the functions that must be incorporated, and the expected reaction of each user. You may want to start considering the more subtle aspects of interface design at this point (e.g., psychology of everyday things, principles of graphical screen design, design principles). You should be continually evaluating these prototypes as appropriate. Real users should be commenting on them. You should be using walk-throughs, heuristic evaluation, and various observational methods.

If you follow this process, your prototypes will evolve from a competing series of design ideas, to a crude single design representation, to more realistic looking screen designs, to functioning systems. As your design is refined, you will move from very low fidelity prototypes done on paper to medium fidelity prototypes done on-line, likely through an interface builder. You will have detected and corrected the major interface design problems, and will be concentrating on fine-grained details. Eventually, you will create vertical prototypes with back-ends that fake some of the system functionality. To the user, however, it will look like the real system.