Sketches, Storyboards, and Critique

Posted: Wednesday, October 1
Draft Deadline: Thursday, October 9 (before classtime)
Final Deadline: Tuesday, October 14 (before classtime)
Point Total: This assignment is worth approximately 11% of your project grade (4.5% overall).

Assignment Overview

Your assignment is to sketch interface ideas for your project, identify three scenarios of use, and create storyboards depicting those uses. Your focus here is on visuals and visual storytelling rather than prose (whew, after TA02, right?). To help you with the assignment, please look at the Sketching and Storyboarding readings.

A Brief Timeline
On Thursday, October 9th, you must come to class with draft interface sketches (focus is on interface) and a draft storyboard sketch (focus is on narrative of use). The operative word is sketch. The artifacts need to be refined enough to elicit helpful feedback from your peers. We will use class time to "speed date" from team-to-team and collectively provide feedback on these artifacts.

On Tuesday, October 14, you must submit a PDF of your report to Canvas (before classtime).

What to Do

  1. To start, read the Sketching and Storyboarding readings (I've marked the readings that are required--feel free to dig deeper with the optional readings if you're so inclined). Sketching is critical to (interface) design--it serves a communicative function to articulate thoughts/ideas visually with your team and clients, it's lo-fidelity nature makes it more open to critique, and sketches serve a thoughtful/reflective function--the act of sketching is a dialogue with one's self. As Suwa and Tverskey (2002) note "designers do not draw sketches to externally represent ideas that are already consolidated in their minds. Rather they draw sketches to try out ideas, usually vague and uncertain ones. By examining the externalizations, designers can spot problems they may not have anticipated."

  2. Generate a list of tasks that users should be able to accomplish with your application. This is a brainstorm activity--so ballooning elaboration is essential (the full list of tasks should go in your report Appendix). Then, pare this list down to three primary (representative) tasks. Justify why these three tasks were selected in your report.

  3. Create a storyboard of a user (or users) using your application and accomplishing the three primary tasks you identified above. You can think of this storyboard much like the opening skits in some of the presentations. They are quick, highly engaging and expressive ways of articulating the goals and reasons for your application. If your tasks are very disparate and non-intersecting, feel free to create a storyboard to help describe each task. It's up to you. Be creative. Again, this storyboard must be sketched on paper and scanned in. All storyboards should have accompanying text in at least some of the storyboard panes (just like comics or movie storyboards).

  4. Think about the interfaces and interactions necessary to accomplish these tasks: what does the "main" screen look like? What are the primary interface elements and why? For the primary interface screen, I want you to create six completely different design sketches (with annotations). I then want you to choose two secondary interface screens and generate three different design sketches for each (again, by different, I literally mean three completely different ways of rendering your interface--not simply moving a button from one corner to another). These sketches must be done on paper and scanned in (a high quality cell phone picture is fine too); each sketch must be properly labeled, captioned, and annotated.

  5. In class on Thursday, Oct 9th you will explain your application via the storyboard, show off your various interface sketches, and receive design feedback from your teammates. You will take notes on this feedback (please include the raw notes in your Appendix), synthesize the most important findings in your report, and iterate on the most promising sketch designs.

  6. Iterating on the interface sketches: based on your fellow classmates' feedback, you must create at least one new refined primary interface screen sketch and one refined sketch for the two secondary interface screens (so, at least three refined sketches in total). For each new sketch, please provide a justification on the changes--these justifications may be tied to the in-class design critiques or simply your further reflections about the design. Again, these sketches must be done on paper and should be labeled, captioned, and annotated properly in your report.

  7. Finally, iterate/improve on your storyboard: it's likely that your initial storyboards lacked core elements that were important to your story, that you saw storyboards from other students that inspired you, or that you received feedback on how you could improve your storyboard. Iterate on at least storyboard in your report. You must include both in your report and explain what changed.

The Report (118 pts)

Note: we will grade the report out of 118 points; however, the grade used in Canvas will be out of 46 (the % will be the same).

Top of Report (5 pts)
At the top of the report, please include a title (centered and bold), a tag line, and a listing of each team member. For each person listed, include 1-2 sentences on their primary role/accomplishments on this assignment. (5 pts).

Section 1: Abstract (5 pts)

A brief executive summary of this report--including a high-level description of your tasks and what you learned from the peer feedback.

Section 1: Introduction (5 pts)

Your introduction should focus on describing the primary concept for your application and how this assignment aided you in design.

Section 2: Task Descriptions and Storyboards (29 pts)

This section should start with an introductory paragraph describing, at a high level, the kinds of tasks that you think are relevant to your application. Also include a description of how you performed the task brainstorm and culling down to three primary tasks (include a reference to the Appendix of all the brainstormed tasks here). The next three paragraphs should then be dedicated to describing each of the three tasks in more detail. Begin each of these paragraphs with a bolded inline "task name" header, a brief prose description, and a reference to the appropriate storyboard. The storyboard(s) should not be in the Appendix--do your best to fit them into the report itself. Be sure to include pictures/scans of at least one or more of your storyboard iterations and a description of what changed after the in-class feedback session.

For grading, you will receive up to:
  • 5 pts for your introductory content
  • 4 pts per task description (12 pts total)
  • 12 pts for the storyboard(s)
  • ----------
  • 29 pts total

Section 3: Initial Interface Sketches (46 pts)

For the introductory paragraph, describe the concept/idea behind your primary interface screen and the two secondary screens (i.e., what purposes are they intended to fill). The next 1-2 paragraphs should describe how you approached the sketching process. Then, include three subsections: (i) Primary Interface Screen Sketches, (ii) Secondary Screen One Sketches, and (iii) Secondary Screen Two Sketches. For each subsection, include a bullet-pointed list that points to each of the sketches and provides a 1-2 sentence description. Again, I want these sketches in-line in the report itself rather than in the Appendix.

For grading, you will receive up to:
  • 10 pts for introductory content
  • 18 pts for (i) Primary Screen Sketches and descriptions (3 pts per sketch/desc)
  • 9 pts for (ii) Secondary Screen One Sketches and descriptions (3 pts per sketch/desc)
  • 9 pts for (iii) Secondary Screen One Sketches and descriptions (3 pts per sketch/desc)
  • ----------
  • 46 pts total

Section 4: Learnings from Design Critique (10 pts)

This should be a 3-4 paragraph section describing the design critique process and your primary findings.

Section 5: Refined Interface Sketches (12 pts)

In this section, describe your three refined interface sketches (or more) and explain what changed and why. Again, include the sketches directly in the report (to the best that you can).

For grading, you will receive up to:
  • 4 pts per refined sketch + description
  • --------
  • 12 pts total

Section 6: Appendix (5 pts)

The appendix should include:
  • A raw list of all the tasks you brainstormed relevant to your application
  • Notes from the in-class design critiques (and, perhaps, other critiques sessions that your team may have run on its own).

Submission

You will submit two PDFs to Canvas.
  1. PDF One: The full report
  2. PDF Two: The full report with all images, tables, etc. removed (and the pages repaginated accordingly). This will be used to assess the 5 page limit. We will deduct 20% for each page over the limit (prorated for partial pages). Note: there can be no other differences between PDF One and Two.