Balsamiq Community Discussion

Balsamiq 3.5 Desktop HTML Output?

Hello Friends,

What is the best approach for producing HTML from a Balsamiq 3.5 mockup? Is there a preferred third-party company that has a solution for this? I am in an environment that makes it very tricky to purchase/install new software.

Thank you.

Hi @Doug,

Thanks for the post and welcome to the forums.

This is one of these questions to which there’s no right answer - and not really any single answer. I say that because different people use different flows to get from idea to finished product.

As a low-fidelity wireframing tool (see: How Does Balsamiq Compare to Other UI/UX Tools?) it’s unusual to go straight from wireframe to code. Wireframing tends to be an ideation activity where concepts are brainstormed, discussed, amended and discarded reasonably quickly. Typically, there will be a more ‘pixel-perfect’ design step between a wireframe and the finished product but not always - some customers generate a project of wireframes then hand it off to engineers and say ‘please make this’ :slight_smile:

As such, there are not really tools which will take Balsamiq wireframes as input and create HTML/CSS/etc. We’ve seen a couple come and go but, frankly, the results tend to be underwhelming.

Sorry to not have a better answer for you, Doug, but I hope this helps puts the problem in context. Please get back to us if you have any other questions, ok?

Thank you Alasdar. I am familiar with this. With other tools though, I have the ability to create low or high fidelity mockups. This work can then be exported/saved to HTML. This provides a real value add as a UX Designer because it saves time for the developers because they can leverage the UI in their presentation tier and, in my opinion, leads to a better end product (Leaving less to the developer imagination). I find the requirement to save to PDF very limiting. I could be wrong, but it seems I have to export to PDF to simply print.

Over here, “Peldi” (Balsmiq Forum member) states that exporting to an older version of Balsamiq will allow the use of a third-party tool to generate HTML. I thought and hoped that perhaps this functionality had matured and perhaps Balsamiq acquired the technology from one of these third-party companies.

It sure would be a nice feature to have, but it sounds like this is not the correct tool for the job. I am forced to live with it in this organization though. I can’t magine I am the only one who would capitalize on the benefits this would provide. Thank you again though for your response.

Hi Doug,

Thanks for getting back to us. It’s possible you may find a (third-party) tool which allows you to convert direct from mockups to HTML but in our experience, the results are variable and, in many cases the tools have fallen out of maintenance and/or are no longer available.

You could take a look at: https://www.yotako.io/ but I’m not sure either how good a job it does or whether it’s still supported.

On the issue of printing, we made a conscious decision to omit printing as, in our experience, most projects tend to be shared electronically and, for people who need to print, the single extra step of exporting to PDF then printing was not a deal-breaking burden.

There’s some great background reading on how we position ourselves at the link in my earlier reply.

I’d love to be able to give you a better answer but it’s likely that, if automatically exporting from wireframe to HTML is a requirement for you, we’re just not the right tool for that job.

This may be of interest. We don’t convert Balsamiq pages directly to html but we can build live prototypes directly from Balsamiq project files. You just upload your .bmpr file with any images and relevant data files. Our product “bmprGO” will auto build a prototype application and give you a url to run it anywhere on any targeted device. It can also build a database for you and include any sample data you may have in your project. You can run your application using real data.

bmprGO can manage all the standard controls from Balsamiq Mockups 3. There are a few basic rules to comply with but if you’re looking to turn your mockup pages into html, I suspect that you already comply with them. This is a new product and we’re looking for more Balsamiq users to try it out (for free of course). You can do further customisation in bmprGO to get the effect you’re looking for and you can deploy it to end-users to try out. There are tutorials available, it’s worth doing some of them to get a feel for what you can do and how you do it. Go to https://www.bmprGO.com.

Thank you. If the organization I am working for sticks with Balsamiq I will check your product out. Another product with five letters in the name handles this all natively and quite well in my experience and I have recommended switching to it.