Blog

Women in Tech Talk: The 12 Principles of Animation

Mair Perkins speaking about animation at Women in Tech Nottingham

In February 2017 I was invited to talk at Nottingham’s Women In Tech event which is a monthly meetup for women from all area’s of technology and those with an emerging interest in technology.

The organiser, Helen Clark, asked me if I could repeat the talk I gave at Design Swansea in March 2016. That talk was mostly about my career and turning a hobby into a job so I put together a new talk more suitable for a tech event.

Mair Perkins speaking about animation at Women in Tech Nottingham

Animation is the most technical subject I have knowledge in so decided I’d talk about the 12 principles of traditional animation and how they can be applied to digital animation. I primarily animate with the software Adobe After Effects (AE) and most animation in AE is produced using “tweening”. Tweening is the digital process of an animator creating the keyframes and a computer generating the inbetween frames. This differs to traditional drawn animation which required the animator to create a series of images with one filling each frame of animation. This classic technique is called frame by frame or cel animation.

Tweening saves time and lowers the production costs of animation and makes animation production more accessible to independent animators like myself. However tweened animation is often criticised for creating, stiff, mechanical, unconvincing motion. Some express concern that it is replacing the craft and skill of traditional hand drawn animation. I see tweening as a tool to help independent animators and small studios. Convincing motion can be made with tweening if the keyframes and interpolation between the keyframes are controlled by the animators, rather than being left for the computer to automatically generate.

Though there are some kinds of 2D animation (morphing, objects turning, changing angles or specific styles) that need to be done with the classic frame by frame or cel animation technique. When this technique is needed, I use a mixture Adobe Photoshop and After Effects. Below are some examples of my cel animations.

Cel Corpse Animation Mair Perkins  bird animation over video - thumbnail (2)

The 12 principles are listed below.

  • 1  Squash and Stretch
  • 2  Anticipation
  • 3  Staging
  • 4  Straight Ahead Action and Pose to Pose
  • 5  Follow Through and Overlapping Action
  • 6  Slow In and Slow Out
  • 7  Arc
  • 8  Secondary Action
  • 9  Timing
  • 10  Exaggeration
  • 11  Solid drawing
  • 12  Appeal

If you are interested in learning more, this great article covers them.

The majority of my 30 minute talk was explaining each principle with examples. I created some little animations to show how the principles can be applied to tweened animation in After Effects.

A ball moving up and down. The shape and volume doesn't change as it bounces.
A ball moving up and down. The shape and volume doesn’t change as it bounces.
With squash and stretch
The same ball but it squashes when it hits the floor and stretches when it bounces up. This gives the illusion of weight and volume. Based on principle 1 “Squash and Stretch”.
Linear movement. No speeding up or slowing down.
Eased movement with speed variation. Based on principle 6  “Slow In and Slow Out”.
A pendulum swinging back forth with basic linear rotation keyframes.
A pendulum swinging back forth with basic linear rotation keyframes.
The same pendulum with principle 5 "Follow Through and Overlapping Action" applied.
The same pendulum with principle 5 “Follow Through and Overlapping Action” applied.
A triangle sliding along in a linear fashion.
A triangle sliding along in a linear fashion.
The same triangle but with principle 2 anticipation applied.
The same triangle but with principle 2 “Anticipation” applied.
Principle 7 - arc. Most motion paths are curved. Like the ball in this example.
Principle 7 – “Arc“. Most motion paths are curved. Like the trajectory of the ball in this example.

A huge thanks has to go to School of Motion – they are my animation gurus and introduced me to the application of classic animation principles to After Effects animation. The books below by classic animators need to be credited for their wealth of knowledge. They’re considered holy scripture in the animation communities!

The Illusion of Life: Disney Animation by Frank Thomas
The Illusion of Life: Disney Animation by Frank Thomas
The Animator’s Survival Kit by Richard E. Williams
The Animator’s Survival Kit by Richard E. Williams
Mair Perkins speaking about animation at Women in Tech Nottingham