Balsamiq Mockups

Rapid design ideation with Balsamiq Wireframes

We’ve been a huge fan of Balsamiq Wireframes and have used it in tons of scenarios from explaining ideas to clients during meetings to low fidelity ideations to quickly visualise what’s on our minds.

You might be wondering, Balsa.. what?!

Yes, you’ve heard it right. Balsamiq Wireframes.

Quick and Easy Wireframes that gets everyone on the same page! Really?

Who uses that these days? Aren’t we supposed to use the likes of Figma, Sketch, Axure, UX Pin, Invision, Marvel and blah blah blah?

For those who aren’t familiar with Balsamiq Wireframes:

It is a rapid low-fidelity UI wireframing tool that reproduces the experience of sketching on a notepad or whiteboard, but using a computer.

It really forces you to focus on structure and content, avoiding lengthy discussions about colors and details that should come later in the process.

Wireframes is FAST: you will generate more ideas, so you can throw out the bad ones and discover the best solutions.

From the Balsamiq Wireframes website.

Here are 3 reasons why we kept going back to Balsamiq Wireframes despite all the other great tools out there:

1. Speed of ideation

It’s no doubt the fastest way to put together an interface for visualisation is by sketching it out on paper or on the whiteboard. Balsamiq comes close thanks to one quick shortcut, the ‘/’ key.

Screen Recording 2020-01-12 at 11.43 PM.gif

Instead of scrolling through the UI library and selecting a component such as a ‘button’ or an ‘image placeholder,’ simply press ‘/’ and type in the keyword (e.g. image). This triggers the search to show you relevant components. Simply hit ‘enter’ and voila! The component appears on your canvas.

While many tools come with a whole UI library of components to select from, navigating through them to find what you need can be like going through a maze.

2. Easily picked up by anyone

Because of its simplicity and focus, Balsamiq can be easily picked up by anyone. It’s time to get your UX Researchers, Product Managers, stakeholders and others you need input from but who don’t have a design background to roll up their sleeves and give this simple tool a go. 

Would you prefer to receive whiteboard sketches or simple wireframes?

Of course, don’t expect the screens to be production-ready. That’s not the purpose of Balsamiq Wireframes. The idea here is to get people, with or without a design background, to put their ideas down into tangible forms that can be understood.

This tool works perfectly if your stakeholder is remote and you can’t make sense of their whiteboard sketch photos. 

3. Cheap enough to throw away, iterate as much as you like until you find the sweet spot

One of the intangible benefits many don’t know about is how the ‘sketchy’ look of Balsamiq Wireframes actually encourages design iterations. 

You might have heard of the importance of ‘quantity over quality’ at the ideation stage. Balsamiq gives the impression the designs are cheap and easy to put together and this means you are likely to be able to discard them without feeling hurt that you’ve spent tons of hours on it. It makes you iterate and try many different design ideas before identifying the better ones to elaborate in greater fidelity.

That’s really the sweet spot of Balsamiq Wireframes.


Caveats…

Balsamiq Wireframes is not without its issues. Recently, we built an elaborate set of wireframes on Balsamiq Cloud and the whole app just slows like nuts. Although Balsamiq Cloud allows multiple users to edit the same wireframes like Figma, do not try it with a page full of components as it can take up a lot of resources.

We also had an issue with the Desktop version where the max canvas size is limited to 5000 pixels. This is especially limiting if you’re working on a landing page or a mobile screen that can exceed 5000 pixels height at times.


Do you enjoy using Balsamiq Wireframes like we do? What are some of your favourite tips?