21 March 2009

Storyboarding Interactive Experiences

A few months ago I attended a local AIGA Salon where we discussed the topic of storyboarding for dynamic and interactive media. The discussion was insightful and meaningful – covering the new challenges that we face as designers and artists when it comes to creating interactive experiences.

What Constitutes a Storyboard?

The term “storyboard” can be used to define a variety of processes used to flesh out a final interactive piece. These can range from simple sketches on a napkin to flowcharts and functional prototypes. The purpose is to provide your project team members with a sense of how the final experience will work. The key to storyboarding is not in any single scene, but how each scene fits within the context of the overall deliverable.

My Dot Grid and Moleskine Notebook

The common challenge mentioned in the salon was how to comfortably fit storyboards into the design process, and most importantly how to identify what should be represented in your storyboards. At my company, storyboards play a vital role in the design and development process. Ignoring this step leaves a chance that the experience will feel incomplete and disconnected.

Elements of Interactive Storyboarding

I find that my storyboards tend to have two always have two common traits: (1) my boards incorporate techniques used in the film industry, and (2) they focus on the specific features of the final interactive project.

Interactive Design is so closely related to the film industry that for me it just makes sense to pull from a lot of their visual cues. Techniques that represent pan-and-scans, camera shots, scene changes and movement all lend themselves very well to this industry. For anyone interested, there is a great book that I would recommend titled From Word to Image: Storyboarding and the Filmmaking Processes hone your storyboarding skills.

If I tried to storyboard an entire interactive project at a high-level I wouldn’t know where to begin. The whole thing would seem overwhelming. So what I do is break down my project into a bunch of predetermined linear flows. From here I can focus on creating boards that illustrate details each of these features.

Even a smaller microsite is made up of many predetermined linear elements. For example, a viral site with only a few pages and an emailing functionality might include:

  • Site preloader
  • Section preloader
  • Emailing entry, validation and confirmation funnel
  • Navigation interactivity and transitions
  • Scene transitions

Breaking these out allows you to put detail into those elements in a way that raises the experience to a more meaningful level.

I originally came from an illustration background so when I start my storyboards I like to go straight to paper to sketch out initial ideas. It’s fast for me because I know I can bounce the ideas off of other in a matter of minutes. From here we know whether or not to continue to explore an idea or scrap it all together and move in another direction.

The important this to note here though is that you don’t need to be a great artist or draftsman to create storyboards. The key to storyboards is to share ideas quickly. Not to create masterpieces. It might take some time at first if you aren’t used to creating them, but once storyboards becomes a natural part of your process, you’ll really begin to see the pay off.

Continue Reading