Tag Archives: Flash

David Beckham Academy

FWA winner, Adobe Site of the Day winner and Creative Showcase runner-up.

I was asked by Tribal / DDB London to create a web based games site, for a joint campaign between The David Beckham Academy and Volkswagen.

Play the games

We decided to use filmed action of Beckham himself in-game, with the ‘video alpha channel’ support of Flash 8, which was very new at the time. I came up with the game concepts and shot list, then met with the film crew at ‘Off The Radar’ to organise the shoot with Beckham – we had less than an hour of his time to everything done, but he was a complete pro, completing most of the action in one take!

Tech used

  • Green screen atΒ Flash Studio Norte, Madrid
  • Panasonic VariCam (1080p @ 50fps)
  • Adobe After Effects
  • Adobe Photoshop
  • Adobe Flash
  • A football

dba-green1dba20I went to Madrid for the green screen shoot with Beckham as visual effects supervisor and was responsible for treating and editing the footage for game production and related media.

I stitched some of the sequences together with morphs to create almost seamless blends dba-kick01between shots and added real-time lighting filters to the footage to help with the in-game compositing.

I coded a 3-D projection system in Flash and perspective-matched each scene, so that objects move around the screen convincingly. I worked with the designers at DDB, who created the backgrounds and UI elements. I included ‘Express Install’ capability for those users without Flash Player 8, so 95% users could upgrade painlessly from Flash Player 6 or 7. All the games are mouse-controlled and were user tested with children for usability and game balancing.

A high-score table and ‘challenge a friend’ feature was included – users with the highest scores were entered into a prize draw to win a training day at the academy with David Beckham. While modern video games only ever motion-capture players and recreate them as 3-D models, the DBA games site, while it’s dated a little over the years, still remains a one-of-a-kind that I’m rather proud of.

Note that you’ll need Flash Player in your browser to play the games – no mobile support – the games predate most smartphones πŸ™‚

By the way, there are a few ‘Easter eggs’ in the game, only one of which I can remember at the moment: in the ‘Shot Stopper’ game, type ‘safehands’ to get some big gloves to make savings goals easier.
safehands

Lurpak Breakfast – how it was done

I thought I’d give a quick insight into how the animation effects in one of my projects were acheived.

Scott Bedford, former Creative Director at Carlson Marketing, posted this video of a project we worked on a while back, for the Lurpak Breakfast campaign. I created all the animation prototypes for the various effects used throughout the site, some of which can be seen here. The site won two DMA awards, but I’m most proud of the crumbs animation and the code-generated interactive steam effect – similar to the one you’ll see on my homepage.

Continue reading Lurpak Breakfast – how it was done

Blue lego block of ambiguity

At the risk of getting sucked into the Apple vs Adobe shitstorm, my own response to Apple chosing to block Flash content from their mobile devices is to at least tell users why – because Apple left it at the rather obscure blue lego block, with no explanation (great experiential design guys). Simply include this code in your page/s to redirect mobile safari users to a page of your chosing …I direct them here.

FlashSize – simple browser resizing

How to allow SWFs to display at 100% width/height in your browser – but enforce a minimum width and height, in case of a smaller browser window size than you’ve designed for.

Until recently, I’d used other Flash/browser resize managers when I needed to ensure a SWF is embedded in HTML at 100% width and height, but with support for a minimum width and height setting. But I recently needed a solution the didn’t depend on external JavaScript, due to not having control of the page the SWF is embedded in.

With my simple FlashSize script, all you need do is call: