howies T-Shirt Election

A rough concept…

howies had decided to buy banner advertising to draw people to their website, and needed something to hang the marketing on. As the election was fresh in people's minds they decided upon an idea for voting on favourite t-shirt designs from the past 10 years.

Agile design

During a fast and furious breifing-come-design meeting at howies HQ in Cardigan, Wales, we managed to nail 90% of the functionality required to make a vague concept into a reality. On returning back to our own HQ in Brighton we refined the hastily-sketched wireframes and notes, producing detailed wireframes for the designers back at howies to work from, while we would press ahead with building the application.

What does it do?

Underneath a very slick user interface - drag-and-drop, with lots of interactivity - the application is pretty simple. It's really just a form that allows users to 'vote' on their favourite t-shirt, storing their preferences in a database. It also stored their name and email address of course, as well as allowing them to sign up for howies email newsletters.

(We also threw in a cool reporting page, showing live data on how the votes were stacking up.)

At the end of the campaign a voter will be selected at random and presented with the 10 most popular t-shirts.

Build it and the designs will come…

Since the wireframes were agreed we were able to build the back-end functionality while Pete and Aaron at howies created final designs. They had limited experience in design for web (great t-shirts though!) so we helped out, starting by deciding on the incredibly useful 960 pixel grid system. We then made final graphics from their files, including PhotoShopping all the photos of open t-shirt to make them look like they were folded up.

We then coded the Cascading Stylesheets (CSS) which, in conjunction with the graphics, defined the 'look' of the project. The 'feel' - the complex drag-and-drop interface - was achieved using JavaScript, the final layer in the cake.

Test, launch, wait…

The whole shebang took about a week to complete, although we then had to wait until suitable ad slots were available before the app was formally launched.

Working remotely with external designers always looks like a potential challenge, but when both parties are prepared to listen to each other and respect each others' expertise things can go remarkably smoothly.

Degrading gracefully

Given our commitment to W3C Web Standards and accessibility, coupled with howies' keenness to ensure accessibility to as wide an audience as possible, we built the application using best practice techniques. For example, the JavaScript 'behaviour' is an enhancement rather than a necessity. Even those with browsers ten years out of date can still take part, although with a less refined experience than most people will get. That said, the application is tested on all the most-used browsers, including Safari, Firefox and Internet Explorer right back to version 7.