We love good html5 banners. From the simplest to the most complicated. When it carries across the message of the brand and it’s voice in an engaging way, an ad banner can be highly effective. Have a look at ten of the best html5 banners we’ve encountered.
AUDI’s Quattro Curves Banners: HTML5 Banners Supreme.
Agency: Almap BBDO, Brazil This html5 banner allows you to take the wheel of an Audi Quattro and manipulate the steering. This in turn causes the whole page on which you are viewing the banner to react. For example, if you turn right, all the images and text flies to the left of the screen. Genius. The campaign promises that ‘Curves Will No Longer Feel Like Curves.’
NHS Beer Googles
Agency: Grand Union, UK Beseeching people to be safety aware whilst on holidays, the NHS launched an html5 banner about wearing condoms. By dragging the ‘Beer’ or ‘Cocktail’ icon across the screen, we see the image of a traditionally unattractive woman/man slowly becoming more and more attractive. In tandem with the icon moving along the lower part of the ad, the liquid leaves the glass. It then lets you manually drag the icon across the spectrum of ‘ugly.’ Humorous example for good html5 banners.
Fedex Just In Time
Agency: DM9 DDB, Brazil Using imagery of their business service (i.e someone handing someone a Fedex box), Fedex integrate a working clock into their html5 banner. Perfect. So on brief it hurts. Smart.
McDonalds’ Make It Better
Agency: Fjord, Canada At first this html5 banner is deceivingly simple. It merely features a button requesting you to ‘Make It Better.’ Every time you click it though, it gets more and more ludicrously ‘Better’, until we end with tacky music and cheerleaders. Fun. When made with thought, html5 banners work!
Agency: Clemenger, BBDO, Australia This html5 banner hilariously asked us to make ‘Bazza’ (a stereotypical looking Ozzie with a stereotypical nickname for Barry) to “…sing for his pasta.” You manipulated his voice very high or very low by running the conductor-like hand up and down a scale. Eventually the delicious pasta comes into view. A delicious triumph for html5 banners everywhere!
IKEA Unbox The Banner
Agency: Grabarz & Partner, Germany Brilliant example of an on-brief, intelligent html5 banner here. Basically, you assemble the advert across the whole screen for them. Just like you classically would an IKEA piece with screwdrivers and allen keys. Once ‘assembled’, the ad says “Now you’ve done your part” and indicate a reduced price for the assembly. Pure class.
ADIDAS The Line Runner
From their campaign ‘Impossible Is Nothing’ Adidas rolled out this highly effective html5 banner which let you draw the most (seemingly) impossible lines for this runner to run over. Of course, the runner makes the line every time, because ‘Nothing Is Impossible.’ Immersive, on-brief-class. It also includes a function on the banner to share your individual squiggles also, because boredom and stuff.
FIAT Don’t Drink And Drive: HTML5 Banners With A Conscience
A simple, yet painfully effective image on how drink and driving can create such horrible chaos. By manually pulling down the icon on the pint glass, we see the effects upon the car. The more the pint of beer is drank, the more damage to the car. Chilling. Provocative. A success that most ‘Drive Safe’ html5 banners should mirror.
Bacardi Shred The Banner
An amazingly interactive banner here from Bacardi. Including different instrument types (x3), you play the strings using icon roll-over or number press. Loads of fun. Definitely made to be shared and talked about. Good html5 banners should be made to go viral!
Clever use of the pointer icon, as the ad turns it into a sperm cell which you can control. The only catch? You can’t escape the ad as the ‘sperm.’ Each side of the ad acts as the condom. Really does prove the effectiveness of Fromms and their condom. A great example of clean and effective html5 banners.