Home

Interactive Prototype

Assigned: March 16
Brief Plan Due: March 18
Due: April 8 Before Class

Overview
In this assignment you will build a prototype of your interface that supports interactivity. The design of your interactive prototype should be a clear evolution from your low fidelity prototype, exhibiting changes based on your evaluation in the previous assignment. Ideally, you will build a high fidelity prototype on an appropriate platform for your project, such as an extension to the Fennec web browser or as web application running on a real server. I may also allow interactive mock-ups created in PowerPoint or Flash. You will submit a brief implementation plan to me early in the project to ensure that we agree on your choices.

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

Step #1: Submit a brief implementation plan Due March 18, 5 points
In order to make sure that the your group and the instructor are on the same page, please e-mail a brief description of your implementation plan to the instructor (jwnichols@us.ibm.com) by March 18. Your plan should include the following:

  • Group Name
  • Describe your proposed implementation platform (e.g. Fennec extension, web app, iPhone app, Flash mock-up, etc.), and briefly justify your decision (one paragraph is sufficient).
  • Briefly describe what your team will need to learn to be successful with your chosen implementation platform.
  • (Optional) Briefly describe any major changes to your project focus from the low fidelity prototype assignment. A major change includes eliminating a large set of previously planned functionality or a modification to your targer user group. These changes could be due to the results of your evaluation or a pragmatic desire to make your ideas easier to implement.

Step #2: Build your prototype
Use the results of your low-fi prototype tests to design a revised user interface. Make sure that this interface supports at least 3 key scenarios/tasks that your target users will want to perform. The tasks that most of you used in the low-fi assignment should be sufficient for this. However you should update or replace simple or partial tasks that did not adequately cover your proposed functionality. Make sure to revise your tasks based on the feedback from your users. If you are making significant changes to your tasks, make an appointment with me to present your new tasks, design ideas, and storyboards for discussion.

You will then build an interactive prototype of your revised design. Your prototype should allow users to perform the key tasks mentioned above. In addition, the design of the prototype should now start to account for the environment in which it is implemented. For example, if you are planning to create a mobile browser extension, then you need to start taking into account constraints such screen size, etc.

You should implement enough functionality so that a user can adequately evaluate the interface for your key tasks. If necessary, you may choose to use the wizard-of-oz technique to simulate some of your functionality. For example, an application requiring voice recognition could use a hidden human-operator to manually perform the recognition behind the scenes.

You have a short period of time to complete this prototype, so you should focus on showing only what is essential and try to avoid implementing functionality where it is not necessary.

Step #3: Prepare a brief report Due April 8, Before Class
Your report should include the following:

  • Each team member's name and their role in this assignment. 2 points
  • A brief summary of the problem your interface solves and a brief high-level description of how the interface solves the problem. (one paragraph) 3 points
  • List the 3 (or more) key tasks that your prototype interface supports, and describe any changes made to these tasks from your low fidelity prototype. As before, you should have at least one easy, medium, and hard task. 5 points
  • A list of changes that you decided to make based on your evaluation of your low fidelity prototype. Include a description and rationale for each change. Screenshots, sketches, and storyboards may help here, but are not required. 20 points
  • A link to your working prototype, and instructions for how to install and/or run it. Supplement with screen shots if required. 30 points

As with previous assignments, please create a page on the class wiki for your report. Link your report both from the Interactive Prototype page and your own group page.

Step #4: Prepare a brief presentation Due April 8, In Class 20 points
You will have 6 minutes to present your interactive prototype to the class on April 8. This is a short presentation slot, so you will need present your prototype concisely. You must show a live demonstration of your interactive prototype, but otherwise the content of the presentation is flexible. One possible outline:

  • Overview of the problem
  • High-level view of your solution/design rationale
  • Demo at least one interesting aspect of your interactive prototype (perhaps the difficult task?)
  • Brief description of next directions

Your presentation should be uploaded to the wiki and linked on your interactive prototype page. This may be done after class on April 8.