Originally published: Mar 18, 2010
Editor's note: This article is a chapter from Todd's book Prototyping: A Practitioner's Guide.
In 2008, I ran the first survey on prototyping for this book. My goal was to understand what tools UX people are using for prototyping, why they’re using those tools, and what they want from those tools. I also wanted to see how my experiences and choices compared to the rest of the UX community.
Roughly 200 people responded from a variety of UX backgrounds, including researchers, designers, developers, product managers, and business analysts. This chapter discusses the results of that survey and offers some guidance for selecting the right prototyping tool for your environment.
So why choose HTML, Flash, Fireworks, Axure, or something else? According to the survey, these are the top influencers that drive tool choice, in order of importance:
I can definitely find my own influencers in that list with one exception—knowing the audience and intent. This is my number one concern. But my other concerns, like familiarity, availability, comfort, availability of GUI widgets and AJAX, or ability to create my own are definitely in that list. They just might be in a slightly different order.
You’ll see this list again later in the book. I’m going to use it to evaluate a number of different prototyping tools.
You may notice the presence of creating usable source code. You may also notice that it’s at the bottom of the list. This one’s a bit tricky.
Creating prototypes that are reusable for production isn’t something that’s commonly done or recommended. There are several reasons for this. Prototyping is a rapid, iterative process. It’s a process for exploring ideas, failing often, and learning quickly. If you’re focused on creating production-level code, you start to lose some of the value of rapid iteration.
On the other hand, if you can produce reusable source code with very little or no additional effort, then your prototyping tool has the added value of development time.
At the time of this book’s publication, there isn’t a dedicated prototyping tool for non-coders that can create rapid prototypes with little effort and produce reusable source code. If you want a prototyping tool that produces reusable source code, you’ll have to learn to code HTML or use a development framework like Ruby on Rails.
As I expected, the usual suspects like paper, PowerPoint, Flash, and HTML showed up on the most common tools list. Also, not surprising is that participants used more than one tool. For instance, they might use a combination of paper for sketching and then go into Photoshop and finally HTML.
In the past couple of years, a couple of newcomers have hit the scene and continue to gain traction, namely Axure RP and Fireworks. While Fireworks has been around for some time, only recently has it gained built-in prototyping capabilities. Here’s a breakdown of the most common tools being used for prototyping in the UX field as of 2008.
I’m sure you can see a number of familiar tools in that list. Did you notice any surprises?Probably the biggest surprise to me was the number of people who use Visio for prototyping. I expected to see Visio, but didn’t expect nearly 60 percent. Another surprise was the presence of Excel and FileMaker for prototyping. While this made up less than one percent of respondents, I was surprised to see it at all. Finally, the sheer number of prototyping tools being used for prototyping was a bit surprising—over 26 total if you include the items listed under Other.
Paper continues to be at the top of the list. The continued growth of AJAX libraries like Prototype and jQuery, combined with the increasing number of auto-generating tools like Axure, iRise, and Fireworks, has made creating interactive prototypes easier than ever.
Ruby on Rails (RoR) is another one that has seen an increase in use for prototyping. Rails is a rapid application development framework, which makes it an ideal tool for both prototyping and production. Rails maintains all the advantages of HTML with the added capability to use dynamic data. Here’s a breakdown in Table 5.2 of the most common types of prototypes that people in the UX community are building.
In some cases, I need to use something other than HTML, for example, for mobile or TV. If I need to prototype for mobile, I typically use paper or Flash. If I need to prototype, say, for instance, a DVR interface, I use Flash or Keynote.
Check out Todd Zaki Warfel's Eight Guiding Principles for prototyping. These principles are the foundation for more effective prototyping, and will improve your design process whether you're a seasoned prototyper or just getting your feet wet.Read more about Todd's virtual seminar, A Practitioner's Guide to Prototyping.
Have you explored tagging within your organization? What have you found that works? What should others avoid? We'd love to hear your experiences at the UIE Brain Sparks blog.
Read related articles: