Lost your Mockups key?
Log In to myBalsamiq
Already have a monthly subscription for our cloud-based web
Log In to myBalsamiq
As you should know by now, our main goal as a company is to help rid the world of bad software, one user interface screen at the time.
We try to do so by making and constantly improving Balsamiq Mockups, by giving our software away to schools and UX teachers, by highlighting software we love to use, by sponsoring blogs and events that teach the world about Usability and User eXperience, and more.
If helping others build more lovable software is your passion, we want to help you. Simple as that.
Today we are thrilled and honored to introduce our latest initiative in this area: a new, free version of Balsamiq Mockups, integrated with UX.StackExchange.com.
If you don't know what StackExchange is, you've been missing out. It's a collection of community-edited and moderated question and answer websites, each dedicated to becoming the single best online resource on a number of different topics. The most famous StackExchange site is StackOverflow.com, the ultimate Q&A site for programming questions. Other popular StackExchange sites are Startups.StackExchange.com or English.StackExchange.com, about the English Language and its Usage. See a full list here.
About a month ago we were excited to see that UX.StackExchange.com launched publicly, and thanks to the long beta period had already become a wonderful resource for anyone interested in creating better software.
Almost immediately, we noticed that people were attaching images made with Balsamiq Mockups to their questions or answers to make them more clear.
Here's a few examples:
Shortly thereafter, ux.stackexchange user Moshe Berman posted this question:
A few days later, I got an email from Joel Spolsky asking if we could make it happen. Clearly, we jumped at the opportunity, it' such a good fit with our mission!
A few mockups later (shared between the teams via myBalsamiq of course), a couple of weeks of coding, and here we are!
It's free for you to use, and - in case you're wondering - it's free for StackExchange to host.
StackExchange developer extraordinaire Benjamin Dumke-von der Ehe was able to integrate our core wireframe editor really nicely.
When you first ask a question or submit an answer, you can see our little smiley icon in the StackExchange editor.
Click it and the Balsamiq Mockups editor will pop up in the browser.
Create your wireframe or import an existing BMML (from Mockups for Desktop for instance), then hit Save and Close and voila', the mockup is added to your question.
You can add text above and below, or add more wireframes to the same question.
To edit an existing mockup, just click the "edit the above mockup" link in the preview panel.
Taking someone's wireframe and proposing an alternate design is a very important part of every UI discussion.
Here how to do it:
<!-- Begin mockup
End mockup -->
If instead you want to make your edits in Mockups for Desktop, you can simply click on the little "download bmml source" link under each wireframe, edit the BMML in Mockups for Desktop, export it (CTRL+E), then go back to the browser and use the Import XML feature in the editor to upload it.
This integration launched today, and we are already seeing the community using it successfully (two examples).
So, next time you have a doubt your UX ideas, why not ask the community at UX.StackExchange.com? Bookmark it now! 🙂
Many thanks to Benjamin Dumke-von der Ehe, Jarrod Dixon, David Fullerton, Michael Pryor, Joel Spolsky and everyone else at StackExchange who helped with this little project. As usual, you guys are a real pleasure to work with.
Peldi for the Balsamiq Team
Get the Inside Scoop
We'll send you just one email a month and share a ton of information that you'll get before everyone else. More info about the newsletter here.
We'll never share your email address or spam you.
Your email is never published nor shared.
I would like to see this implemented in all stackexchange websites that are programming related.
It’s still there, but we changed the icon to look less like an emoticon and more like an “editing a wireframe” icon. Also, you need to be logged in and have enough points in order to use it (just like inserting images).
Dude, where did this feature go? This feature is no longer on ux.stackexchange.com.
Why not on all stackexchange sites?
[Peldi: well, it’s not very useful to philosophy, history, literature…we might expand to other relevant sites in the future, but let’s see how this one goes first. :)]
Pingback: Enterprise vs Consumer: Product Development at Careers 2.0 « Blog – Stack Exchange
You guys at Balsamiq are extraordinary! seriously. Can I suggest speaking with the guys at Atlassian. Similar integration into their Atlassian Confluence wiki markup would be again…. extraordinary! 🙂
[Peldi: a Confluence plugin was our first product, check it out! http://balsamiq.com/products/mockups/confluence%5D
Thanks for the plug.
I want to point out that I only asked about the integration because I was given a copy of Baslamiq mockups as an open source contributor. I love it as much as I love StackExchange, so I suggested the integration. Thanks for the license!
Any chance I can get my website or SO profile linked to my name in the post?
Moshe Berman (.com)
That’s a very good example of: building a better World! 😉
i think you meant “know by now”
[Peldi: fixed, thanks!]
Good Guy Balsamiq.
very cool idea. I like it very much. However I must say that the integration could need some polishing. Imho it’s a little bit too complicated on how to edit a mockup in an answer or that the whole mockup block is so big.
Maybe some polishing would be nice 🙂
[Peldi: definitely, we have plans to make that use-case much smoother. Stay tuned!]
A smiley icon? Won’t people think this is for inserting emoticons?
Awesome, this is fantastic!
This is fantastic for use by Humanitarian Free and Open Source (#HFOSS) projects to bring the advice of UI and UX experts who may also be passionate about global social issues.
VP of Engineering
Thank you for this major contribution to the site. We are very excited!
[Peldi: nice to meet you too Stefan! :)]
Thank you very much for making this offering free to the UX community. Balsamiq rocks!
Yay! Thanks all – this will be a great addition to ux.stackexchange.com, enabling the community to easily present a mock up of ideas, scenarios, problems, and solutions in a consistent and editable fashion. And the ability to take the mock-up from a question, and adapt it separately in an answer is perfect. Just what we needed – I look forward to seeing it in action, and of course – using it!
Very cool! Thank you for giving the UX community this opportunity!
Looovely! The flexible integration with down/upload option is great.
Thanks so much for this!
Awesome! This is a great resource for the UX community
Very cool! Thanks for making this available.