ICS 4 • David G. Kay • UC Irvine

Fifth Homework (Mini-Project Part II)

This assignment is due by 7:00 p.m. on Tuesday, March 5.

We expect that you will continue this assignment with the same group you worked with on the last assignment. If you need to change personnel, send a message to ics4@uci.edu.

Overview

For this assignment and the next one, you will continue the (re)design of the web site you chose in the last assignment. This (re)design process will span both assignments. Here is an overview of the entire process; the italicized text signals tasks that will be part of the next assignment rather than this one:

• Decide on what aspect(s) of your site you will (re)design
• Pick one of these two approaches:
  1. Create two alternative designs, build prototypes of each, and run user tests on each alternative. We'll call this the "two-alternative approach."
  2. Create one design, build a prototype, run user tests, refine the design based on the tests, build a new prototype, and run another set of user tests. We'll call this the "refine-one-design" approach.
• Describe your (re)design, the user tests you conducted, what you learned from the tests, and how your test results affected your final (re)design.

Part (a)

Decide on what aspect(s) of your site you will (re)design. You will probably consider some combination of page design and navigation. Thinking in terms of user tasks, you should probably focus on a task or combination of tasks that should ideally take the user from three to five minutes; that's long enough to be interesting but short enough to make creating the prototype and running the user tests manageable. If you have concerns over whether the aspects you have chosen are "enough" (or too much), send a message to ics4@uci.edu or use Piazza.

Next, choose an approach. If you can think of two different ways to do the design, you might choose the two-alternative approach. If you think there's one good way to do it, choose the refine-one-design approach. Note that both approaches should be the same amount of work: in each, you'll build two prototypes and run two sets of user tests. The difference is the order in which you do them.

Part (b)

Create one or two (re)designs (depending on which approach you're following). Your group should generate a variety of ways your site could better meet its goals and consider the alternatives' relative merits before settling on one or two. Your HCI notebooks should be a good source of examples or inspiration.

Build a prototype for your design(s). (If you're following the two-alternative approach, build both prototypes now. If you're doing refine-one-design, just build the first-round prototype now.) Your prototype should include all the alternative clicks/entries/actions/displays that the user may see or need while working through the tasks using the prototype. Follow the guidelines we discussed in class (and saw in a couple of video clips).

You may build your prototype on paper or using a wireframe mockup tool; it's your choice. In preparation for the user-testing part of the next assignment, some of your teammates should use your prototype to "walk through" the tasks you're focusing on; this will help find obvious bugs or flaws in your prototype.

Part (c)

Conducting the user tests and using their results will be part of the next assignment, but it would be wise to think about recruiting your user test subjects and making arrangements now.

For this assignment, turn in:

• a description of the aspect of your site you will (re)design (about half a page)
• a sentence or two that describes which approach you are taking: designing two alternatives and testing them both, or creating a design, testing it, creating a refined design, and testing the refined design
• your prototype(s)—two of them for the two-alternative approach, one (now) for the refine-one-design approach.
  • If you're using Mockingbird, (a) from Mockingbird's File menu, export your project to a PDF file and submit it, and (b) using the Share icon on Mockingbird's toolbar, get a URL for your project and paste that URL into the document you're submitting. The default sharing settings should allow anyone with the URL to view your site. If you're using Moqups, the process is similar; the Share and Preview menu is a the top right of the screen (it's a box with an arrow coming out of it).
  • If you're using paper, take a few photos of your paper prototype and submit them.