Balsamiq Mockups

I’m in love… with Balsamiq Mockups. I learned about it at Design Camp Boston this November. By the way, if you can attend Design Camp Boston next year – do it! It’s free (need I say more?), it’s held at the Microsoft New England Research and Development Center (the architecture will make any design lover drool), they feed you (should that be number 1?), you meet other like-minded web geeks and you learn a ton from some great experts.

OK, back to Balsamiq Mockups. What the heck is it? Balsamiq Mockups is a rapid wireframing tool that allows you to quickly and easily create mockups for web sites. The great thing about it is that the boxes and lines and other doodads all look hand drawn. It’s a great way to get ideas out and work on your information architecture without feeling too attached to what you’ve done. It’s also a great way to show a client an idea and let them know that it is still AN IDEA. There are no colors or gradients or pretty pictures to distract them and make them ask the dreaded “can that be red instead of blue, can we use Verdana, why is that picture fuzzy?” – you get the idea.

Here is a really quick one I did (less than 5 minutes) as a “just get something down” draft for a client I’m working with. Don’t judge, it’s only here to illustrate what they look like.

You have the option of inserting many objects that you would expect to find on a web site – buttons, text boxes, pictures, tables, tabs, etc.

If you’re creating multiple pages you can also easily link them together to show the flow of the site. You can then save all of your pages as a multi-page PDF that you can email.

Why I recommend this over some other methods of wireframing:

Paper, napkins, backs of business cards, etc. – too easy to lose or ruin, too hard to share

Photoshop – eats up computer memory, takes a long time, is too easy to start making it pretty

Fireworks – same problems as with Photoshop

If anyone disagrees or has another program or method that they love and adore, please let me know.