Stockholm-based creative agency House of Radon (opens in new tab) has just completed this inspiring Now You're Cooking (opens in new tab) campaign for Swedish home appliance manufacturer Electrolux. Hosted on Tumblr, the campaign allows food lovers everywhere to cook-along with, or simply watch and enjoy, eight different recipe videos.
The overall concept came about as the team reflected on the ever developing digital age. "The idea was based on the insight that today no one really uses recipe books anymore," says copywriter Samuel Sweetman. "Instead, people are in the kitchen with their iPhones or laptops cooking off online recipes from blogs and Pinterest, etc. So we wanted to create interactive recipes for people to cook along with at home in their kitchens."
Electrolux also wanted its consumers to be inspired on platforms they spend most of their time on. So, House of Radon got to work on a visual design that would work across Tumblr, Pinterest (opens in new tab) and Vimeo (opens in new tab). "We wanted to keep a visual style that would be easily recognizable across all platforms and keep the user engaged while going between the channels," says digital PR specialist Louise Ljungberg.
The result was a handmade, bespoke typeface that reflects the aesthetics of the art-deco era. Art director Albin Holmqvist explains, "The quirky letterforms could often be spotted in french bistros and such in the 1920s and 1930s, and has a natural connection to the art of food. The brushstrokes and texture gives the typeface the authentic and human feel we're going for."
Visual design nailed, the team then turned their attention to user experience. Keen to keep the videos engaging, added functionality is available on the Tumblr site. "We're very proud of our HTML5 videoplayer," says developer August Björnberg. "It has a custom design for both normal and fullscreen view and also includes 'Cooking mode' where the video stops in strategic places so you can cook along with the recipe as it sums up to the previous steps. To do this we used Coffeescript to JavaScript through node.js and some good old HTML bashing on Tumblr."
The team pulled the visuals and technical aspects together to form the cool campaign, which was launched online last week. "Being able to be involved in every step from the initial pitch to a finished product that involves so many elements was awesome, hopefully it shines through in execution," says Holmqvist.
Now read these!
- 40 amazing examples of HTML5
- Brilliant HTML5 site promotes Eastpak campaign (opens in new tab)
- 101 CSS and JavaScript tutorials to power up your skills
