Saturday, 18 October 2008

Creating and sharing Mock-ups

I sometimes find working within distributed teams a really tough challenge. Different time-zones, communication and language barriers. The 'disconnectedness' of distributed collaboration often ends up meaning we talk using the same terms , but have very different ideas in our minds.

So, to ease these challenges, I've started to investiage different ways in which we can improve collaboration within the projects I'm involved in, moving beyond the traditional IM/IRC, Email and phone-conferencing facilities we use every day.

When developing software, I love visual representations of ideas, such as ER diagrams, UML, and UI prototypes/mock-ups. I am a very visual thinker, and usually spend a lot of time sketching ideas on paper before implementing them in code. However, paper isn't the easiest medium for collaboration across the globe, especially when you want to mash-up and collaborate in this process. I still haven't found a good and FOSS 'sketching' tool, but must admit that I have in previous lives relied a lot on e.g. MS Visio.

Today, however, I discovered Balsamiq Mockups, a web and desktop based mockup tool based on Adobe AIR. It was easy to install on Fedora 9 (using Flash 10 and the Linux Beta of Adobe AIR). The free version won't let you save diagrams or PNG snapshots, so a lower resolution(?) screen-grab will have to do for now. It also lets you import/export diagrams as XML (even in the free version!), so it's really handy as these XML files can e.g. be stored in version control repositories and can thus easily be shared with team members. Here's a quick mock-up I did to test the application:


At some point I started missing some of the advanced layout features (e.g. modifying the values of the pie-chart), but then again, it is a mock-up and is supposed to be quick-and-sketchy!

2 comments:

Kevin Kofler said...

I don't think promoting proprietary software on Planet Fedora is appropriate, especially when you're indirectly suggesting its use for Free Software projects. And that software isn't even free of charge, so you're also advertising a commercial product. I consider it a really bad idea to rely on proprietary tools for Free Software development (see the Linux BitKeeper fiasco for how this can end up). And the free of charge version is crippleware. The software also requires Adobe AIR software which is also proprietary.

Any drawing program (e.g. Inkscape, GIMP etc.) can be used to draw mockups. It is also possible to use a UI designer like Qt Designer or Glade, with the added advantage that this creates a prototype which can be reused directly in the actual software rather than just a mockup.

For diagrams, try Umbrello, Kivio or Dia.

Asgeir Frimannsson said...

RE: promoting proprietary software

I wish there was a good open source solution for this, but I haven't found one (yet). While Inkscape, GIMP and e.g. DIA let's you do a lot, they won't let you create a quick-and-dirty yet good looking mockup in less than 10 minutes, unless perhaps if you're an expert user of the tool or a talented graphical designer. It would be interesting to do something similar to this with e.g. a stripped down version of Inkscape and a set of 'customizable' mockup SVG clip-art that you could drag and drop onto a canvas..