10th February, 2005

Project Facade

After two months of blood, sweat and tear-soaked tags, today we finally launched Project Facade on behalf of new client, respected artist and all-round good chap Paddy Hartley and his team.


Working with Paddy has been a dream, as he has provided masses of inspiration, images, copy, site ideas - and coffee. If you wanna know a bit more about how this beast was built, read on…

Understanding the project

The most difficult aspect was trying to collate the various elements of this multi-layered project, and somehow reflect the onion-skin nature of it through a website.

Over the course of the next two years, Paddy Hartley will be creating new sculpture in response to the patient records of First World War Servicemen from The Gillies Archive held at Queen Mary’s Hospital, Sidcup. These documents provide a rare and unique insight into the origins and development of surgical facial reconstruction techniques pioneered by New Zealander Sir Harold Delf Gillies and his surgical team during and after The First World War. A major aim of the project is to trace family members of some of the servicemen treated by Gillies and his team during this period and tell some of the personal stories and recollections of how these extraordinary men coped with their injuries in everyday life.

Paddy will also collaborate with Dr Ian Thompson in the Department of Oral Maxillofacial Surgery at Guy’s Hospital, London developing casting techniques to produce tailor-made patient injury specific Bioactive glass facial implants for the repair of boney injuries and defects of the face.

By frequently visiting Paddy’s amazing studio by the Thames, and facing the Houses of Parliament, I was able to quickly build a thorough understanding of the goals of the project, learning a hell of a lot in the process. Paddy provided a myriad of source material for me to photograph and scan, including original patient folders, and the majority of images used on the site are based directly on this material.

Starting to build

A fresh install of Expression Engine, and the wonders of Basecamp got things off to a quick start, but deciding on the best method of site architecture was tricky. Luckily, Paddy provided site map ideas and together we worked out a fairly rigid site structure.

This was broken down into weblogs and categories in EE, and soon we had a navigable skeletal website. Due to the sheer volume of data constantly being given over from Paddy, it was important that we could get this uploaded throughout the build - especially when it came to the complex Case Studies section, which uses beyond-complex custom MySQL tags to attach image galleries to weblogs, in turn making the section work a little like a relational database.

The importance of standards

Paddy gets standards - he understands the importance of accessibility and usability, and I worked with him to decide our best approach. The potential audience for the site is broad - elderly relatives of WW1 servicemen, educational institutes, gallery visitors, schools - and obviously a percentage of users with dis/abilities. We opted for some obvious methods such as large text/small text style switching, plus a styled text-only version. The access keys conform (where possible) to UK Government guidelines, and with quite a few text-blocks revealed by Javascript, we put great emphasis on providing alt content for those without JS. Hopefully, all the various image replacement methods are also working properly cross-browser.

Sure, we have some tabular data in there, and I’ve not yet debugged for older versions of I.E, but on the whole I hope the site is accessible to all.


Which visual route?

Project Facade has so many strands to it, that deciding which visual route to take was difficult. To choose between the WW1 archives wicked-worn route, the textiles/sculpture/needle and thread route, or the contemporary science/Bioglass technology route was difficult. Eventually we opted to go with the archives route, as Paddy was able to provide so much raw material and inspiration for this approach that it seemed most appropriate. Still, the Art/Science pages do retain a certain minimalism/sterile environment feel (for now).

The site relies heavily on background images, and where possible these are duplicated and repositioned to maximise their use. I still think some of the images need sharpening and refining, and performance-wise they probably need further optimization, but on the whole I’m happy with them.

credits apge

Other bits and pieces

If you ain’t got Lucida Grande on your computer, you’ll get Verdana. I do recommend viewing the site on a Mac, just for the sheer clarity of the text if not for the fact that Macs are better (cheeky). I’ve also got a bit more refinement to do in certain sections, so please forgive any obvious mistakes for now. The thing validates as Strict, although the CSS is a bit messy, despite being split across several imports.

Moving on

So, Paddy now has a fully editable site with which to document the next two years of solid graft. We’re aware that some sections are a little light on content, but that’ll be coming soon. Also, if you are a bit squeamish, I advise you don’t visit the Case Study galleries - there are some pretty severe injuries documented in there. Beware. Still, that’s what war does to people - no point in pretending, ain’t that right, Mr. Bush?

I still need to work out some spacing issues, there a bit of divitis in places, and a couple of data tables still have some presentational markup in them. Tut-tut!

Let me know if it looks buggy in a particular browser. Also, if you see room for improvement, I’d like to know. That said, working on this with eight other projects at once has been kind of exhausting, so go easy on me.

Prev / Next


If you enjoyed this article, please subscribe to my Internet of Natural Things letter, and maybe grab the RSS feed. Thank you.