4 ways to prototype faster

We can prototype faster by following 4 key principles:

• Start prototyping with paper
• Use one electronic tool, not several
• Use a prototype that generates specifications
• Support collaboration

I'd like to describe how we can apply these principles in a typical Agile environment.

Start prototyping with paper

The best way to speed up your prototyping efforts is to start with paper. One of the tenets of Agile is that working software is a key measure of progress on a project. Sadly, developers sometime interpret this to mean that they should be creating computer-based prototypes right from the start.

Here’s the best kept secret in prototyping: the biggest mistake you can make is to start prototyping in front of a screen.

The problem with screen-based prototyping is that it does not encourage you to fully explore the design space. Instead, you tend to latch onto 1-2 design ideas and prototype those.

In the early phase of design — whether you’re designing a new system or a new workflow — you don’t want 1-2 ideas: you want dozens. That makes paper and Sharpies the prototyper’s new best friends. In this initial phase of design, you should create dozens of paper interfaces, iterate on the ones that have value, and then develop interactive paper prototypes that you can use to test out the design with users.

Use one electronic tool, not several

When you move to electronic prototyping, there's a second way to improve your efficiency: use the same electronic tool throughout. I often see design teams start their prototyping effort with tools like Keynote and Balsamiq, move to Photoshop or Fireworks to create prototypes with higher visual fidelity, then turn to Dreamweaver or Flex to add interactivity for final usability testing.

One problem with this approach is that designers need to recreate the design in their favoured tool, which creates inefficiencies and slows down development. It also creates problems in managing all the software and files: for example, using tools like Visio to define user journeys which relate to screens designed in Photoshop which have been annotated in MS word.

You’ll be much more efficient if you standardise your prototyping efforts around a single platform.

Use a prototype that generates specifications

A third way of making the entire process more streamlined is to ensure your prototype contains the detailed specifications that developers need to implement the design. The devil, as they say, is in the details.

A common mistake made by novice prototypers is to hand their prototype to the developer and ask them to code it up. Those without real world experience of Agile may be tempted to think that Agile eliminates the need for documentation — in fact, it only reduces the amount of documentation. Agile may not need massive requirements and specification documents, but it still needs some information to supplement prototypes so that we can define the goals for an Agile sprint (e.g. hex values for colours, and the contents of drop down boxes).

You could cut and paste Photoshop images into Powerpoint, Word or Visio for annotation. But this is very laborious and you’ll need to update the specification document with any changes to the prototype’s design. (Indeed, this is such a nightmare that I have known major corporations shy away from making sensible changes to prototypes purely because updating the specification documentation would have been so time consuming!) Instead, choose a prototyping tool that allows you to generate these specifications from the prototype or that allows developers to easily inspect elements so they can see what they need to implement.

Support collaboration

You can make the whole process even more efficient by using prototyping tools that support collaboration.

The ideal prototyping tool:

• Supports multi-user prototyping. Your tool should support file management, revision control, access rights and data integrity (ensuring two or more people are not updating the same work at the same time).
• Allows you to easily distribute the prototype for feedback. Some organisations are still distributing prototypes by simply emailing a zip file containing lots of individual files. This means feedback takes the form of un-coordinated email replies. Instead, choose an electronic tool that helps you structure this feedback.

My recommendation

Those of you that know me will also know that I’m a great fan of Axure and iRise, both of which address many of the issues I’ve listed above. These tools have been specifically engineered to meet the demand of prototyping in a modern software development environment.

If you’re in an environment where you’re having to do more with less, and do it more quickly, then try adapting this Lean UX idea to your own practice.

If you like this, you'll also enjoy our Axure training courses.

About the author

Dr. Ritch Macefield (@Ax_Stream on Twitter) holds a BA in Creative Design, an MSc in IT/Computing and a PhD in HCI. He is an acknowledged expert in Axure having led Axure projects for clients like Thomson-Reuters, Dell computers and Vodafone. He was a panel speaker at Axure World 2012, contributed to the book “Axure RP 6 Prototyping Essentials” and founded the Axure RP Pro LinkedIn Group.

Love it? Hate it? Join the discussion

Which prototyping tools do you use? What tips would you give people to prototype faster?