My quest for a mockup tool
A while ago I wrote that Goldmund, Wyldebeast & Wunderliebe is going start a new usability department. At the moment I am busy writing marketing texts and thinking about a new website for ourself. Last week I also looked for a nice tool for making mockups and wireframe models, for Mac OS X. After testing 15 tools, I could make a well informed choice, and would like to share my findings with you.
- Mockup: a static lo-fi representation of a screen, for quickly testing out UI's
- Wireframe: a functional mockup for testing interaction design (navigation etc.)
Adobe Fireworks, $299, desktop app
Many features, very good for basic interaction design. Not so many build-in widgets (“symbols”) for quickly creating mockups, but this page helps. Conclusion: very good product, but compare with OmniGraffle for yourself.
Axure RP Pro, $589, desktop app
Mac version is in Beta. Very good documentation. Very few build-in widgets, making it hard to drag-and-drop a mockup into existence. It can create website specifications based on the wireframe. No snap-to-element, only snap-to-grid. Learning curve seems a bit high. Conclusion: I am not that impressed.
Balsamiq Mockups, $79, Adobe AIR
Unique drawn style, not that professional. However, its build-in widgets are plenty and good. It's good for internal mockups, but I wouldn't show it to a client.
Cacoo, free, webbased
Nice for flow charts or office layouts, not so much for mockups or wireframes.
Creately, $5 /m, webbased
Only $5 per month, with a 20% discount if you pay per year. Very impressive widget library, kick ass for diagrams, flow charts and mockups. Sadly it's very slow, making it a pain to use. Conclusion: wait for updates and try again.
Flairbuilder, $90, Adobe AIR
Too simple, too few widgets to be usable. Skip this one.
fluidIA, free, webbased
Only works in Firefox. Very Beta and buggy. Its biggest problem however is that I just don't understand this tool.
ForeUI, $99, desktop app
Mockups with basic widgets and some wireframe functionality - you can define actions on buttons etc. Pretty good snap-to-element with automatic padding between elements. Software looks a bit unpolished though.
JustInMind Prototyper, $690, desktop app
Mac version is in Beta. Many video tutorials. Not so many build-in widgets. Lots of functionality, seems simpler to use than Axure RP Pro. Conclusion: nice, but not great.
MockFlow, free or $59 /y, Adobe AIR
The free version offers very few build-in widgets. The paid version gives you access to the “MockStore”, where everyone can place widgets for others to use. However, these widgets are hard to find, and since it's not really integrated into the tool itself, it's a bit too hard to use. Conclusion: not that bad, but there are better tools.
MockingBird, free, webbased
Reasonable selection of build-in widgets. It doesn't offer a lot of functionality, but it is very easy for quickly making a mockup screen. Good snap-to-element. Conclusion: if you need a free tool for making a mockup, look no further.
OmniGraffle (professional edition), $199, desktop app
The ultimate diagramming tool for the Mac, and very good for making mockups with basic clickthrough prototyping. Not that many build-in widgets, but there are hundreds available on the web, most free to use. Extremely good for mockups with superb snap-to-element, snap-to-guides and snap-to-grid. Best tool on the Mac for making mockups.
Pencil, free, Firefox plugin
Very simpel, very low selection of widgets. Not really that usable, but try it out anyway.
Pidoko Wireframe Creator, €30 /m, webbased
Slow, few widgets, few wireframe functions. Not really worth it.
ProtoShare, $49 /m, webbased
It looks very nice. You can use it for making functional wireframes. Not that many widgets out of the box, but you can use CSS to make your own. If you don't use the tool for a month, you can suspend your account for $5 per month. Conclusion: very nice for mockups with basic wireframe functions.
And the winner is…. OmniGraffle Pro! The main 3 reasons are costs (a one-time investment vs. monthly payments), available widgets and document templates, and being able to use it offline.
Very useful OmniGraffle resources:
- Video how-to for clickthrough prototyping in OmniGraffle
- Konigi's stencils
- Konigi's document templates
I hope this list can help you to make a choice. Did I miss some amazing tools? What are you using? Let me know in the comments.