Great Prototyping ToolsIn my last post, I wrote about the benefits of prototyping websites. In short, it came down to saving time and money – while producing more usable sites. Simple, right?
Well, not entirely. It was critical for us to find the right tools for this expanded part of our workflow. I thought that would be relatively easy but the landscape of tools is wide and varied. Our set of criteria for our final tool was primarily the following:
- It needed to be able to support very high fidelity, interactive prototypes if needed (we didn't want to be locked into an inflexible solution)
- It needed to make sharing our work with clients and other members of our team easy
- It needed to offer a quick, intuitive UI that would let us get work done quickly and efficiently
This list certainly isn't definitive, but for us though, the 5 below all merited serious consideration as our top prototyping options.
HotGloo(www.hotgloo.com, hosted app, $14/month starter plan)
We used HotGloo for about a month and were generally pleased. It's a Flash-based app and the UI is quite well-laid out. It offers some basic scripting to allow for multiple states, views and interactions in your prototype.
As a hosted service, your projects remain online which allows for fairly easy collaboration between team members. It also allows clients to access and comment on prototypes online.
It is still a relatively new service and priced very competitively, allowing unlimited users. The downside of that is that we ran into quite a few bugs on the editor end and had a couple issues with clients not being able to access the prototypes (they all seem to have had Flash in place as needed but still couldn't access the prototypes). In all though, it's a promising service and worth checking out if you're inclined to keep your workflow online.
ProtoShare(www.protoshare.com, hosted service, $29/month starter plan)
Of all the online hosted apps we looked at, ProtoShare probably had the richest feature-set. There wasn't much missing – and it had some features we felt could be very compelling. In addition to doing prototypes, it's set up allows it to be used as a versioning and presentation system for mockups or other image-based assets. We found it to be quite stable in it's use. The UI was ok but performance for us wasn't great. It's built as an HTML/JS app and with the degree of complexity it offers, some of our machines sagged a bit under the weight of trying to work relatively quickly in it.
However, a deal-killer for us was that the pricing structure which had severe caps on the number of users who could access the system as 'Reviewers'. If your focus is on delivering prototypes to clients, this could be a significantly limiting factor. However, if your workgroup is primarily focused on self-contained collaboration then it's a tool worth looking at.
Balsamiq(www.balsamiq.com, desktop app (mac/win/linux), $79)
Ok, so Balsamiq misses the mark for us in one critical area – no ability to do scripting and advanced interactions. In spite of that, I felt it deserved mention. If your needs are purely about getting good-looking wireframes done quickly, than it is definitely worth a look.
It's a very elegantly designed piece of software – next to no learning curve – just start laying out your wireframes. While we aren't currently using it, we may add it to our toolbox for quick onsite brainstorming sessions.
OmniGraffle(www.omnigroup.com/products/omnigraffle/, desktop app (mac), $199)
This was our go-to solution for several years – and even now we still use it. It's is a very well-built application that allows a lot of flexibility in how – and what – you lay out. Existing users will know what I'm talking about and likely rave about how good a program it is – and generally, it's hard to argue with that.
It also features a very robust community who build out additional "stencils" for it – essentially pre-built UI elements you can download and use. This lends it to producing flow charts and diagrams for many other things.
However, it can't offer the kind of advanced scripting and interactions we needed and it doesn’t include any kind of sharing features. If you are content working mostly solo and delivering mostly non-interactive prototypes, you'll find a lot to like (and there's even an iPad version).
Axure(www.axure.com, desktop app (mac/win), $589)
This is the solution we settled on – and so far are loving it. It offers the ability to build very complex prototypes but yet has a fairly intuitive UI (at least on the Mac side) so you can work quickly on simpler wireframes. There are perhaps too many dialogs as part of the UI but overall it works quite well. It does have a learning curve but given what it is capable of, I think it's a very fair trade off.
It's available to Mac and Windows and allows shared projects between teams members running their own copy of the software. Prototypes are exported as HTML sites which you can then upload for clients to view and interact with.
It also allows exporting Word documents that can assemble all the prototype layouts and accompanying notations. This system is quite flexible – you can tailor how you note items in terms of fields, statuses, dependencies, etc. The end result is that we can export a document from it that only needs a bit more massaging to become our functional specification for the project.
The only significant downside could be the price - $600 is a lot to pay for each license if you have a large team.