3-3 Prototypes and Interaction Storyboards

Most web pages and apps have multiple screen views. For this exercise we want to look at two ways to demonstrate concepts having multiple screen views.

• Interaction storyboards link a few sketches together visually to explain how people will interact with the product.

• Interactive prototypes provide a way to simulate physical interactions using sketches.

Standard Deliverables ✓

1. Sketch an interaction storyboard of a trivia app like the example above, but make it uniquely yours. You can use starting template, like this one, for sketching if you like.

2. Photograph your storyboard and save the file so that you can edit it with Google Drawing or a similar application.

3. Create individual image files for each or your sketched screen shots to build your interactive prototype. For example: screen1, screen2, screen3.

4. Login to marvelapp.com and create an interactive prototype like the example above.

   • Demo of how to use Marvel App

5. Create a document that has your photographed storyboard and a link to your interactive prototype on Marvelapp.

Advanced Deliverable ✓+

Create a second sketched interaction storyboard that is distinctly different from your first.