👋🏽 We wrote a book! Order Wireframing for Everyone today →

Balsamiq

Toggle navigation

Introducing "Mockups To Go"

I am extremely happy to announce today the immediate availability of "Mockups To Go" (www.mockupstogo.net), a user-contributed collection of ready-to-use UI components and design patterns built using Balsamiq Mockups.
mockupstogo-thumb

The idea for the community server came from Michael Bourque, and he describes it better than I ever could.

Michael writes: "It would be great to one day have a website devoted to sharing designs created by people (like you) using Balsamiq Mockups. It would be similar to UI Patterns, except you could download each user submitted mockup bmml file. Each design would have a threaded discussion for people to openly share ideas and collaborate on design. Perhaps it could be powered by the Confluence wiki.

This would be a community powered site, and would exploit the power of Balsamiq Mockups, but most importantly would promote reuse and awareness of good design."

Four months later, MockupsToGo.Net is exactly it, except that it's powered by the incredibly easy to use blog-via-email system called Posterous.

Here's how it works:

Downloading and using components

  1. After installing today's new build, you will find a new item in the help menu:
    mockupstogomenu
  2. Selecting the menu simply opens a new browser window to MockupsToGo.Net, where you can then browse or search for a particular component.
  3. Once you find what you need, simply download the BMML file and open it in Mockups for Desktop. Then you can simply "Select All", Copy, and Paste it into your mockup. If you are using a plugin version of Mockups (or the web demo version) you can import the BMML via the Import feature instead (Importing won't erase your current mockup, it will simply add to it).

You may also subscribe to the site's RSS feed to keep track of new components as they get added over time. I have also set it up so that new posts are announced on my @balsamiq Twitter account.

Givng back: Uploading your own components to Mockups To Go

Thanks to the magic of Posterous, it couldn’t be simpler. To upload a new component to the site, you just send an email. Here's a sample one:

mockupstogoemailThings to notice:

  • the email must be sent to post@mockupstogo.posterous.com
  • the subject of the email contains the name of the component / design pattern
  • the body of the email contains your name and a brief description of your contribution (these are both optional, but encouraged)
  • there are 2 attachments, one is the BMML file and the other is the exported PNG of it

That's it! Once you send it I will get an email, and approve it with one click! If you don't see it live on the site within a reasonable amount of time, send me an email and we'll figure it out.

Thank yous

I have already mentioned that this was Michael Bourque's idea and not mine, but what I also wanted to share with you is that Michael really took the time to make me understand the value of it (it took me a while but now I'm a total convert). Not only, he contributed a number of useful controls already, and pushed me to make the site as simple as possible to contribute to (thus our choice of Posterous, I had gone with a custom wiki site at first). So thank you so much Michael, this really is "your feature".

There are another 2 people I want to thank: Michael Rawlings and Theresa Neil. They both helped me refine the site and contributed to it in the last few weeks, and again pushed me to make it as simple and usable as possible. You can see some of Michael's contributions on the site already, and Theresa has lots to add but has been busy finishing up her new book with Bill Scott (yes, these are the guys behind looksgoodworkswell.com).

Thanks so much guys, and a thank you in advance to all of those who will be contributing to Mockups To Go!

Also in today's update

I spent a couple of days this week working with Eugene Mirotrin and S. Dharmarajan debugging 64-bit-linux saving and opening issues. The latest Mockups for Desktop build fixes most of these issues, but it might take a little longer to really nail it all down. Still, this takes care of most of it so I recommend upgrading if you're having similar issues.

To download the latest build:

  • Mockups for Desktop: here
  • Mockups for Confluence: here
  • Mockups for JIRA: here
  • Mockups for XWiki: here
  • Web Demo: here

Onward!

Peldi for the Balsamiq Team

Leave a Comment

Comments (18)

  1. I can’t seem to get http://www.mockupstogo.net/ to launch.

    [Peldi: Hi Steven, Posterous is under a DOS attack: http://blog.posterous.com/todays-outage-and-changes-for-custom-domains – we just made the DNS change, hopefully it will be enough to make the site work again soon]

  2. This is a great start but it doesn’t seem these make their way into the product. It is simply a way of copy and pasting. It would be great if these addions could be added to the top bar next to the default selections (All, Big, Buttons, iPhone, etc.)

    [Peldi: yup, we’re working on it! http://is.gd/bv7Zt%5D

    Michael Bierman
  3. Hi,

    I have tried to download menu templates from your site and am just taken to a page which shows me markup language.

    Please advise how do I download your stuff.

    Many thanks

    Amer

    [Peldi: Hi Amer, right-click on the link and select “save link as…” and save it to your computer instead]

  4. Pingback: Linéaris » Blog Archive » Communauté Balsamiq Mockup

  5. any news on this feature peldi? i also would like to be able to add these new widgets to the catalog and not have to cut and paste the bmml files

    [Peldi: Hi Simon. This feature is on my mind these days. I plan on sharing our ideas about it in a week or two, stay tuned here and on Twitter! I want to start development of it in 2-3 weeks]

  6. I’d also like new controls to be accessible through the main BM interface to avoid re-loading and copy-paste. Obviously the current implementation required no additional effort from Balasamiq Studios and was the no-brainer way to do it, but it lacks elegance and surely a properly integrated way to use custom controls would be best for everyone involved. And obviously there is much support from the userbase to add this capability so hopefully someone within Balasamiq is working on this 🙂

    [Peldi: Hi Cameron, yes it’s one of our top-requested features and we have pretty exciting plans for it. Let us “finish” what we’re working on and we’ll get to that right after, give us a few more weeks]

    Cameron B
  7. +1 for adding the downloaded controls to BM window instead of having to reimport/copy-paste every time.

    Srinivasan
  8. I agree. It would be so much easier if we could add these controls to the BM window for easy future user.

  9. Can these custom controls be imported and available within the BM window without re-importing each time?

  10. Pingback: Balsamiq Mockup on AIR at Springsteam - Next Generation Java Development | Spring . Flex/AIR . 3D

  11. Pingback: Dew Drop - February 11, 2009 | Alvin Ashcraft's Morning Dew

  12. Hi, Is it possible to add it to the library? Otherwise I have to search for my downloads and then use it. Would be great to add it to the default or other library in mockup app.
    Cheers and thnx again!

  13. Looks great Peldi. I’ll crawl through my files and find some designs to post.

  14. Wow! Cool! Hoping for iPhone stuff 😉

  15. freakin awesome!

  16. Pingback: Communauté Balsamiq Mockup | Linearis, le blog

  17. Hello!

    This sounds great! But you know that eventually, you have to do the upload to / download from the portal right in Balsamiq, don’t you? 🙂

    [Peldi: Heh…baby steps, baby steps… :)]

    Karsten Silz
  18. FYI, this post was picked up on Hacker News: http://news.ycombinator.com/item?id=438638

    Peldi Guilizzoni