Top Wire-framing apps
When I am building a website wire-framing is an important part of the design process and leads directly into the IA (information architecture). I know not every developer works this way, but this is what works for me and allows me to build the best possible website for my clients.
I used to do wire-framing in Photoshop, and until recently I did not see a large need to have a stand alone application for this, but since my Web design company recently expanded, I have found a need to be able to do this in the cloud while collaborating with a co-worker.
So since I have had limited experience with wire-framing apps, I began my search. There were a few thing that I was looking for specifically, first I wanted to find the best value for the money, second it absolutely had to have a cloud based platform. That’s it.
Axure
Click for Video
My search began at Axure, mostly because my co-workers have used it and loved it. I have to say they have an impressive list of features
Use features like built-in widgets, shapes, and annotations to quickly create gray scale, annotated wireframes for evaluating concepts early in the process. Add color, images, and a wide range of interactions to your design from basic linking to expanding and collapsing content and conditional flow for client presentations and usability testing. Generate a detailed specification of your design with screenshots, interactions and annotations for approval or hand off to development. Axure RP can support you and your team throughout the various stages of the design process.
Pros
- Super fast with drag and drop components
- With the newly release Mac version it is now cross platform
- Pretty much any interaction you can think of
- Exports in multiple versions including HTML.
- Collaboration
- Amazing customer service and a really active community
Cons
- Price – this is a serious application but it comes with a pretty hefty price tag
Price: $589/license
Hotgloo
Hotgloo is a relatively new entry in this field having come out of beta back in February 2010. I think they have a really nice interface that is a breeze to pick up
Pros
- Super fast with drag and drop components
- Custom components- works real nice for include like features, think header, footer etc..
- Layering
- Online Collaboration and Real-time chat (sweet!)
- Overlaid Graph and 960 grids are provided for layout
- Some interactions can be added to mouse click and initialization for firing events like showing message, changing visibility of components.
Cons
- Limited number of components
- Processes can get pretty complex
- No traditional sitemap view
- A touch pricey at $14/month
Price: $14/month
Mockflow
<
Mockflow markets themselves as “super-easy Wireframing” and from what I have seen that is definitely the case
Pros
- Super fast with drag and drop components
- Real-Time Design Collaboration with Team Chat
- Layering
- Overlaid Graph and 960 grids are provided for layout
- Versioning
- Price – at just under $5/month the clear winner
- Mockstore- where user can share there custom built components with others
Cons
- There is no navigation built from lists
Price: $59/year
Pidoco
Another cloud based app is German engineered Pidoco
A GUI Design Software for clickable Wireframes!
Fast and easy like Rapid Paper Prototyping, but completely web-based and with many more features!
Pros
- Super fast with drag and drop components
- Real-Time Design Collaboration with Team Chat
- Layering
- Fully interactive and clickable Wireframes
- Versioning
Cons
- Price at $29/month
- Fairly steep learning curve
Price: $29/month
Flair Builder
This is another app that I stumble upon, it is built in Adobe Air so it doesn’t quite fit my model of a web based app, but I found it interesting enough to include.
Sharing is unique with this app, because there are really two option. You can email the saved file to the client and tell them to open it using the Flairbuilder online viewer or alternately you can upload it to your own server where it is available via the Flash player. I personally like the branding opportunities this provides.
A cross-platform prototyping tool that helps you create interactive wireframes & prototypes faster, easier and with better results.
We put a strong emphase in interactivity as this is the best way to show your clients something closer to the real product.
Pros
- Super fast with drag and drop components
- Show and hide elements
- Build working tabs
- Fully interactive and clickable Wireframes
- Insert usable accordions/li>
Cons
- Slows down with large wireframes
- Is Flash based
Price: $99/year
Summary
To be honest this is just a drop in the bucket when it comes to these types of apps, these are the ones that I thought were the best at this stage in the race. There are loads of other ones out there and I highly encourage you to look at them all before you make any type of decision.
Here are a few resources:
- 15 Quality Web-Based Applications to Create Mock-Ups and Wireframes
- 15 Desktop & Online Wireframing Tools
- Web Design: Top 7 Wireframing Tools (Updated)
So which one did I decide to go with? Well for once I don’t have an exact answer, I am fairly happy with Mockflow and Hotgloo at this point but I will probably upgrade to Axure before the year is out.
Related posts:
