9 Awesome Prototyping Tools for Designers

The UX prototyping space is booming. Dozens of solutions are now available for a practice that was done largely with paper and flat deliverables less than a decade ago. Designers can now start building experiences earlier in a product’s lifecycle and get real results around decisions through testing these prototypes

Some of them prefer to go vanilla and create prototypes and mockups  by hand using good ol’ pen and paper.  But one thing  UX designers or researchers have in common is that they always look out for new technologies.

1. Balsamiq

Creating a list about prototyping tools without mentioning Balsamiq is like a sphere: pointless. It is one of the basics when it comes to creating your first wireframes and mockups.

Don’t want to spend hours on prototyping? In this case, you should use Balsamiq. This tool emulates the whiteboard sketching but on computer. It is simple yet highly effective when it comes to create a powerful prototype. Balsamiq helps you create multiple mockups so that you can test them all and find the one that delivers the best result.

Wireframe tools - Balsamiq Mockups

  • Platform: Mac, Linux, Windows & web-based
  • Price: $79

2. UXPin

UXPin is a great tool with tons of options for wireframing. But what  caught my attention is the option of turning your sketch into a digital wireframe.

Provides an extremely lightweight web-based prototyping environment and contains a UI component library that can be used to design screens for a number of devices. Properties, interactions and states can be applied to these components. Support for gestures and animation is quite robust, and versions of screens can be made responsive by defining breakpoints.

UX Design Tools 2015 UXPin

Cost: $13.50-$36/month depending on plan

03. Axure

Very early on the scene and continues to be a dominant force in the space. A complete set of drawing and editing tools are available and you get a decent set of UI components out of the box.

Wireframe tools - Axure

Axure lets you create interactive HTML mock-ups for both websites and apps
  • Platform: Mac & Windows
  • Price: $289-$589

As well as creating mock-ups, Axure allows you to add functionality to your layout and create an interactive prototype. Features of this wireframing tool include sitemaps and various ‘widgets’ in the form of various UI elements. Interactive HTML mock-ups can be created for both websites and apps; you can even view your app design on your phone with a built-in share function.

04. Visio

Wireframe tools - Visio

Viseo’s interface will be familiar if you’re used to using Microsoft Word or Excel
  • Platform: Windows
  • Price: $600-$999

Viseo’s real strength lies in technical diagrams rather than wireframing; however, for those already accustomed with other Microsoft apps such as Word or Excel, the interface will be very familiar. It is quite clunky, Viseo does offer add-on tools such as Swipr, which allows you to create and export a usable HTML prototype.

06. iPlotz

Wireframe tools - iPlotz

Create Flash-powered wireframes with iPlotz
  • Platform: Web-based (Flash)
  • Price: Free-$79

Flash-base wireframing tool iPlotz allows you to make clickable wireframes with drag-and-drop components. Its main addition includes the ability to add tasks and notes for project managers and coders.

07. Photoshop CC

Wireframe tools - Photoshop

Never thought of Photoshop as a wireframing tool? Think again!
  • Platform: Mac, Windows
  • Price: £17.15/month as part of Adobe Creative Cloud

Photoshop doesn’t offer libraries of interface elements, but for straight-forward, fast wireframing, it is a very easy choice for designers. Even for those not familiar with Adobe products, sketching out quick ideas, grouping various elements and layers affords a very quick process.

08. MarvelApp

Marvel attracts you with its simple and clear design which allows you to get right to work. It also operates on web browsers, so it is accessible via many platforms (PC, mobile, etc.).

Marvel syncs with Dropbox, and offers access to projects for full teams, like other tools. Marvel can export the prototype as an .apk for Android developers, so you can turn your prototypes into offline apps.

To follow their words “napkins supported”, you can take a screenshot with your phone iPhone and turn it into a prototype with few clicks. It’s simple, clear, and most of all free, with some extensive plans available.

MarvelApp prototyping tools

9. MockFlow

Don’t mock this one, as this is a fine tool for prototypes. It looks confusing, but once you get the hang of the interface and of the MockStore, you can use all the elements and templates available.

Creating a non-cartoonish mockup is simple, looks good, and you have an online link to a HTML wireframe which you can share as you wish. MockFlow is constantly updated and receives new features and fixes all the time, so it is good to see it develop rapidly. It uses Flash, but that shouldn’t be much of a problem.

mockflow prototyping tools

You may also like...