Wireframing with balsamiq

I am not a web designer. I know what I like when I see it; but, I’m much more experienced working on the backend of systems or building desktop applications (I know). I was recently tasked with mocking up the appearance of a new product targeting our web customers. Knowing the way I would historically tackle this kind of problem is slow, and also that my target audience was most likely to get lost in minute details, I decided to take a step back and mock up the new solution with wireframes. Wireframes are great because the sketchy and simplistic style reproduces a whiteboard experience.

After a bit of searching, I went with balsamiq. I’m writing this blog post to acknowledge what a great product this is for rapid wireframing. I’m only using the Web App at the moment, although I foresee purchasing a personal license for my desktop in the near future. I doubt I’ve scratched the surface on what it can do, but I was able to have a product time using the tool with a minimal learning curve.

My one complaint about the software is that I couldn’t find how to bring my “demo” wireframe into the Web App. I created one mock with the online demo and decided this was the tool to use. There was no obvious way to take that mock and bring it into the Web App version. Users can import and export on both versions, but the file type used differs and is not compatible. Finally, icons are handled differently between the two versions. There is a standalone tab for icons in the demo, while there is only one (easily missed) item for icons in the Web App. You select the actual icon (facebook, envelope, etc) after dropping the icon item onto the canvas.