Geeks With Blogs

News INETA Community Speakers Program WTFNext's hosting!

View Stacy Vicknair's profile on LinkedIn

WTF Next? Dev ramblings from a master of nothing.

After reading Michael Neel’s article on about Balsamiq Mockups, I thought that the article must be insincere. Go ahead and check the article, itself even titled “You should be using Mockups”. Back yet? Well I’ll continue anyways…

As I was saying, the article was too good to be true, and this Adobe Air application seemed to be too much of a dream. Well, needless to say, I decided to check the tool out, and I also flaunted my blog and MVP status to get a chance to test out Mockups for myself. The condensed version of this article? Now I understand why I have to have this product.

Design with appropriate tools

As Michael noted, making a prototype with the tools you use for design is inefficient. Sure you think you’re saving time by handling some of the work up front, but what if there are drastic changes, and you’ve got to rethink how you’re feeding mock data to the app you built just for prototyping? You’re basically shooting in the dark with a airsoft gun.

Michael’s experience is actually a bit different from mine. When I started producing my own functional specs, I took the advice of a good friend and used inkscape to make the designs. The time it takes to create a design in inkscape is probably quicker than it would take to make a design in Visual Studio, but I don’t have the controls like I would in VS. I could make my own set of controls in inkscape and use them each time I prototype, but that’s an amount of work that I shouldn’t have to do if I used a tool meant specifically for mocking. My method is like shooting in a dimly lit room with blanks.

Enter Mockups. Mockups has the convenience of Visual Studio’s drag and drop controls without the hassle of mocking data (we’ll get to that soon). Mockups also has the convenience of using a tool like illustrator or inkscape by allowing for easy export of the mockups. It’s the best of both worlds, it’s a tool meant for the job. To continue with my horrible analogies, Mockups is like rigging a room with the nail bombs from Saw V. Quick and effective; meant to get the job done.

Quick and reusable

So to test out Mockups, I decided to throw together a design that I’m familiar with: the design (a basic SubText template). The results are below. This mock took me about 10 minutes, which for me is probably good. This includes learning curve and my minutes of tweaking to create the perfect design. To me, this is quick.


The other good news is that I can reuse that work I did in 10 minutes. I can group the elements that make up my page and then copy them to a new mockup and build a different page. I could even construct a template for complex controls and use that!

Informal and approachable

The informal look of the wireframe designs are a blessing that you might not recognize. The design effectively conveys that the prototype is just… a prototype! It is meant for criticism, and the pseudo-drawn comic sans feel allows those involved in decisions to realize that the design isn’t set in stone. In fact, it’s still wide open. It’s begging to be changed, and thanks to using a tool meant for mocking applications, it’s easily done.


Tiny criticisms

I do mean tiny. There are very few problems that I have with Mockups, and many of them are being actively addressed, and the Balsamiq crew is more than happy to work with customers to improve the application. Here’s my small list:

  • No true way to make your own controls. You can sort of create a control by grouping other controls and setting their functionality, but they still act as separate items. Balsamiq knows about this, and they will work with you if you’ve got a great control suggestion.
  • Things snap in place, but you’re still dealing with “sketchy” shapes. If you try to put a rectangle in a browser object, you’ll get it to snap in place, but not necessarily a clean cut snap because of the sketchy nature to objects.
  • Containers aren’t really containers. This is something I’d love to see Mockups take on. Containers allow for snapping in smart locations, but the containers don’t truly act as containers. Why is it important? I think it could solve my previous problem, where snapping a rectangle into a browser or app window would have a clean line on the snapped edges.

However, these are all minor minor minor issues. Almost non-existent considering the time I save with Mockups to begin with. At $79 a license, this application is a steal.


Technorati Tags: ,,
Posted on Wednesday, April 22, 2009 10:27 PM Subjective , Other | Back to top

Comments on this post: Balsamiq Mockups – Quickly Make Informal, Approachable Designs

No comments posted yet.
Your comment:
 (will show your gravatar)

Copyright © Stacy Vicknair | Powered by: