Search This Blog

Thursday, October 4, 2012

Mockup UI with Balsamiq

     Came across this really interesting tool at work this week called Balsamiq.  ( Often when creating a mock up UI for your customers, one uses Lorem Ipsum for textual content.  This is used so that a customer does not get distracted by the content, but instead focuses on the layout, work flow and concept.

     However, most software engineers commonly use the framework that supports the requirements and contract to create a UI.  Just like using realistic textual content in your mock up, using the final products toolkit impacts your project in two negative ways that I can think of.

     The first problem is that it can cause the customer to drastically under estimate the work required to develop a gold plated web application.  If the back end work takes 3 FTEs a week, your customer is now observing a 120 hour/week burn rate, and doesn't "see" any changes in your software since the demo (UI mock up with "real" web app) a week before.  The last thing you need in your shop is a customer or some customer liaison poking their nose over the shoulder of your team asking questions and undermining the manager's product delivery date estimates. (which should come from the team doing the estimates for their tasks, might I add.)

     The second problem with using your final product's toolkit for a mock up is one that I have not shared with anyone prior to this post.  Consider the emotional feeling when you open some gadget or desired item you ordered online that just arrived at your house after waiting "forever".  That new plastic smell.  The rich visuals your eyes can dart all over.  The inquisitive way your mind bends around everything that is happening.  This is what you want your customer to experience.  A brand new and fresh product.  Not some half done knockoff.  Once the customer has seen the 'rough draft' UI for the final product, the cat's out of the bag.  You and your team worked hard on this product, don't sell it halfway through.  Both the team and customer will quickly tire of the subsequent demos and your product will be old news before it ever hits production.

     I understand that every project has unique customer's constraints and requirements.  This is by no means an absolute technique for demos and mock ups.  But something I think one should consider.


  1. I use creately mockup software for all my ui and mockup diagrams. There are lot of templates available in the software itself, its online platform independent and free to try.

    1. Thanks for the tip! I have not had much opportunity to design new UIs lately, but will try to remember to check back on your comment the next time I am planning a design.