Recently I’ve read this great article “Tips for Animating Photos” by Abel Buko of Bannerboy.com that talks about ideas on how one can add depth by animating objects in a single photo by way of creating layers.
Animated ads are the bees knees. They look slick and are more memorable (there are studies to back this up). Because video should only be used in native environments and is often too heavy otherwise, animating images in HTML5 is the name of our game.
The thing to remember is not all photographs lend equally well to animation. Here are some tips provided by Bannerboy’s Animation Director, Artur Kalinowski, to keep in mind when picking out photos for your ads.
Artur’s Tips for Animating Photos
The best way to animate photos is moving isolated elements in slow motion. This has a bold, dynamic, and sometimes playful feel. It also marks the line between cheapy template stuff and premium cinematic quality.
So what makes some photographs better than others? Look for photos that have:
- elements that are clearly separated, i.e. easily cut out.
- at least two distinct planes, i.e. have some depth of field.
- elements that logically can move (err duh).
main elements that are centered or attached to the side of the frame.
Check out some samples below where we’ve started with a single photograph, or search The Brain for keyword “animation from static” to see more!