Principles of design and animation, part 5: Movement
William Marler gravatar avitar

Principles of design and animation, part 5: Movement

Author: William Marler | Posted on: 16 February 2017

Up to this point, all of the principles I’ve shared have been for static objects. That’s great for design but won’t get you too far in animation. The separation between design and animation is movement. This time, we’ll look at some basic movements and the meanings they convey, and also explore a couple of the 12 Principles of Animation, set out by Disney greats Frank Thomas and Ollie Johnston.

The direction of movement carries different meanings

Moving upwards has the same effect on an object as increasing in size; it represents more. However, it also has a relationship with space – making an upwards movement is akin to flying, and a downwards movement to falling.

Left to right movement can show progression towards a goal or the advancement of time. The start of something is usually on the left, and the end on the right. Another movement that indicates time is clockwise movement; all loading animations move clockwise because of its inherent link with time.

Meaning is created when objects move towards or away from each other

Objects can move inwards or outwards. An inwards movement of an object can show it entering another, or being attracted to it. Likewise, an outwards movement usually represents an exit or an explosion.

In their 1981 book The Illusion of Life, Disney animators Frank Thomas and Ollie Johnston set out 12 Principles of Animation that allow objects or characters to look more realistic and their movement more appealing. Although originally designed for classical hand-drawn animation, they are still prevalent in all animation formats.

A demonstration of squash and stretch

The first and most famous is Squash and Stretch. The distortion of an object as it moves gives it a sense of weight and flexibility. The most common demonstration of this is a bouncing ball; use of squash and stretch can make a ball look like it’s made from rubber, and lack of any distortion can give it a very solid appearance. If applied to a character, the effect can give the character more personality, emphasising their movement.

This shows the anticipation before the movement

Another principle is anticipation. Anticipation provides clues as to what is coming next, such as a character leaning backward before sprinting off into the distance. It makes the subsequent action look more believable and not so sudden. The technique can be used before other events, such as a character looking off screen at something or someone that is then shown.

Shape, size, space, and colour can create some very powerful meanings. By adding movement, especially if you anthropomorphise objects, you can tell a much richer story. Next time, we’ll show the different ways that these five principles can be combined to create complex meaning in a really simple manner.

In case you missed them, here are the other principles of animation and design:

Part 1 - Shape

Part 2 - Size

Part 3 - Space

Part 4 - Colour

Combining the 5 principles of design and animation  


Author: William Marler

William Marler gravatar avitar
William is the Animation Lead at Ember Television. He graduated from Birmingham City University in 2016 with first class honours. In that time, he had already completed work for prestigious clients including the BRIT Awards and Fujifilm, and was selected by Adobe as part of their student showcase.
Principles of design and animation, part 5: Movement

Blog

...

Football.London: Giving your new brand a voice to suit its audience

A recap on our video project for Football.London, a new football website with a very discerning audience. We had to deliver a distinctive voice to match.

...

5 quick tips to smarten up your online profile today

Follow these basic steps to ensure your online profile leaves a good impression on your clients and prospects, every time.

...

Answering your client's questions: An example

Inspired by Marcus Sheridan's book, 'They Ask, You Answer', we've produced a new video series called Adviser Content Clinic.

...

Are you answering questions?

The story of how content marketing turned a business on the verge of bankruptcy into a market leader, and what we can learn.