Wireframes and mockups
Tuesday 9th June 2009
Quite often when I work with clients, it can be quite difficult to visualise how the website will look and feel, before any design mock-ups have been created. In the past I've used Visio (from Microsoft) and Excel even to build mockups - but these never look very good. They also look very formal, and don't seem to promote much discussion about how the page lays out.
Recently, I've started using another tool for our subscription-based CMS service (which will launch as soon as we have some time to finish design and development).
Balsamiq is a great little tool that runs on Adobe Air. It's free to trial, but the full version only costs $79. It pretty much does everything I want from a mockups tool, except it would be great if you could use it to generate a site map (I imagine this shouldn't be too tricky as it already links together mockups - but I suppose it's best to specialise rather than become a 'jack of all trades').
One of the key features for me is the way in which the mockups are displayed - they're hand-drawn. This has a more appealling, less clinical affect which seems to promote more discussion, and definitely gives users a warmer feeling about how their website project may eventually look.
As I say, we're working on sushiworks (the subscription-based CMS) as we speak. Once we launch I'll post the mockups I created in Balsamiq, and you can see how they led both the design and development process.