16 Design Tools for Prototyping and Wireframing [Design Practice]

Description

Gary Barber

16 Design Tools for Prototyping and Wireframing

In recent years the number of tools available to help you document and design your web site has just exploded. It seems that we all need a wireframing or prototyping tool at our fingertips (at least in the design arena). So in order to save you the hard work required to find one, I've assembled this list. It can be expanded upon, so if you use an unlisted application, please let me know and I’ll add it to the list.

The tools tend to fall into two categories:

purpose-built applications

multifunctional applications

Within these two groups I’ve found that usefulness can vary markedly among tools; some are only suitable for diagramming and wireframing, while others focus only on prototyping. The best are blessed with both capabilities and more.

Purpose-built Applications

1. Visio

I will state upfront that I’m not a big fan of Visio (price: from $US259, demo available); I’ve used it from time to time on various projects, but I’ve always found it fiddly and time-consuming.

Visio first started as an add-on to MS Word, filling the need for a business and technical diagramming tool and eventually graduating to separate product status. Visio’s power remains in the area of diagrammatical documentation; as a prototyping tool its functionality is limited at best. However Visio, like Omigraffle (below), is particularly suited to content map generation from CSV files . In the recent version, Visio 2007, the addition of the UML plugin has allowed for smoother importing of UML.

Visio has also spawned a number of add-on tools; Swipr (which is free) is the most relevant as it allows for rapid export of wireframes and screen flows into a clickable HTML prototype. This is very handy for creating the entire prototype in ...

Original URL

http://articles.sitepoint.com/article/tools-prototyping-wireframing

http://articles.sitepoint.com/article/tools-prototyping-wireframing