Prototyping user experience with comics

I listened to a podcast on Boxes and Arrows featuring Tom Wailes of Yahoo! describing how he and his team use comics to prototype user experience. This sparked my interest; I have been experimenting with the process and trying to find as many resources of using comics for prototyping as I can get my hands on. What I found appealing about prototyping with comics is that it puts the focus on the experience for the user rather than putting all the emphasis on the design structure of the website or application.

Usual outputs for the design phase include use cases, wireframes, user flows and site maps. These all appear to be interface centric, even user flows. Although user flows track how a user would typically be expected to traverse through a website, they don’t completely reveal what the user gains from the experience nor the concept. These methods also tend to focus on the details rather than the concept. Jared Spool explains this:

“What are the buttons? How do they work? What displays when? Where is everything in relationship to everything else in the design? No doubt, these are important issues, but they are only one side of the story.

What’s often missing is the view from the user’s experience: What’s frustrating? What works well? What is their motivation? What do they do with the results of the interaction? How does it dovetail into other aspects of their life?”

Comic prototyping does reveal the experience and concept, revealing the reactions of the user and their emotions and feelings as a result of using the interface. This gives a more rounded picture of the user experience and in doing so helps us place the outcomes of the experience into the design of the interface.

For some of my clients, seeing an interface wireframe and bridging the gap between that and the final website interface is tough. They find it difficult to understand how it corresponds to the final product and their audience of users engaging with it. It could be argued that it is my job to break down these barriers and to make the information architecture design more understandable. Which I do. However, using comic prototyping to assist wireframes the communication of how the final product will work and assist users is far improved. In some cases comic prototypes could replace wireframes completely. The graphical method of a comic and its narrative is easily understandable whereas wireframes to the untrained eye need to be explained.

---

Liked this post? Subscribe to my RSS feed to keep up to date on my other posts.

Tags: comic prototyping, interface design, jared spool, site maps, tom wailes, use cases, User Experience, user flows, wireframes

This entry was posted on Tuesday, May 26th, 2009 at 9:00 am and is filed under Prototyping, User Experience. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.