« Web Design is Like Building a House | Main

May 12, 2008

How to Use a Storyboard 'Comic' to Help Design Your Web Site (Video)

That one-day crash course I'm teaching on B2B Web design had an unexpected highlight with participants: We did an interactive session on "design comics," which are a quick way of plotting out web experiences and including a human touch. And then we showed how to put together PowerPoint comics based on the session, like the one below:

Example of a design comic storyboard with panels

This was a big hit, so I thought I would share the technique with our Cisco.com audience.

You can use design comics in a couple of ways. With our class we did one example where we storyboarded a future web site idea. We did another example, shown in the team picture below, where we documented a current experience that needed improving.

Design comic storyboarding with Nielsen Norman class

That's me (far left), co-instructor Marilyn Salzman (far right), and some members of the class with a story about online registration.

So, how does the technique work? It's pretty simple. Here's a seven-minute video I put together with Janet Wallin from Cisco (playing "Mary" in the video) showing how to plot out a storyboard and then make a PowerPoint video:

P.S. Here's a closeup of one of the sheets from the class, showing a slightly different notation style than we used in the video:

P. P. S. I should mention also that we have a couple of additional runs of our course ahead as part of the Nielsen Norman Usability Week conferences in London (May 23rd) or San Francisco (June 20th).

Technorati Tags: Cisco Design Web-Design CustomerExperience