Wireframes have become indispensable for professional web and software development projects. They help all parties involved—the client, managers, graphic designers and developers—to visualize the final product and identify potential problems early on in the process, thereby minimizing the headaches at later stages.
While paper and pen are great tools for sketching initial wireframes and experimenting with early design ideas, further work is best done using a software application that supports editing and versioning. In this article, I will introduce you to ten very different wireframing tools with price tags ranging from free to several hundred dollars.
- 1 PowerMockup—Wireframing Add-on for PowerPoint
- 2 Moqups—Online Mockup and Wireframing Tool
- 3 Fluid UI—Online Prototyping Tool for iOS, Android, and Windows Apps
- 4 Wireframe.cc—Free Minimal Online Wireframing Tool
- 5 Axure RP—Extensive Wireframing Suite
- 6 Balsamiq Mockups—Flash-Based Rapid Wireframing Tool
- 7 Pencil—Open-Source GUI Prototyping Tool
- 8 UXToolbox—Windows-Based Wireframing Tool
- 9 Mockups.me—UI Wireframing Application
- 10 Live Wires—Wireframing App for iPad
- 11 Bottom Line
PowerMockup—Wireframing Add-on for PowerPoint
PowerMockup is an add-on that turns Microsoft PowerPoint into a wireframe tool. It adds a new panel to the PowerPoint window, which contains hundreds of wireframe elements and icons that can easily be positioned on a slide via drag-and-drop. PowerMockup works with Office 2007, 2010, and 2013 for Windows. A single-user license for PowerMockup costs $59.95; team licenses are available with significant volume discounts.
Moqups—Online Mockup and Wireframing Tool
Moqups is an online HTML5 application that produces clean vector-based wireframes. Developed by a team of six passionate engineers from Cluj-Napoca, Romania, it is completely free, and there is no requirement to register. Just recently, an optional premium version was introduced with live collaboration, master pages, unlimited revisions, and other interesting features.
Fluid UI—Online Prototyping Tool for iOS, Android, and Windows Apps
Fluid UI is a web-based prototyping tool for mobile apps. It can be used to create everything from low-fidelity wireframes to high-fidelity mockups and prototypes. The tool comes with libraries of UI elements for iOS, Android, and Windows 8 apps. An account for one project with up to ten screens is available free, and paid plans start at $29 per month.
Wireframe.cc—Free Minimal Online Wireframing Tool
Wireframe.cc distinguishes itself from other wireframing tools by having an extremely simple interface without many bells and whistles. When you visit the wireframe.cc website, you can immediately start drawing by clicking and dragging the mouse across the canvas. To save a wireframe, you simply click the “Save” button, and a unique URL will be generated that you can bookmark and share with others. Wireframe.cc is free to use; a paid-premium version with additional features is expected shortly.
Axure RP—Extensive Wireframing Suite
With prices beginning at $289 for a standard license, Axure RP is not exactly a bargain. The tool’s extensive feature set, however, may justify the price tag for some users. Axure can be used for not only creating simple wireframe sketches but also generating complex prototypes and specification documents. Other advanced features worth mentioning are the abilities to share prototypes with clients, manage feedback and discussions, and collaborate with team members. Being a desktop software, Axure is available for Mac OS X and Windows.
Balsamiq Mockups—Flash-Based Rapid Wireframing Tool
Balsamiq Mockups is one of the best-known wireframing tools. Originally released in 2008 by a single developer, it is now used by tens of thousands of clients and is supported by a team of eleven full-time employees. Balsamiq Mockups aims to reproduce the experience of drawing sketches on paper, which is why it produces wireframes that look rough and not like formal designs. The tool can be used in the browser (Flash required) or downloaded as an Adobe Air application. A single-user license costs $79.
Pencil—Open-Source GUI Prototyping Tool
Pencil is an open-source solution for creating GUI mockups and prototypes. It provides a large collection of built-in shapes, ranging from general-purpose shapes over flowchart elements to UI controls for desktop, Web, Android, and iOS apps. You can also download user-contributed stencil collections from the download archive on the Pencil website. Pencil is available as a standalone version for Linux, Windows, and Mac OS X, or it can be used as a Firefox extension.
UXToolbox—Windows-Based Wireframing Tool
UXToolbox allows you to create wireframes and interactive prototypes for mobile apps, websites, and desktop software. Of interest to note is that the tool supports switching between sketched and pixel-perfect wireframes with the click of a button. Once a wireframe or prototype has been finished, you can export it to HTML, PNG, XML, and Word, or you can print handouts for a meeting. UXToolbox requires Windows XP or higher and costs £159 (about $240) per copy.
Mockups.me—UI Wireframing Application
Mockups.me looks very similar to Balsamiq Mockups, but it has the advantage of also being available as a tablet app for iOS and Android. Furthermore, Mockups.me includes a built-in communication system for gathering feedback through annotations and comments. The desktop version of Mockups.me is priced at $49, the tablet version is available for $19.99, and the web version starts at $99 per year.
Live Wires—Wireframing App for iPad
Live Wires helps you test and prototype app concepts directly on an iPad. It can be used to create interactive wireframes for both iPad and iPhone apps. To get you started, the tool includes a large collection of easily customizable controls and an extensive glyph library. Wireframes can also be exported via e-mail and then imported on another device. Live Wires is currently available at a special introductory price of $9.99.
As you can see from the list above, there is a wide range of wireframe tools available from which to choose. Have you already used any of these tools? If so, please share your experiences in the comments section.
FrontPage Image:Web design concept: Enter button with Gears on computer keyboard via Shutterstock