NUFU AGENCY

SWR Trains Christmas Campaign

MOTION
CODE

NuFu asked Proper Banners to create Standard HTML5 Ads for SWR’s 2018 Christmas campaign. The storyboard provided with vector assets, and had details that needed special animation.

Animation Routes

Using a mix of HTML5 animation with PNG sprites created in After Effects, we added life to the scenes, and perfected the transitions.


Check the animations below:

CREATIVE PRODUCTION

Mixing code and sprites due to file-size 

 

The challange was to create Standard HTML5 150kb banners with enhanced animation, using a mix of JPGs, PNGs and PNG sequences, and animating everything in code. 

 

A full HTML5 Banner suite

Beach Route
The lighthouse animation gives a 2.5D animation quality to the banners.

 

Using After Effects to create it and exported as png sequences, it was then controlled via our custom Javascript function.

 

Countryside Route

We added some tiny movements to the donkeys eating grass in After Effects. The little dectails can make a big difference, specially when file size is an issue.

London Route
All animations on this route were hand-coded in Javascript, including the wheel and the guards. Using light-weight images and controlling these with code allow us to create enhance Standard HTML5 banners. c

DEVIL MAY CRYFull Digital Campaign

COLURICreative and Production

PROJECT CARS 3Display Ads Campaign

POKEMON TRADING CARDSSocial Media Ads

FIDELITYAnimated Infographic Videos

POKER STARSHTML5 Campaign

SWRHTML5 Campaign

VIRGIN MEDIADigital Campaign

SAINSBURY’SHTML5 Ads

NETFLIXHTML5 Ads

FSI INVESTMENTHTML5 Ads

HONDAHTML5 Ads

JP MORGANHTML5 Ads

TESCO MOBILEHTML5 Ads

OLD EL PASODigital Campaign

VASELINEHTML5 Ads

MAGIC FMDigital Campaign

TESCO AND SAMSUNGSocial Media Videos

BAYWATCH FILMSocial Media Videos

ALWAYS AVAILABLE

Get in touch and tell us about your project.