12 principles of animation: from Disney to modern game projects

Modern animation has many directions, techniques, and applications. But the basic principles of creating live-action images were defined in the last century. Just imagine that the legendary Disney animators summarized all the knowledge about body structure, movement, and reaction to external factors in just 12 rules!

Knowing and applying these principles will not only help you create a beautiful image, but also make the animation lively and attractive to the user. And charismatic characters are one of the keys to the success of games, right?

Let’s take a closer look at these principles!

Principle #1: Squash and Stretch

The shape of objects is the first thing that undergoes inevitable changes in the process of movement. 2D animation is limited in its ability to create volume, but the illusion of volume can be created by deformation. Compression or stretching (depending on the moment of movement) gives the impression of flexibility, authenticity of the character and organicity of his movements.

The intensity of compression and tension depends on many factors:

• animation style (realistic, cartoon, etc.)
• character’s charisma if it is a living animated creature;
• properties of the moving object (if it is an inanimate element);
• the ratio of properties, size, weight of interacting objects;
• requirements for the scene, plot, etc.

With the help of deformation of 2D objects, you can create a realistic scene for a strategy game or, on the contrary, a hypertrophied plot for a battle with damage.

Principle #2: Preparing to move (Anticipation)

Preparatory movement is an important condition for naturalistic animation. In real life, you crouch before jumping, and before throwing a ball, you pull your arm back.

In animation, the preliminary movement prepares the viewer for the main action, but in game animation it plays an even more important role: it warns the player about the actions of the antagonist character, who is not controlled by a person (NPC).

At the same time, preparatory movements pose a serious problem for game animation, since all the preparation for the movement is on the other side of the screen. The player brings his finger to a button or sensor, and the character or object must react to the press instantly.

In first-person game animation, the first principle (stretching and compression) becomes even more important, as it takes on the entire task of realistic motion.

Principle #3: Staging

In first-person game animation, the first principle (stretch and compression) becomes even more important because it takes on the entire task of realistic motion.

In animation, just like in film or theater, the storyline, reactions, and character of the characters are conveyed not only through movement, but also through scene elements, sequences of shots, and even backgrounds.

To keep the viewer or player interested, the animator must make effective use of different views and maintain a continuous storyline.

Character, setting, and background should work as a team, complementing each other and directing the story. To keep the interest, the plot should be dynamic, but the viewer’s attention should not be scattered on a large number of simultaneous actions.

A scene should have one clearly defined main action or image that expresses the main idea or plot. Otherwise, the animation becomes asynchronous, uncomfortable, and cognitively challenging.

Principle #4: Straight ahead and pose to pose animation

There are two ways of animating: straight ahead, from the first drawing (or position) to the last, or from pose to pose, between individual drawn positions.

The first method leaves room for inspiration, because the scene or story is written in its entirety. However, without intermediate reference points, an animator can easily lose the consistency of size, volume, and proportions. It is also very difficult to adjust the timeline (duration) of the scene.

With the position-to-position method, the scene is divided into key moments that keep the proportions of objects and characters constant. This method has the same advantages as skeletal animation: it simplifies the artist’s work and supports the storyline.

In classic 2D pose-to-pose animation, the main animator creates only key and intermediate shots, and the rest is completed by his or her assistants.

In many projects, both methods are used together. The key frames of a scene are written in a planned manner, and side actions are written from the first to the last frame.

Principle #5: Overlapping movements or actions (Follow throught, overlapping action)

For animation to attract the viewer, all movements should be as natural as possible. In real life, body parts (e.g., arms, hair, tail in animals) move with a delay relative to the center of motion (pelvis or body).

Even if you’re creating a fantasy quest, the animation should take into account the physical properties of objects. For example, when a character swings a sword, the motion is first transmitted from the hand to the hilt, and then to the tip. If all the parts move at the same time, the animation will look flat and unprofessional.

The same applies to the character: for example, the character’s cloak, hair, or luggage will continue to move for some time even after he or she stops.

Overlaying movements and deformation of an object is the key to realistic animation.

Principle #6: Slow in and out

When an object starts moving, it accelerates, meaning that its speed at the beginning and in the middle of the action is significantly different. This applies to running, hitting, jumping, and flying. The same is true at the end of the movement: before stopping, the object must slow down.

To achieve this effect, 2D animators use different frame densities in the middle and at the beginning or end of an action.

Interestingly, there may be exceptions to this rule (mechanisms, environmental elements, robots), but most often it is due to the plot and only emphasizes the realism of living characters.

Principle #7: Movement in arcs (Arcs)

Along with overlaying and slowing down actions, arc motion is another way to bring animation to life. Living creatures and even objects (for example, a pendulum) do not move in a straight line, but in an arc.

When a character walks, his head, limbs, and pelvis move in their own arcs. Raising an arm, waving a tail, flying, striking with a weapon in the game are all arc movements.

If animated objects move in arcs, the plot looks more natural and attractive.

Principle #8: Secondary actions

Side actions perform several tasks at once:

• complement the main movement, making it more realistic;
• enrich the entire scene, adding volume to the animation;
• reveal the character’s character;
• emphasize the tension of the plot.

For example, a character makes a swing (the main action), but at the same time squints his eyes a little and clenches his teeth (secondary actions). The reaction of the face and the other hand is a way to emphasize the physical and emotional tension in the scene.

Another classic example is running animation. Following the legs (the main action), the arms, clothes, hair, etc. move. Due to consequential and secondary actions, the scene is perceived as deeper, more elaborate, and interesting.

Principle #9: Time control – Timing

Timing is one of the most important parameters for an animator. How long an action or scene takes determines not only its speed on the screen, but also its realism and effort. A character throws a light tennis ball – fast timing, less time and frames, turns a heavy stone – slow, the action is performed smoothly and with noticeable effort.

You can emphasize the character’s properties (strength, size), character, and mood with the help of the movement frequency.

In some cases, the story uses multiple timing options to emphasize the improvement of skills or the change in the character’s mood. 

Principle #10: Exaggeration

Most of the principles are aimed at bringing animation closer to reality. But the animation world is not limited: to make a character more expressive, we can deform it, use mega-fast timing, change its size and color.

Exaggeration is used in both classic animation and game animation. For example, when you hit an enemy, you can change the shape and size of the enemy, emphasizing the power ratio or special skills of the controlled character.

Principle #11: Clear poses and drawing (Soliddrawing/posing)

Character poses in the story should be clearly readable and convey their character, mood, and intentions. This principle is especially important in games, where the number of storylines and elements is limited by the software.

The animator must correctly determine the center of gravity and distribute the weight across the silhouette, otherwise the movement will look strange and unnatural.

For professional projects, good artistic skills, understanding of perspective, and a sense of form in drawing are desirable.

Principle #12: Appeal

And the cherry on top of the animation art cake is the rule of attractiveness. To attract the attention of a player or viewer, characters must be charismatic. It is not necessary to use only canonical beauties and protagonists for the plot. Negative characters with obvious flaws can also be charismatic and interesting.

You can make the viewer interested with the help of backstory, behavior, and even movement style. Attractive characters stick in the memory, make you empathize and want to be like them.

To endow a character with attractive features, animators often resort to imitating real people (actors, dancers) or animals (mostly cats because of their special movement patterns).

The principle of attractiveness applies not only to the main characters, but also to the environment.

The practical skills that we will cover in the Spine Animation Course will help you to clearly understand