FlairBuilder: Wireframing and Prototyping Web Sites

The practice of wireframing is common to most web production professionals. Oddly, there’s no clear market leader or category-defining product in this space; even solutions such as Adobe’s Creative Suite lack dedicated wireframing or rapid prototyping tools.

There are, however, a number of useful smaller options. Late last year,  Mike Gunderloy evaluated the popular Balsamiq Mockups and its deliberately sketchy wireframes. I recently discovered FlairBuilder, another up-and-coming wireframing tool which, like Balsamiq, is based on the Adobe AIR platform.

While lacking Balsamiq’s cutesy, sketchy style, FlairBuilder has a number of interesting features useful for wireframing:

  • A tabbed interface, enabling users to work on multiple projects and pages, along with tools to create “master” templates for a number of pages within a particular project.
  • A pretty comprehensive gallery of components, segmented into palettes, along with a nifty search-as-you-type tool to help locate individual components.
  • Integration with web applications, including Google Maps, Vimeo and YouTube, allows live content from third-party services to be incorporated into a wireframe layout.
  • An online viewer allows non-FlairBuilder users to open and view projects created within the app, which is great for working with clients.

At $99, FlairBuilder is inexpensive enough for most web design or development professionals to take a chance on — in fact, it’s only marginally more expensive than Balsamiq.

Both Balsamiq and Flairbuilder do a reasonable job at a low cost. Personally, I use a combination of MindNode for high-level site structure and OmniGraffle-based wireframing templates to put together information architectures. But I can’t help thinking there’s great potential in an application or service that’s more integrated into the workflow of other common design tools such as Dreamweaver, Illustrator and Photoshop, or that’s oriented around web-based collaboration like Google Docs.

Incidentally, there’s a great unsung blog called Wireframes that’s worth adding to your feed reader.

What wireframing tools, methodologies and practices do you use?


Comments have been disabled for this post