This is a hugely ambitious project that represents an attempt to forge a new direction in car advertising and, as we’ve done on many previous projects at Stink Digital, explore new ways of bringing film to the web. The result is a 12 minute interactive film in which the user participates. After submitting themselves to a mysterious ‘interview’ at the start of the journey, the user then sees their image and hears their voice as part of the film as they ride shotgun alongside the protagonist, played by the up-and-coming actor Norman Reedus.
Technically we had a few challenges, not least having a lot of HD video to buffer and sequence, with the routes the user could take pre-buffered in time to keep the experience seamless on a decent connection. It took some experimentation to find the sweet spot of balancing highest video quality possible and performance and we made a nice queuing system to buffer the videos for the choices the user could potentially make and closing streams no longer needed.
For the interview sequence at the start, we were tasked with having as few clicks as possible. We managed to largely automate the process with face-detection for the picture, video prompts and countdowns. We achieved the recording of the user’s lines with the help of two great open source projects: Red5 for capturing the microphone and saving to the server and FFmpeg to normalise the levels and convert to Mp3.
For me, hearing your voice played back in context within the film was probably the most novel and fun part of the experience. I was also pleased with how we managed to integrate the decision points into the film, with a good-looking typographical approach and motion tracking video movements. Overall pretty proud of this one and extra pleased when it got the FWA ‘Site of the month’ for May, another first for Stink Digital and for me personally too.
www.lexusdarkride.com
www.thefwa.com/site/lexus-dark-ride
Posted By }i{ on August 31, 2010
Well I’ve been inexcusably slack in posting updates this year. Apologies to my readers. Both of you.
Anyway, backtracking a bit, the first big project I completed this year was an interactive film showcasing Diesel’s 2010 Summer collection.
A homage to Goddard’s 1964 film ‘Bande à part’, we shot the video in an uber cool East London pub and used an editing technique known as match-cut to squeeze the many participants adorned in Diesel’s collection into the 3 minute film.
Dubbed ‘A hundred lovers’ after the excellent song by new artist Josef Xorto, the piece took the form of a music video. The result was entertaining and somewhat charming.
The big twist from a technical and usability point of view is that you can roll over the video at any point which pauses it and shows hot spots for each garment and participant in that particular frame.
From there you can find out about participants and follow their social links, or discover what garments they are wearing and follow links to buy them on Diesel’s store.
To achieve this we first built an app, in Flash, to enable placing hot spots on the frames of the film and linking them up to the right data.
In order to be able to seek to any frame, skipping through to each look we went with Akamai real time streaming for delivery of the video.
We had to ensure we had highly optimised ActionScript to process all the hot spots for each frame. Instance reuse via an object pool was a key part of this, along with massively compressed JSON for the huge data set.
The hard work has been rewarded by great feedback from the public, which is still going strong on Twitter, the industry press and the FWA Site of the Day award for 15th April.
www.diesel.com/ahundredlovers
www.thefwa.com/site/a-hunrdred-lovers
Posted By }i{ on June 14, 2010
For the Stink Digital season’s greetings card we thought, as you do after a good few beers at Electricity Showrooms, that it might be cool to do some kind of snowball fight where you could record your throw and launch it at your unsuspecting friends via Twitter or Facebook. A month later we’d wrapped a bunch of really intense projects and had a clear couple of weeks to design, architect and build the thing. It was especially fun working with the excellent Red5 open source Flash media server which I’ll definitely be playing with some more in the new year. Here’s the result: http://holidays.stinkdigital.tv.
Posted By }i{ on December 15, 2009
We’ve had our noses to the grindstone in a big way creating this site for the new Sony PS3 and I definitely feel like it’s been worth the effort.
The brief was to create a ‘superhuman sales pitch’ in which the presenter turns out to have extraordinary powers. This lent itself well to us creating a sprinkling of fun and surprising interactive experiences to sit alongside the post-enriched film content.
The shoot day went really well, squeezing everything into one long day, and we got everything we needed to build the rest of the site. We opted for a PureMVC multicore based architecture, using the Fabrication utility to facilitate inter-module communication and the State Machine utility to manage the state of the application. Javier Abanses, Benoit Vinay and Shane McCartney all did a great job in helping us to realise the various features and elements of the site, which comprises video, audio, games, 3D animation, sound processing, particles, physics, Facebook Connect integration, language localisation and an ‘easter egg hunt’ competition.
It was a good opportunity to utilise the advantages of Flash Player 10 on a fairly complex microsite build. For example, the 3D capabilities came in handy in coding the tumblers and loader, Vectors helped speed things up and the sound features, notably SampleDataEvent, enabled me to create a really solid, smooth running audio sequencer for the music experience.
www.the15reasons.com
Posted By }i{ on November 19, 2009
Leo Burnett approached us to create an online event and experience to augment their ‘House of Cards’ campaign for the housing charity Shelter.
The site features the work of leading artists such as Damien Hirst and the Chapmans, and by uploading their own art through the site, users had the chance of having their work exhibited alongside them.
I created a 3d experience using Papervision, with design by Tim and HTML/PHP by Vincent and Marcel. Users could view the cards falling, view details of them, vote for their favorites and upload their own designs. We ended up with several thousand entries. After the competition was closed the entries were replaced with the artists cards, along with the winning entry and options to help the cause. The site was redesigned by Kristian Saliba with further Flash development by Huy Dinh.
http://www.shelterhouseofcards.org.uk
Posted By }i{ on September 24, 2009
Along with W+K, we’ve been helping Jack White’s new band The Dead Weather build interest in and broadcast a live concert over the www, sponsored by Nokia. My task was primarily to build a custom video player to be used to brooadcast the Akamai stream on the site, various blogs and on screens in record stores. It needed to be very lightweight and work at pretty much any size. I took the opportunity to create some nice reusable PureMVC classes for the streaming and player build. The player is also in use on the Stink Digital website.
View the live set here: www.fromthebasement.tv/live
Here are the source files for the Model side of things: VideoStreamProxies.zip
They are dependent on PureMVC and, in the case of the AkamaiConnectionProxy, on the Akamai connection package.
Posted By }i{ on July 3, 2009
Tribal DDB, Amsterdam asked us to create an online experience that could help to establish Philips new 21:9′s credentials as the best thing yet in home cinema. Adam Berg came up with a ‘frozen moment’ film treatment that really captured the imagination and we set about devising a site that would demonstrate the merits of the product in a completely effortless and uncontrived manner.
After a few days of prototyping, we settled on embedding the film in Flash to allow for total control over the playback. The user can drag through the frames of the film, slow it down or stop to inspect individual frames in detail. This, however, meant that we had a big video asset that needed to be loaded upfront, a problem we solved by adding a movie-style title sequence to the beginning of the site.
We created hot spot areas within the film where the user could go behind-the-scenes and gain some insight into the production process. We had to make this transition seamless, so that it appears that you are transported by magic into the scene, and this was achieved with some clever management of the video loading. The control bar expands to accommodate the extra footage, indicating that this new time line exists within one slice of the frozen moment.
Another big requirement of the experience was to demonstrate the key product features. We added a 16:9 view, with the typical black bars that 21:9 eliminates, and a runtime-generated ambilight effect that could both be toggled for comparison. Fully language localised to boot, there was a lot of work to do, but with the help of developers extroadinaires Matt Sweetman and Jamie Copeland and designer Eric Chia we conceived, planned and built a very solid site in only 7 weeks.
www.cinema.philips.com
Posted By }i{ on March 28, 2009
I have just launched this website for the Bank of England. Being a truly unique organisation, it’s been a really interesting project to work on. Read More
Posted By }i{ on September 12, 2008
When we were approached to create a web site promoting poet Caroline Bird it presented a somewhat new challenge in that we had to get ourselves into the mindset of creating something for an individual, rather than a brand or corporation. Read More
Posted By }i{ on September 12, 2008
‘Not for Lightweights’ is our approach to advertising an apprentice scheme for railway engineers. Targeted at 16 year olds, the apprenticeship programme is intensive and not for the those who want an easy option. Read More
Posted By }i{ on April 20, 2008
Stafford Long wanted to promote their graduate marketing services. The inital request from the new business team was to send out a rather dry email demanding that companies position them at the top of their pitch lists. We thought we could do something far more effective by using our creative noodle so we (me, Eric and Craig) got our thinking caps on. We identified their main point of difference from competitors as having a dedicated resource travelling the country gathering intelligence on university campuses. Read More
Posted By }i{ on February 20, 2008
Elevation Networks is a student-led initiative to bridge the gap between employers and students from under-represented sections of society. They were able to pitch this idea to Barclays Capital and got themselves sponsorship for branding, a website and some small collaterals. Read More
Posted By }i{ on September 20, 2007
KPMG needed to completely rebuild their dated careers website. We were tasked with enriching the user experience while meeting standards of usability and accessibility. Read More
Posted By }i{ on August 20, 2007