Balsamiq Mockups
Balsamiq Mockups caught my eye a couple months ago when looking around for a simple tool for roughing out ideas for web sites. Or really anything visual. I found it right after reading Joel Spolsky’s articles about being careful what you show clients. The basic premise is that you want to show clients nothing that resembles “product” until you are ready to have that conversation. In the meantime, use napkin drawings to illustrate ideas. And that’s just what Mockups does.
Mockups is an online tool that’s available offline using Air. It’s actually the first Air product I’ve been able to make work, but I digress. After demoing it online (err, Mockups, not Air), Mariah at Balsamiq were nice enough to give a full working copy to try out (there’s my full disclosure). The timing was right as I’d just picked up a freelance job, so I got to actually put the thing to the test.
It’s awesome.
It’s dead simple, you can move fast in it, and it’s got enough widgets that you’ll find something to get any idea across, especially most any web design pattern. You start with a notebook page and drag widgets that look like web elements onto it – graphs, iTunes carousel, videos, fieldsets, whatever. These widgets are made with rough lines so there’s no mistaking them for the real thing. You edit text where it makes sense, or add your own, all in Comic Sans so it looks hand-written. All in all you are creating the back-of-the-napkin feel on the screen. It’s got a couple nice features like grouping and locking of widgets (sorry, not sure what to call them). Basically it does just what it needs to, and I actually fear any additional features as I’m hard pressed to see anything it needs that wouldn’t clutter the work space. Keeping it simple here is key and I feel they just about nailed it.
Now, that said, it’s a little buggy at times, editing text is wonky, and there are a couple features that don’t work as expected (you can’t unlock a single item, for example). The notebook pages are oddly shaped, and don’t really give you the “vertical” of a webpage. So I found myself keeping it simple with above the fold ideas and basic branding. Okay, I don’t mind the constraints. I appropriately spent more time thinking, and less time moving things around. I would like to see the notebook be rotatable, and/or resizeable. Some sort of simple zoom might work. Otherwise, tighten up the bugs and call it done! I’m happy.
Incidentally, or maybe not, the client thought it was great, got that it was a wireframe, and I didn’t get a single comment like, “Can we make the logo more orange?” Definitely check it out!