Art Direction, Design, Animation, Build of Rich Media Banners

JP MORGAN

Fundamentals

Winter 2016

Fundamentals needed to transform two print ads into motion banners. The print banners were – static, and it soon became certain that a lot of work would be involved.

Tasks:

  • Digital Concepts
  • Creative Tech
  • Animation
  • Video
  • Visual Effects
  • Support

->

The Ice Text

Ice

The main assets was a huge grid of ice cubes. By cropping each, I guaranteed uniqueness to all. By setting up the photoshop file nicely, it was really easy to start animating in After Effects.

The row and the reflection were made in AfterEffects. But I needed individual cubes to give them a bit of random movement like they were bumping.



Water Splash

This was a big challenge. I needed a water splash stock video that I could work with. So I did a few tests with stills, cropping them on photoshop until I found one that i knew it would work, but would take a lot of it.

The video is beautifully shot and has a few splashes for uniqueness, and furthermore, was shot in 100fps, so a lot of frames. The problem was the background. Too similar to the – transparent water. So I had to take advantage of Rotoscoping tools, and basically retouched all frames one by one.

To create a “transparent” effect I used some blending modes and alpha mask, and added a few extra drops to the text.

The Ads

The two videos were basically the banner, and all I needed was to test it on doubleclick. Later some issues appeared since I was using the duration of the video as a parameter on the code. This wasn’t working in IE so new strategy was needed. Since the animations had fixed duration always, a timer was set and problem solved.

All the adapts would be produced by other company, so all animation needed to be easily reused so a lot of file organisation was needed.