Tool Presentation: Balsamic Mockup

Last week I joined the DNUG Frankfurt to speak about Umbraco. This motto of this meeting was 'Cool Tipps Camp' where six other tracks showed some other stuff. The tool 'Balsamiq Mockup' was presented by Stephan Schneider and I wanted to forward this info to you as I think it is a great tool.

Balsamiq Mockup is a tool used for defining the structure of a web site or web application. Yes, there are some other tools around this defining websites so why am I so excited about this tool? It is a program let you define the structure without the design. You can edit a browser window to a certain state of the web application and it looks like painted with a pencil. That gives you the opportunity to separate the structure of the website from the design. Check out the webcasts on the start page and some screenshots here.

Balsamiq Mockup opens in a window with a tabbed toolbar where all the 'widgets' are placed like a browser window, an IPhone, navigations sliders, calendars, buttons, etc. You can change some properties on the widgets and you also can put in some basic functionality (link to other mockups like links in a web page). With you can save and export these mockups, co-workers can add notices and finally you can get c# code out of it (with a plugin you have to buy).

In the state of defining the structure of a web site you shouldn't talk about design. I think the design comes afterwards when you know how the website is structured. In many discussions with my 'clients' I had the problem that if I was showing a sample behaviour live in a browser all clients wanted to talk about the design: 'this button has to be a bit more blue' (what is more blue?) and 'the navigation bar looks a little bit crappy' instead of talking of the way to navigate through the web application and which kind of navigation should be used. Perhaps with Balsamiq Mockup I will help me define better web site structures with my clients.

Balsamiq Mockup is based on Adobe Air and costs about 80 $. It's worth to have a look on it.