IDEA

Need to show the pouring animation from the TV ad in a banner.

CHALLENGES

The video is only 4 seconds long but the banner needs to work on mobile devices so it can't be simply dropped in as a video as it won't auto play.

SOLUTION

Take the video into AfterFX and convert the animation into an image sequence at the correct size. Take this image sequence and convert it to a sprite sheet to use in the banner with the aid of Canvas and Easel JS to control the speed and playback.

TECHNOLOGIES USED

AfterFX, HTML5, Javascript, EaselJS, GSAP, CSS

CLICK HERE to view live version of this project