He & Romain spent some time last year studying the excellent book The Illusion of Life about Disney Animation by a couple of the masters of animation. The book discusses 12 rules of animation. They extracted a few principles from the book that apply directly to animating user experiences and shared them in the talk Animation Rules! they gave last year at Devoxx in Belgium.
They also mention Timing for Animation, another book I have on my shelf.
Some of the takeaways from the rules of animation:
- Squash & Stretch. Lifelike objects deform in reaction to gravity & collision
- Anticipation. Short actions just before the main one. Give hints to the user about what will or may happen.
- Staging. Clearly communicate to the audience what is happening (poses, camera views, lighting, focus). Emphasize the important elements. Avoid too much noise.
- Follow through, overlapping action. Realistic body physics. We are not rigid bodies.
- Using Slow in & out.
- Using Arcs in motion.
- Secondary actions. Actions which emphasize or complement the main.
- Timing. Careful timing of actions for realism, impact & effect.
- Exaggeration. Making actions more lively, more obvious, more entertaining.
- Solid drawing. Drawing has to be solid before you can animate well.
- Appeal. Believable, appealing characters that the audience can enjoy.
Chet & Romain's Proposed Rules for GUI Animation:
- Timed: Fast, realistic & appropriate
- Designed: Use animations for good, not evil
- Smooth: Don't make your users hate animations
- Transitioning: Bring the users along
- Realistic: Motion, timing, interactions.
- Anticipatory: Hint what may happen
- Simple: Help the user, don't confuse them.
