autumn 2008

CS147: Introduction to Human-Computer Interaction Design

Assignment 4: Storyboard — Grade Value: 50 points
Due by noon on Thursday, October 16 (Submitted Online)

brief

In this assignment, you and your group will take its product concept a step further by storyboarding it. The storyboards should flesh out a medium-detailed interface for your idea (inspired by your research on "Inspirational Designs" and insights from "Discovery") and show its usage in the context of performing “real-world” tasks (building on the "Discovery" assignment).

assignment

You have already formed small project teams of three people, informed by the work areas: Design, Development, and Evaluation. This will be your project team for the rest of the quarter. Though you have a group, each individual in the group must submit a storyboard for this assignment and it will be individually graded.  You are encouraged to discuss with your team about what ideas to storyboard so as to maximize productivity and explore multiple concepts concurrently.

A storyboard is a comic-strip-like set of drawings about what your interface does and how it is used to accomplish tasks in an actual usage scenario. Draw inspiration from McCloud’s “Understanding Comics” reading as well as from the lectures this week. Your storyboards should be titled “How might we …?”, where you are to fill in a task to be accomplished. For example, your storyboard may be titled “How might we make finding an ice cream shop easier?” or "How might we improve the experience of cooking for yourself?" For the former, you could show a family on summer vacation who is looking for a cold treat. You could then illustrate how they would use your mobile ice cream locator interface to enter their desired flavor of ice cream and get directed to the nearest parlor. You should include sketches showing your interface’s actual presentation and layout, especially if there are tasks that will need to be completed by navigating menus, pressing a sequence of buttons, etc.

Be sure to check out Amal Dar Aziz's excellent Guide to Storyboarding.

Pick a primary task to be done with your interface - make it a task complex enough to fill up a storyboard. Create 3 alternative storyboards for accomplishing the same task, varying the interface itself, the scenario, or both. Each storyboard should require 5-8 panels, so in total you will have 15-24 panels to turn in. Each storyboard should fit on two 8.5” x 11” sheets of paper and be drawn with a thick pen like a Sharpie. Clarity communicativeness, and innovation is more important than aesthetics here.

To complete this assignment, each group member must separately submit online:

To clarify: each member of the group must make their own 3 storyboard variations and submit them online (but feel free to coordinate with your group so you choose a variety of tasks relating to your product concept).

submission

Your summary will be submitted online as a body of plain text and digital photographs of your storyboard panels.

The submission website can be accessed through the course website with your SUNet login at https://hci.stanford.edu/cs147/studio/

To submit the assignment, log in to this website and click the Submit Assignment link in the Current Assignment box. On the submission page you can enter the writeup as well as upload any number of images.  Clicking the "Save" button will save the current version of your writeup.  Your latest save will automatically be submitted for grading when the assignment is due.  You can save as many times as you need until the deadline.

Submit early! Late assignments will not be accepted!

evaluation criteria & grading rubric

Grading Dimension Guiding questions No effort or submission Bare minimum Satisfactory effort & performance Above & Beyond
Task-choice (max 5 points) Appropriate choice of tasks for the project idea - is it non-trivial, interesting, and based on real observations/research?  Does it illustrate distinct alternative scenarios with sufficient variation? 0 3 points; Task is not based on user observation, produces scenarios that are too similar 4 points; The legitimate task is based on user observation, affords clearly different scenarios 5 points; Authentic, specific, and measurable task arises from user observations and affords radically different interpretations
Design (22) Do you have a well thought-out idea and interface?  Did you include all 3 storyboards?  How well do the panels flow between each other, use picture annotations appropriately, and illustrate interface details? 0 15; Storyboard is present but leaves out necessary details or are not particularly useful ideas 18; Storyboards communicate interesting and non-obvious ideas 21; Distinct storyboards illustrate interesting and fresh ideas
Clarity (max 13) Did you include clear and comprehensive illustration of the interface (including annotations for how the major components will work)?  Did you include a meaningful paragraph explanation? 0 8; Design obfuscates design ideas with messy labels but general idea is present 10; Storyboards communicate effectively & do not require additional clarification or explanation text 12; Illustrates ideas intelligently, focusing on important elements & uses labels sparingly to be easily digested
Research (max 10) Uses of insights from the Discovery assignment? 0 6; Design ideas are based more on author's ungrounded ideas than on research 8; Design ideas are taken directly from user observation 9; Design ideas are based on user observations but go further to addressing root of breakdowns or opportunities

Student Examples

qcvar's assignment
cja's assignment
brandonh's assignment