
Last year Adobe tasked BLITZ with building the Flash 10 year Anniversary website with the goal to commemorate 10 years of Flash history. It was a “time capsule” of sorts, allowing people to submit ideas of what they felt should be included. Additionally the site gave users a sneak peak into the future of Adobe’s web platform products for the year ahead, Apollo and Blaze. This was one of the most challenging, yet rewarding projects we have worked on and wanted to share with you what went into making it happen.
We had to come up with a fresh approach to the traditional “Timeline” presentation while reinforcing the impact Flash had over the entire world. Given the project, we weren’t going to create the typical “click and slide timeline;” instead BLITZ decided to give control to the user, allowing them to drag the world forwards or backwards in time, instantly providing feedback of events and their locations that took place during that year. Locking down the concept cut deep into our production schedule, leaving the team only three weeks to complete the development, including the Jonathan Gay video shoot and post-production for the intro to the site.
The final content wasn’t going to be ready until a few days before launch, so we had to build a dynamic way of mapping events to their actual geographic locations for both world view (above) and close up view (below). The world view was especially problematic as the location points had to track with the Earth rotation and account for the Earth radius. To find each location we used Google Earth and Google Maps, which helped us populate the Timeline XML.

We re-built the Earth rotation widget three times in order to optimize it for best performance. We started out with displacement / convolution filter approach. Unfortunately we needed a high resolution rendering of the earth and the AS2 performance for pixel manipulation was just too slow. We then attempted image sequences, but for smooth rotation we needed about 300 JPGs, all of which had to be fairly good quality since the user could “stop rotation” on any frame. We also went the FLV route and got quickly reminded that video codecs are not built to play backwards smoothly. Regardless, FLV gave the best quality/compression combo, so we ended up using two FLVs - one rotating forward and the other pre-rendered going backwards. When the user switches direction, we’d swap the video streams jumping to the right frame of the new video. Both FLVs are always playing forward, the swap is transparent to the user and we effectively eliminated the chugging. Lastly we enhanced the “look” and applied dynamic lighting over the Earth by applying several layers of Flash 8 Filters and Transfer Control Layers.

One of the things we had to strip out were the celebration candles. With each Earth rotation, a candle was going to be added to the Earth. See the story board below (the remaining storyboards are in the production gallery below).

We also added a couple of several Easter Eggs. The Satellite takes you to the Animation Gallery, and the North Start takes you to the Flash Penetration Graph.

We also added the obligatory call to action - Become The Future by getting Flash:

And a section with Kevin Lynch and Jonathan talking about the Future of Flash.

Video Production



With the explosion of Flash Video and YouTube in 2006 we made a decision early on to do all section transitions in near HD video (1000×600). In addition, Jonathan Gay, aka the father of Flash, agreed to host the site. This meant we had to add an HD intro movie, which quickly doubled in length during the video shoot. The “cosmic zoom” concept was to take the audience from a satellite view of Adobe HQ to space and seamlessly transition from Video to Interactive UI.



The Video shoot took place outside San Francisco. Because the shot had to be 100% seamless, we ended up renting a Crane Mounted Camera, green screen studio and a bunch of crew members from near by Industrial Light and Magic (George Lucas’s VFX company). After we got the shot right, additional interviews with Jonathan and Mike Downey took place.
The intensive video post-production involved lots of tracking, virtual 3D sets and audio. Uploaded below are a ton of images from the video shoot, as well as screenshots of the post production process - a lot of work was poured in.




This was an incredible experience for us - from meeting Jonathan Gay, to the incredible video production and Flash development challenges and we are grateful BLITZ was given the opportunity to build the site.
On to the Video Production and Post Production Gallery:

Share This