»

Free sims + The O2 = Tinnie Tempah!

O2 free sim site with the Tinnie Tempah promotion, 2011

O2 free sim site with the Tinnie Tempah promotion, 2011

A 3D logo on fire!

When VCCP did a 3D Tinnie Tempah logo on fire for a TV spot I thought, “Wow! A 3D logo on fire!” Could I perhaps have a go at recreating it in Flash? How could I pass up an opportunity like that?

 

Back to reality

The TV spot was a glorious piece of 3D in HD with a budget to match. How was I going to do this? This web promo had to be light weight and optimised. What’s the one thing online that can’t be done on TV? Something that makes up for the low production values… Interactivity.

 

Recreating the logo

THe Tinnie Tempah logo was imported into Cheetah3D, a simple and relatively easy 3D software app to use. Here I used the UV map to paint the colours and shadows. Avoiding normal mapping seriously helped optimise the final 3D. The model was exported to .3ds and imported into Prefab3D, a fab Adobe AIR app that let’s you export your models to ActionScript for Away3D.

The flames were created with Flint and placed on a plane in the Away3D viewport. The sparks flying in from the left also use flint. This time on the Flash stage.

 

Optimisation

It was all cool as a cucumber until we put the SWF on the test site. Internet Explorer, particularly 7, didn’t like it. There was a struggle for resources with the HTML form widgets. A series of compromises were made in the Flash until the balnace was right.

  • Most of the animated bokeh lights were stopped
  • The particle count for the flames was reduced
  • The framerate was dropped to 12 fps

 

O2 free sim Tinnie Tempah promotion thank you page, with bokeh lights

O2 free sim Tinnie Tempah promotion thank you page, with bokeh lights

The full bokeh lights effect was used on the thank you page. For those of you who have Flash Player installed you can see the 3D logo on fire here.

Bookmark the permalink. Post a comment or leave a trackback: Trackback URL.

Post a Comment

Your email is never published nor shared. Required fields are marked *

*
*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>