keyline2.jpg

Part 2. of my article on creating a unique website in Flash, the interactivity and animation portion.

keyline2.jpg

 

Daddy Yankee - El Cartel - The Big Boss

daddyyankee.com // Elastic People

keyline2.jpg

ANIMATION TIPS

keyline2.jpg

1. Animate all reveals and transitions to a tempo and in a direction that leads the eye.
All great painters use composition to lead their viewers around their work. You have the added benefit of using animation to accomplish this.

keyline2.jpg

2. Break graphics down into small parts and animate them individually to build the bigger graphics.
Quite simply this is the coolest way you can animate a reveal, by constructing or de-constructing it. Animate everything that’s not attached to something.

keyline2.jpg

3. Create portions of your animation in After Effects.
This allows you to stream FLV’s lowering loading time while giving the site a broadcast feel. Use plug-ins to create organic animation that’s not possible in flash.

keyline2.jpg

4. Use 3d to give unexpected movement.
This is Flash people use it. If you want to create impressive interactive Flash content incorporate 3d, it’s not so much for how it looks when the page is static but for when it’s moving, nothing gets a ‘wow’ effect like a graphic element that rotates, blurs and scales realistically.

keyline2.jpg

5. Try to make some animated element unique to each sub-page.
Could be something subtle in the background… this small effort will reward your user with something fresh to appreciate with each page and encourage them to keep clicking.

keyline2.jpg

Additional animation notes:

  • If you’re on a time constraint put 99% of your effort into the loader, the home-page build and the interaction of the navigation… those are the “money-shots”.
  • Ask your creative director to take you to the photo-shoot for the project, bring a portable green screen and a video camera and try to capture some footage of each scene after the photographers done his thing. This footage will be gold.
  • Integrate video wherever possible. The bigger the better.
  • Use a tweening class to script your animation.

keyline2.jpg