In the summer of 2008 I was fortunate-enough to meet the very talented James Piper, whose work I had admired for some time.
James and I knew pretty quickly that we wanted to work on a site together, and it wasn’t long before a new bar venture, The Lost Angel in Battersea approached James to produce a website that would be as magical as the new destination boozer they intended to create.
James was instrumental in helping the bar define their brand, but we wanted to take the interaction to another level.
We decided that a Flash-based site, with music, animation and a narrative would be the answer. Even though a large download seemed counter-intuitive, just as the world was speeding up, we wanted a destination website that would delight as much as the destination bar.
James and I worked closely together, with James designing beautiful 2D layouts with an animation-focused, transitional feel, from section to section. I worked hard on both the 3D modelling, compositing and After Effects animation, with James providing live action, art-direction, layout, assets and audio.
Our approach was iterative, working with a clear design ethos mind, across layout, design and animation, in Photoshop, 3dsmax, After Effects and Flash, ultimately bringing everything together in a slick Flash Microsite.
Here’s a gallery of screen shots from the asset-creation segment of the job, that ultimately ended up in both the pre-rendered animation sequences, as well as the live Away 3D animation:
- Gold picture frame (wireframe)
- Gold picture frame (viewport)
- Gold picture frame (texture map)
- Gold picture frame (rendered)
- Wooden picture frame
- Metal picture frame
- Trumpet lights
- Ivy (wireframe)
- Ivy (rendered)
- Loader 1
- Loader 2
- Loader 3
- Loader 4
- Table (transparent)
- Table (composited)
- Telephone box (lighting test)
- Telephone box (rendered, 1)
- Telephone box (rendered, 2)
- Telephone box close-up (rendered)
- Telephone box close-up (viewport)
- Telephone box close-up (wireframe)
After building all the animated assets, the site was built as separate SWF modules that loaded into a single container that contained the logic, graphics, and common assets.
About a year after the project I found out about the Gaia Framework which in hindsight I wish I’d used as it would have shaved a big chunk of time and a lot of bug finding off the project (as it happens I used Gaia for various other projects in the following years).
The site itself contained audio, video, Away 3D, 3dsmax and After Effects animation, a small amount of back end, but mainly a lot of attention to detail within the Flash and the animation to make the user feel as if they were part of a magical experience even before getting to the bar.