Software Prototyping – Part 3: Tools

January 11th, 2010

ToolsIn the first two articles we discussed why you should consider creating prototypes and whether that prototype should have a role just in the design phase as a “Throwaway Prototype” versus an “Evolutionary Prototype” that may evolve into the final product.

While functional prototypes always involve development tools (and associated skills), there are, essentially, four classes of tool for creating user interface prototypes:

1. Pen and Paper

It doesn’t get any more low tech than this, which is great because it means that absolutely anyone can take part in the design process. User interface designs can be hand drawn or pre-prepared stocks of user interface elements can be laid out on a page.

Paper sketches can be produced very quickly but making alterations to a design can be somewhat difficult leading to repeated effort if a design needs to be restarted from scratch. It’s often best to spend more time thinking before committing pen to paper.

In test and review situations, a human can act as the computer and present the effects of user actions on a design. It’s highly involved and may be time consuming to run user tests, but it can be very effective.

Of course, this isn’t necessarily restricted to paper. Many design sessions involve whiteboards instead of paper – anything that takes you away from the computer and into the undisputed realm of the ‘mock-up’. But any whiteboard design that needs to be ‘saved’ will inevitably end up as a photo image and/or paper printout.

2. Drawing tools

Generic drawing tools can be used to mock-up user interfaces with the obvious advantages over pen and paper of being easier to edit, duplicate and distribute for review.

Many of the popular drawing tools (Microsoft Visio, The Omni Group’s OmniGraffle, etc.) have an increasing number of UI stencils available to them. However, many of these are based on graphic images that do not scale well.

Graphic editors (such as Adobe Photoshop) can also be used for creating interface mock-ups, from low fidelity wireframes to high fidelity pixel perfect renditions. This has been the preferred approach for many Web designers where the exact visual design of graphic elements is important. Expert knowledge of these tools is often required and producing designs quickly from scratch can be daunting.

However, with all of the generic drawing or graphics tools, what you end up with is a set of static screen designs but no easy way to communicate how the parts interact and the workflow between them. Although there are some documented techniques to get around these limitations, they take some skill and learning.

One approach is simply to take printouts of the screens and perform paper prototyping review sessions.

3. Development tools

Development tools have always been an option for the production of prototypes with Rapid Application Development (RAD) tools having earned some degree of popularity. The main benefit is being able to produce a fully working prototype that acts just like the real thing even if some of the actual functionality is being emulated with dummy data.

For evolutionary prototyping, this is the only way to go, but for throwaway prototyping, the additional time and skills involved and all of the disadvantages with regards to evolutionary prototypes, make this a fairly poor choice.

4. Specialised prototyping tools

Here’s where it gets more interesting. Combining the benefits of drawing tools and, in some cases, development tools, specialised prototyping tools (like GUI Design Studio) allow you to rapidly create software prototypes with features that allow the application interaction and workflow to be explored.

Because they are intended specifically for the design of user interfaces, they have dedicated functionality that is not necessarily found in the drawing tools but are as easy to use so they don’t require any specialised technical skills.

Many of these tools will allow designs to be easily annotated, shared for review and used to generate specification documentation.

Of course, I’m biased, but these are really the best type of tool to use for software prototyping.

Whatever approach you take, software prototyping can reap huge benefits in the production of your software projects and make them more likely to succeed.

 

2 Responses to “Software Prototyping – Part 3: Tools”

  1. Extremely interesting and helpful article indeed. I read your post about software with a complete satisfaction? I must confess that I am a majorfan of it, so all information related with enterprise framework and patterns is very attractive to me. Thanks a lot for sharing this amazing entry and I will be waiting for other great blog pieces from you in the nearest future. By the way , I will for sure bookmark your website .

  2. DESIGNING THE IPHONE USER EXPERIENCE: A USER-CENTERED APPROACH TO SKETCHING AND PROTOTYPING IPHONE APPS…

    […]Software Prototyping – Part 3: Tools « Caretta Software Blog[…]…