The Other Side – Honda Civic Type-R

http://www.hondatheotherside.com/d.php

Agency: Wieden + Kennedy, London

THE THINKING

Honda is renowned for its reputation of engineering excellence, technology and reliability. But it’s the brand’s other side, born from a racing heritage and thirst for innovation, that this interactive film heroes.

Showcasing both the Civic and new Civic Type R, the wild child alter-ego of the Civic hatchback, the film unfolds an adrenaline-fuelled dual narrative. One set during the day, the other at night. The daytime story sees a father in his white Civic pick his daughter up from school to drive her to a surprise party. The after dark narrative shows the father’s other side – an undercover cop getaway driving a crew of art thieves to a police sting, in a head-turning red Type R. Whilst they contrast in tone, the two stories mirror each other perfectly in their composition.

The viewer can switch seamlessly between each film by pressing ‘R’, triggering Honda’s ‘Race Mode’ and throws the viewer into their very own director’s cut to see how each storyline unfolds.

There were also two sides to the technical development, with desktop users being directed to Honda’s YouTube channel while tablet users enjoy the experience on a self-contained HTML5 site.

The YouTube build uses a “custom gadget”, styled to look like a branded but ordinary YouTube player making the interactivity all the more surprising. Behind the scenes, two separate video players are kept synchronised, showing each side of the film.

The HTML5 build keeps both films in a single double-width video, and uses the Web Audio API to switch between the left and right channels of a single audio file. This approach lets us perfectly synchronise the two films for a lightning fast and precise switch, but is also crucial for the experience to work on iOS.

The most interesting part of this project was making the site work seamlessly, not only across dozens of browsers and devices, but also 22 locales.