Wireframes are a simple yet effective way to plan and prototype the layout of a website before writing any code. They help structure ideas and test assumptions, and are great for facilitating early feedback from clients. That's why, over the past few years, wireframing has become an integral part of web design and web development. Therefore, the question is not whether to create wireframes, but rather how.
Although there are dozens of web-based wireframe tools available, I prefer to do my wireframing in a native desktop application for the following reasons:
- I can work offline at places with poor or no internet connection, e.g. when riding the train or a plane.
- I am not dependent on someone else to take good care of their servers.
- I prefer to pay a one-time fee instead of monthly subscription charges.
- I have the freedom of knowing that I can continue using the tool even if its vendor goes out of business tomorrow.
In this article, I will introduce you to seven desktop-based wireframing tools for Windows, Mac OS X or Linux.
Non-Web-Based Wireframe Tools
WireframeSketcher can be installed as a plug-in for any Eclipse-based IDE and is also available as a standalone application for Windows, Mac OS X and Linux. It lets you choose between two different styles for the look of your wireframes: Sketch (to make wireframes appear hand-drawn) and Clean (with crisp, straight lines). Other major features include the ability to create interactive prototypes and the possibility to present wireframes as storyboards.
WireframeSketcher can be tested for 14 days without restrictions; afterward, you have to pay $99 for a single-user license.
PowerMockup is an add-on for turning Microsoft PowerPoint into a wireframe tool. It provides a library of wireframe elements and icons that you can drag and drop onto a PowerPoint slide. You can also create your own elements using standard PowerPoint shapes and add them to the library.
PowerMockup works with PowerPoint 2007 and 2010 (Windows only) and can be tested as a trial version free of charge. The full version is priced at $39.95.
Another wireframing solution for Windows only is SketchFlow, a UI prototyping tool provided by Microsoft as part of its Expression Studio suite. While SketchFlow is a little complicated to use and has a rather steep learning curve, it is extremely powerful when it comes to creating interactive prototypes that simulate real functionality. You can bind controls to data sources or even make use of the .NET Framework for adding application behavior.
Expression Studio 4 Ultimate, which includes SketchFlow, costs $599. A 60-day free trial version can be downloaded from the Microsoft website.
Axure RP is one of the oldest and most comprehensive prototyping solutions available. It supports the whole chain from drawing quick wireframe sketches to creating interactive, high-fidelity design prototypes and generating detailed specifications.
Axure RP is available for Windows and Max OS X. To try it out, you can download a 30-day trial version from the Axure RP website. A single-user license for Axure RP costs $589.
Among the seven tools listed in this article, Pencil is the only one that's completely free and Open Source. It can be installed as a Firefox add-on or as a standalone application for Windows, Mac OS X or Linux. Pencil is easy to use, includes a large set of stencils, supports linking between pages, can export to various formats, and allows you to create your own personal collection of stencils.
As mentioned before, Pencil is free (released under GPL version 2). Don't hesitate to give it a try.
By default, MockupScreens uses a Windows XP style for the screen prototypes that you create. This makes them look a bit outdated at first, but you can easily switch to a different skin via a drop-down menu in the toolbar. Compared to other wireframing tools, MockupScreens provides a relatively small number of basic user interface elements and icons. Two great features of this tool are its ability to annotate individual elements and the possibility to group and arrange screens in scenarios.
MockupScreens is available for both Windows and Mac OS X. The price for the full version is $99.95.
DesignerVista allows you to create both low-fidelity wireframes and high-fidelity GUI mockups. It supports page templates and themes, can export to HTML and PDF, has a slide show feature, and is able to generate UI specification documents.
Although some of these wireframe tools may seem costly, online tools can cost around $60 per month, so in the long run, offline tools can save you money and they are far more convenient.
Do you use an offline or web-based wireframe tool? Which is your choice? Please share your comments with us in the section below.