10 wireframing tools for web designers

No matter what size your project, creating a wireframe will save you time and help with problem-solving. Here’s our pick of the best tools that you can use to build them


01 Axure
One of the most powerful and advanced wireframing applications on the market. Axure RP allows you to create high fidelity wireframes with complex interactivity and export them as clickable HTML prototypes. Extensive annotation tools let you automate the design process, and also output project specifications easily. Axure also allows you to work simultaneously with other team members on the project.
Price: from $539/ £370 (free 30-day trial available)


02 OmniGraffle
A worthy adversary for Axure. Like most applications designed specifically for the Mac, OmniGraffle is highly user-friendly, making drawing shapes, diagrams and even Bezier lines very easy. It also features a huge number of built-in stencils and powerful style tools. The biggest drawback is that it doesn’t produce a playable interface or HTML prototype, so if you don’t have a close relationship with your developer then you might opt for Axure instead.
Price: $99.95/ £63 (individual licence, 14-day trial available)


03 Balsamiq Mockups
This Adobe Air-based web application lets you create hand-drawn style mock-ups by simply dragging and dropping one of its 75 user interface components and using some of its 187 icons. Without wasting time you can create a click-through prototype that can be amended online by you, members of your team or even your client.
Price: $79/£56 for desktop version


04 Mockingbird
Mockingbird is another user-friendly web app with a drag-and-drop interface, decent set of stencils, smart guides and the ability to link pages together within the project. You can work on your wireframe remotely and easily share your mock-ups with clients or colleagues by sending them a direct link. They can even see you making changes in real time.
Price: from $9/ £5.60 per month


05 Protoshare
The extensive, real-time collaboration features and ability to synchronise remote teams have made Protoshare a tool of choice for companies such as Sony and 3M. It allows you to create rich, engaging prototypes with dynamic interactions and export them as interactive websites. And you can also use it in your web browser.
Price: $29/£18 per month (15 day free trial available)


06 Iplotz
Iplotz is a slick Flash-based web app (a desktop version is also available) that lets you quickly create crisp and professional looking wireframes. It separates itself from other wireframing tools with its high quality, clean interface, straightforward collaboration tools and project management features within the app. You can also review wireframe history for each project.
Price: free plan available


07 Pencil
If you can’t or don’t want to spend any money on the software, you should try the Firefox add-on Pencil. This free plug-in (also available as a standalone tool) will let you do sketching and prototyping using built-in stencils. It also allows inter-page linking and you can export the results of your finished work as a PNG image, web page, OpenOffice, PDF or DOC file.
Price: free


08 Keynote Wireframe Toolkit
If you think your client might not be able to understand a complex wireframe, you can create a more linear presentation of the concept behind the app or site with Keynote. It’s usually a much quicker process and, to speed it up even more, you could use Keynote Kung-fu – a set of over 100 Keynote vector elements, grouped for maximum flexibility and quick, easy manipulation.
Price: $12.00/ £7.50


09 iMockups
With the arrival of the iPad and its huge popularity among creative professionals, there was an immediate demand for a wireframing tool that let you work while on the move. Winner of Applied Arts’ Best Mobile App 2010 Award, iMockups has a simple, intuitive interface, and the facility to draft low fidelity wireframes quickly and easily. It soon became widely used by designers who like to work on the train or during a boring meeting.
Price: $6.99/£4.40


10 SketchyPad
An alternative app to iMockups. With 56 pre-defined stencils, the ability to upload photos to the project and add links between mock-ups it’s the ideal tool to use when creating more basic wireframes. Although it lacks more advanced features, it boasts the useful option of exporting your work in a Balsamiq Mockups format.
Price: $4.99