Low-Fidelity Prototype

Assigned: February 18
Due: March 11 Before Class

The goal of this assignment is to learn how to use low-fidelity prototyping in early stage design to present your ideas to stakeholders and to receive feedback and refine your design. You will first build a low-fi prototype and demonstrate how a user would interact with your system through a video prototype. You will then perform a simple usability test with the low-fi prototype. You will incorporate the results of the test into design changes in your prototype for the next assignment.

This assignment is 10% of your overall grade, which has been broken down into 75 points for grading. The breakdown of points is discussed below.

What to Do:
In this assignment you will design a low-fidelity prototype to handle three key tasks for your users, create a video prototype demonstrating the intended interaction for those three tasks, and then test your prototype design with a set of users.

  1. Consider the six tasks you developed in the last assignment. Pick 3 of these tasks that give good coverage of your interface, including 1 easy task, 1 moderate task, and 1 hard task. It is up to you to estimate the difficulty of each task based on how challenging you expect the task to be for the average user.
  2. Design and build a paper prototype of your interface supporting the three tasks that you have chosen. Use the techniques described in the Prototyping for Tiny Fingers and Snyder readings as a guideline. You should design your low-fi prototype using paper and other simple materials commonly used in grade-school art classes.
  3. Once you have developed the paper prototype, you will create a video prototype illustrating each of the three tasks using your proposed interface. Make sure to set up the story at the start of your video rather than just showing the UI interactions (though the finished videos should show both).
  4. Finally, you will find at least three participants to work through your benchmark tasks. The ideal participants will be members of your specific target user group. Your participants cannot be in this class and they should not be your friends. You should get them to sign an informed consent form explaining the test. Remember it must be voluntary. More information on informed consent is here (we will also talk about this in class).

Video Prototyping
There are a number of sources available to you to learn more about creating video prototypes:

You may want to consider using the SAM Animation software to create your video prototypes. This software supports stop-motion video creation, which may be useful, especially if inter-cut with live action video. This software was used to create Nick's example video from CS 160 (linked above).

Testing Procedure
Have one of your teammates demo the system to show each real participant how they would interact with your prototyped system to complete a simple task (don't use one of your three tasks in this initial explanation). Show participants how the system works in general.

You should write up a script of your demonstration and follow the same script with each participant. Once you have shown participants the demo, explain the first task. Tell them what they must achieve, but do not explain how to perform the task. When they are finished, you will explain the next task and so on.

During the experiment, you should make a log of critical incidents (both positive and negative events). For example, the user might make a mistake or they might see something they like and say, "cool". Write it down along with a description of what was going on. Collect all the incidents first (all observers do this). Then go over them again as a group to assign severity ratings. The ratings scale looks like this:

  1. I don't agree this is a usability problem.
  2. Cosmetic problem
  3. Minor usability problem
  4. Major usability problem: important to fix
  5. Usability catastrophe: imperative to fix

Each participant should perform all 3 tasks. You will want to keep the data separate for each task and participant.

What to Turn In:
You will write-up a description of the work done for this assignment and post it on the wiki. Your writeup should follow the outline below and will be graded using the writing and experimentation guidelines detailed below. You should also embed pictures of paper prototype and link your video prototype.

  • Each team member's name and role in this assignment
  • Prototype description, with sketches, a picture of the entire system, and videos (1-2 pages)
  • Discussion of Video Prototyping (1 page)
    • How did you make it?
    • Any new interesting techniques you came up with?
    • What was difficult?
    • What worked well?
  • Experimental Method
    • Participants (1 paragraph)
    • Environment (1 paragraph)
    • Tasks (1 page)
    • Procedure (1 page)
    • Test Measures (1/2 page)
  • Experiment Results (1 page)
  • Experiment Discussion (3/4 page)
  • Appendices (as many pages as necessary - link from text into the appendices)

Additional detail and a grading breakdown are given below:

Prototype (15 pts)
Describe your prototype. Reference sketches of the interface screens in your description. Submit at least two images of your prototype (ideally more): an image showing all of the components of your system so that I can gauge the complexity of the prototype, and another image showing the prototype in some valid state (such as in the middle of a user study). You may also wish to reference the video prototype to help describe your system.

Video Prototype (25 pts)
You will be graded on how well your video illustrates each of the tasks and gives a flavor for your interface idea and how it will be used. You should show your prototype being used for at least three tasks, 1 easy, 1 moderate, and 1 hard. You will also be graded on whether the video properly shows the context of how the interface will be used (the back story). Finally, we will grade you on the description of how you made the video and the critique (positive/negative) of the technique.

Videos may be uploaded as files to the wiki or you may link to a video that you uploaded to a video hosting service, such as YouTube or Vimeo.

Experimental Method (10 pts)
Describe the participants in the experiment and how they were selected. Also describe the testing environment and how the prototype and any other equipment were set up. Describe some details of your testing procedure. This should include the roles of each member of the team. To prepare for the experiment, you should assign team members to the different tasks (i.e., greeter, computer, facilitator, observer, etc.) and practice with someone playing the participant. The test measures detail what you looked for or measured during the experiment. You should collect both qualitative and quantitative data during your experiment, but you should concentrate on process data (i.e., what is happening in the big picture). You should have participants complete at least 3 tasks--1 easy, 1 moderate and 1 difficult--using your prototype.

Experiment Results (10 pts)
Summarize the results of the experiment from your data. Explain how the users performed on each of the tasks (at least 1 easy, 1 moderate and 1 difficult task).

Experiment Discussion (10 pts)
Discuss your results. What did you learn from the experiment? How will the results change the design of your interface? Was there anything that the experiment could not reveal?

Appendix (5 pts)
The appendix should include copies of all materials involved in the experiment. This includes your consent form, demo script, and any instructions or task descriptions you handed out or read out loud to your participants. Finally, it should include all the raw data you gathered during the experiment. Merge the critical incidents logged by the observers and list them here. The appendix materials and screenshots do not count in your 6-10 page total.

How to Turn In:
From your group page, create a new page for your Low Fidelity Prototype assignment. You will probably want to call this page something like "<GroupName>LowFidelityPrototype" to ensure that the page is unique. Paste the text for your written report directly into your new page and embed any images and videos that you may have.

Finally, link this new page to the Low Fidelity Prototype page. After adding an entry to the bulleted list on that page, link that entry to the unique name that you picked for your assignment page in the step above.