We Need @ Social Innovation Camp December 9 2008

This weekend I attended Social Innovation Camp, (SICamp) where I had an absolutely fantastic time! SICamp is an experiment to bring together people over a weekend and get them to build/prototype web apps that will drive social change - check out what the Guardian had to say about it on Saturday and then on Sunday after the projects were presented.

I worked on the we-need.org project, which was led by Craig Griffin from Fresh Voice. The idea is to provide a web site where people with disabilities are able to express their needs through an accessible web interface rather than having their needs assessed by the system as it is currently (i.e. by filling in a 50-odd page form). The site would then aggregate and present interactive visualisations of the needs in a given community so they can be more efficiently handled. Hopefully the video of the pitch we presented on Sunday will be made available online soon, where our team explained the concept far better than I can!

For the weekend, we built a Ruby on Rails application where users could use a basic html form to express their needs. We also experimented with a graphical radial interface which is better suited for people with certain types of disabilities. We used the Geokit Rails plugin to geocode users' addresses so that their needs could be plotted on a map. We used Simile Exhibit to prototype the visualisation of the aggregated needs of communities on a map.

As mentioned during the project presentation, we required some sample data so I put together some Ruby to randomly generate some users and their needs. So here is the infamous Ruby "random needs generator" one-liner:

(0..rand(3)).to_a.map { |a| rand(@@need_count)+1 }.uniq

I've bravely put all of the we-need code on github, but do keep in mind that it was all built in less than 24 hours!

I had a really amazing time, worked with some fantastic people on We Need and also really enjoyed the post-SICamp discussions in the pub on Sunday! Big thanks to the SICamp team for organising everything - I'm already looking forward to the next SICamp meetup!

My take on regression testing CSS November 15 2008

As we add new features to the BBC Music Beta, we have more pages to check before making a new release.

We're using test-driven-development on the code generating the pages, but obviously these techniques don't cover the visual appearance of the site. As we reuse the same visual modules on different pages across the site, CSS bugs creep up unexpectedly on different pages across the site.

For example, the code generating the links module is reused on three different pages:

And to illustrate the problem, I just noticed a CSS quirk with the background of the links module on that third link. So I started thinking about how one might go about regression testing CSS and hacked a simple solution together using CutyCapt, ImageMagick's compare tool and Ruby Rake.

The result is illustrated here:

Stable version of BBC Music Beta artist profile page Development Version of BBC Music Beta artist profile page Difference between the stable and development versions of the site

The first image is a screen capture of the stable version of an artist's profile page, taken directly from the live BBC Music Beta. The second image is taken from our development version of the site. The third image shows the difference between the two - in our upcoming release we are shuffling some of the modules around so these changes are very noticeable.

At the moment, my tool is very basic: you give it the stable and development host names, and a list of paths to test (example configuration). It uses CutyCapt to pull down each of the paths from the stable and development hosts, and then runs the ImageMagick compare tool between each pair of images. It then produces a very simple HTML file that displays all of the pages being tested.

While we're just using this tool informally at the moment, it's already been really useful to catch unexpected CSS bugs on our site.

Page 4 of 9

Previous page

Next page