Wireframing is an essential part of project planning that acts as an important guide throughout the entire web development process.
Unfortunately, creating wireframes, which are mock-ups of the specific content that each page template or application state should include, can be cumbersome, especially for web developers who are more comfortable with code than with graphics.
To help speed your wireframing endeavors, I have put together a list of ten wireframing solutions. Each has its merit, so try many and choose wisely.
MockFlow: Free to $59 Per Year
MockFlow offers a downloadable wireframing solution that includes site map visualizations, CSS export, and the ability to work on your wireframes even when you are not online. The basic service is free, but includes limits on the number of wireframes you can create.
Pidoco: $9 to $99 Per Month
Pidoco is both a wireframing and user experience-testing solution. You can drag and drop elements to your wireframe, and make them clickable so that you can try your user interface out on colleagues or focus groups. The solution runs completely online.
FlairBuilder: $24 Per Month or $99 Once
FlairBuilder is a web-based wireframing and prototyping tool from Romania developer Christian Pascu. The solution allows you to arrange wireframes into a folder structure similar to a site hierarchy, and includes an easy to use drag and drop interface. Buying the license for $99 and never having to pay again is the best choice.
Balsamiq Mockups: $79
Balsamiq Mockups frankly makes the complex very simple. This wireframing tool is one of the easiest to use solutions available. It is also feature-rich and well worth a look.
Mockingbird: Free
Need a fast, no strings attached wireframing tool, right now? Go with Mockingbird—the free solution from Saikat Chakrabarti and Sheena Pakanati. It is a full-featured tool that features drag and drop controls, and it won't even require you to register unless you like what you made.
Pencil Project: Free
Pencil Project is a Mozilla Firefox add-on that transforms your browser into a wireframing and graphic design tool. Wireframes developed in the tool can include active links so that you can use it to test or prototype, too. Although this add-on is free, a $4.99 donation is encouraged.
HotGloo: $7 to $48 Per Month
HotGloo offers a browser-based wireframing solution with a focus on information architecture and user experience. It includes collaboration tools that allow a designer or developer to share with co-workers, clients, or reviewers.
ProtoShare: $29 to $49 Per Month or More
ProtoShare enables dynamic wireframes that can include CSS, JavaScript, HTML, and Adobe Flash prototypes. The suite includes second-to-none collaboration tools and the option to test multiple layouts per page. With the $49-per-month professional package you can export your wireframes as HTML, get limited phone and email support, and even custom brand the solution so that clients see your logo instead of the ProtoShare logo.
Jumpchart: Free to $49
Built for quickly developing and sharing wireframes and prototypes, Jumpchart is a premium-planning tool that is certainly worth of mention here.
Visio 2010: $999
Microsoft's Visio is, without a doubt, the biggest power tool in the box. It does everything you could ask for and more where wireframing is concerned.
