12 principles of animation in the development of video games
While video games were still in the Pac-Man era , Disney animators Frank Thomas and Ollie Johnson listed in their 1981 book, The Illusion of Life: Disney Animation, what are now considered the basic rules of animation — 12 basic principles.
- Squash & Stretch
- Stage Performance (Staging)
- Using layouts and direct phased movement (Straight ahead & pose to pose)
- Through-movement (or refinement) and overflow of action (Follow-through & overlapping action)
- Softening the start and end of movement (Slow in & slow out)
- Additional action (Secondary action)
- Attractiveness (Appeal)
- Exaggeration, exaggeration (Exaggeration)
- Professional drawing (Solid drawing)
Despite the fact that these fundamental principles were invented even before the spread of computer graphics and were intended exclusively for hand-drawn two-dimensional animations, they ideally suited to 3D-graphics. Although the connection of some of them with the interactive environment is not entirely obvious, a little rethinking helps to reveal their lasting value.
Understanding these basics of animation is necessary, so you need to re-explore them through the lens of video game animations.
Principle 1: compression and tension
This is a technique for compressing and stretching elements of a character or object (for example, a jumping ball), which allows you to exaggerate the movement in the right direction.
For example, a character jumping up can be stretched vertically in the fast phase of the jump to emphasize verticality, but is compressed at the top of the jump arc and when touching the ground. Ideally, the total volume of the object should be maintained, that is, if the ball is stretched vertically, then it should be compressed horizontally accordingly.
Many video game engines, due to excessive waste of memory and the relatively rare occurrence of “cartoon” games, do not support scaling bones if it is not specified explicitly (saving position, rotation and scale is more expensive). However, this principle is important even when creating postures of non-deformable rigs, because the theory of stretching and squeezing the character’s poses comes into play when performing quick actions, even if this does not involve real scaling: the characters stretch their limbs, emphasizing stretched poses, for example, at the beginning of the jump and at the time of landing.
Squeezing and stretching was the key visual motif of the Jak & Daxter series of games.
Principle 2: Stage Performance
This principle is directly applicable only to the linear parts of the game, for example, to cinematic inserts where the camera and / or character is controlled by the animator and not the player. Stage design is the principle of presenting “the idea in such a way that it is completely and accurately understandable”.
This requires working with a camera, lighting, or character composition. The viewer's attention should be drawn to important parts of this scene; In doing so, unnecessary details and distractions should be avoided.
Limited by the doorway, the player in Gears of War knocks the door and encounters this grim picture.
However, stage design is important for the gameplay. It is used in level design, when a certain structure allows you to make the player move along the corridor or climb the hill to find gameplay elements located there; in addition, you can use lighting to attract the attention of the player. The animator can think through the design in order to optimally arrange the scenes in the player’s field of vision using similar techniques, rather than constantly using inserts where the player cannot control the camera or characters.
Principle 3: preparation, or preemption
Anticipation is used to prepare a player for action, for example, he can crouch before a jump or swing his hand before a blow. It exists in the real world: before jumping, a person must bend his knees in order to gain enough energy to lift himself off the ground, so this principle is used in animation in a similar way. It allows you to display the transfer of energy of the action, which the action itself is not able to reflect.
In video games, anticipation is an ambiguous element: designers often strive to get by with a minimum, and animators try to create as many frames as possible. If there are too few frames, then the desired action, for example, a blow with a hand or a swing of a sword, gets too little weight (and this is a key component of feedback for the player, it is needed not only for aesthetics). If there are too many frames, then the movement will seem unresponsive, reducing the sense of direct control of the character. Ultimately, it all depends on the objectives of the project and the value of the realistic weight of the character’s actions, but there are other ways to transmit feedback, which we will discuss below.
From a design point of view, it is advisable to make the NPC actions and attacks (called telegraphing) longer, because it tells the player that he must block the attack or dodge it. The player is not very interested in guessing what the enemy can do after a short lead, therefore, the ability to read his attention is very important for creating high-quality gameplay. The actions of both the player and the NPC usually have a balance: a long lead is preceded by a greater effect (increased damage), and vice versa. In this way, the “risk to reward ratio” situation is realized: actions with a long lead lead to increase the player’s vulnerability, but at the same time increase the potential damage done.
Principle 4: Using Layouts and Direct Phased Motion
These two techniques relate solely to the process of creating an animation and describe the difference between continuous work on frames (starting from frame 1 onwards) and adding only key positions (this is called blocking) to quickly create the first pass with its further development. This also applies more to linear animation (and especially to 2D, where volume preservation was an important element of the art of animation) and essentially describes two philosophical approaches.
In computer animation, there is no need for the first approach, and the realities of production practically require you to do work in several passes with a gradual improvement in quality. Therefore, for most game animations, the preferred method is to move from pose to pose. This is mainly due to the fact that there is a high probability of changing or even cutting out animations in the process of creating a design. Key gameplay animations constantly require iterations, and working with rough key animations is much easier than with fully prepared animations, not to mention wasted time.
Rough creation of key poses is the recommended way to create gameplay animations.
Therefore, it is important not to work out the animation too carefully and maintain it as long as possible from posture to posture, in order not only to avoid wasting time, but also to allow the animator to create maximum the number of versions of animations - in the end, a lot of animations flowing into each other create a better and smoother character than one, albeit a beautiful animation.
But all this does not apply if motion-capture is used, in which the animator essentially first receives intermediate movements, and then adds key poses, and then changes the timings of the animation. A detailed analysis of this process is described in other chapters of the book.
Principle 5: lateral movement (or refinement) and overwhelming action
Traffic congestion takes into account the property of movement of different parts of the character with different frequencies. During a punch, the head and body control the action, and the bent arm moves back, after which it is pulled forward, performing a punch. Beginner animators often make one mistake: all elements of the character start or end the movement at one moment, which looks unnatural and draws attention to clearly distinguishable key frames.
The debugging describes what happens after the action (it is the opposite of lead). It can relate to actions such as landing after a jump or raising a heavy sword or ax from the ground onto the character’s shoulder. It also includes the movement of secondary elements: clothing or hair, "catching up" the main action. Lapping is a great way to transfer the weight of an object or character, and holding strong postures in this phase of actions helps the player to read actions better than the first quick movements. The refinement is less limited by the gameplay than the lead, because the action has already been completed, however, too long a refinement before returning control to the player can also lead to a feeling of the character being unresponsive.
To maintain responsiveness, the animator must be able to control the moment when the player can perform a refinement action by specifying a frame in which the player returns control until the animation is completed. In this case, if there is no player input, the debugging will be performed completely. In game engines, such a function is absent, which forces animators to complete actions earlier than desired to maintain responsiveness. However, they lose an important tool from the set of game animator, which allows you to create high-quality and beautiful characters.
The concept of “delay” is connected with the principle of refinement and overwhelming of action, which allows freer objects and softer parts (hair, weak limbs) to lag behind the main character mass, transferring the weight of one object or body part relative to another. Lapping, trapping movements and the delay of non-animated objects (for example, raincoats or large bellies) can be created procedurally in the game engine using real-time rigging that allows these elements to move in accordance with physics. Adding such rigging elements, especially if they visually change or enhance the character’s silhouette, is an amazing way to improve the character’s quality with a little effort, including because their movement will continue in the next animation performed by the player.
Principle 6: mitigating the start and end of movement
This principle describes the visual result of the acceleration and deceleration of moving elements: in the general case, actions usually have slow movement at the beginning and end, and this is often caused by the weight of the object or character.
This principle can be shown by the example of a sphere moving at a given distance. With a uniform / linear motion, the sphere will travel the same distance in each frame, and the softening of the beginning and end will be gradually closer to the beginning and end as the speed of the sphere increases and decreases.
It is also important that not all objects need to mitigate the beginning and end of movement, but this is a good concept that needs to be mastered. For example, a stone rolling off a cliff first moves slowly, then picks up speed when falling, but ends with an instant stop when it falls in the sand. If we animated this process, the stone had a soft start and a sharp end with a sharp straight section of the path at the end. A cannonball that flew high from the cannon into the air would have a sharp start and a slow (but still fast) end caused by air resistance.
Despite the same number of frames, the upper sphere moves uniformly, and the lower one moves slower at the beginning and end, accelerating in the middle.
Objects that instantly gain full speed can look weightless and unrealistic, so here again the conflict manifests itself between the gameplay desire to give players an instant response and the artistic desire to give the character weight. Instantly swinging the sword may seem easy, so the task of the animator is to add this weight at the end of the debugging, giving the action a quick start, but slow completion, when the character and the sword return to the waiting state.
The cannonball creates a fast / slow trajectory along different axes.
In the example of the cannonball, the sense of weight can be displayed by animating the refinement of the cannon itself (its recoil), much like the animators often exaggerate the recoil of the gun to show its relative power and damage, while maintaining instant response and feedback when firing.
Principle 7: Arc
Most actions when moving an object or character naturally move along an arc: for example, arms and legs swing when walking. Parts of the body that deviate from the natural curve will be seen by the eye and seem unnatural, so arcs are a great way to achieve quality and correct action. The main part of cleaning motion capture is to eliminate the most noticeable deviations from arcs that naturally occur when a person moves, but that seem too noticeable and “wrong” when repeated in a video game.
However, if during the animation of each element of the character all its parts follow distinct arcs, then this may look too lightweight or unsteady, because the look has nothing to catch on. As in the case of overrides, you need to know when to destroy a smooth arc to add another level of detail that enhances the realism of the animation.
Principle 8: Additional Action
Additional actions are used to complement and emphasize the main action of the character, add to the basic action of details and visual appeal. Although due to the brevity of many game animations, it’s difficult to add a few actions to them (additional actions should reinforce rather than blur the main action), it is such small details that can turn a good animation into an excellent one.
Examples of additional actions include facial expressions that accompany animations of battle or damage, or slow reactions that are reproduced during long runs. The technologies described in other parts of the book, for example, additive and partial animations, allow you to combine animations with basic actions to provide the possibility of longer additional movements than are necessary to control the player.
Principle 9: Attractiveness
Attractiveness should be the main goal of every animator animating a character, but it is difficult to explain in words. This is the difference between an animated face conveying a real feeling and one that looks scary and creepy. This is the sum of all the skills of the animator, able to convey the power of combat and movement, which should be perceived as weak. This is the plausibility of the character’s actions compared to unrealism and automatism.
Attractiveness is a magical element that makes players believe in the character with whom they interact, regardless of the style in which it is performed. In addition, do not confuse attractiveness with beauty, because even the player’s enemies should look aesthetically pleasing and demonstrate attractiveness. This is the task of character design, and the manipulation of the animator. Proportions and color schemes are the first stages of this multi-stage creation process, which seeks to make character animation as attractive as possible. The simplicity of the visual design and poses created by the animator contribute to the readability of the movement, and clear silhouettes allow you to distinguish the characters from each other.
Principle 10: timing
Timing (timings) is the most important element of the animation “feeling” and is usually used to transfer the weight of a character or object. Time is inextricably linked with speed: the distance or angle of rotation traveled by an object or limb per unit of time gives the viewer a sense of weight or power of movement.
In 3D animation, this is best explained by simple math:
time = distance / speed, therefore speed = distance / time
That is why, in all editors of animation curves on the axes, distance and time are laid off as the main parameters that visualize the speed of the performed manipulations. If we move an object 10 meters in 2 seconds, then this is faster than moving in 5 seconds. Similarly, a character’s pose, squeezed and then extended, creates a faster hit with two frames than with five.
Along with softening the beginning and end of movement, time calculation ensures that the object or character is subject to the laws of physics. The faster the movement, the less weight, and vice versa. This brings us back to the animator's dilemma: how to ensure responsive gameplay while maintaining weight. If the character instantly reaches maximum speed as soon as the player presses the joystick, then without the correct visual feedback, he will appear weightless.
The slow movement of the colossus in Shadow of the Colossus is matched with the deft climb of the protagonist.
Moreover, the correct timing of reactions gives individual movements time to turn around, for example, holding a pose after swinging a sword and before the next one so that the player sees him; the delay in the next movement of the character in the cinematic moment can illustrate the thought process.
Principle 11: exaggeration, exaggeration
The real world never looks real enough. If you observe how a real person performs an action, for example, jumps from a height and lands on the floor, and then accurately copy it into his animation, then it will look slow and aesthetically imperfect. Real movements do not follow perfect arcs and do not create attractive or powerful silhouettes.
In animation, we strive to create something hyper-realistic, more perfect representation of what exists in the real world. In games, we especially often have to create actions that look good from all angles, and not just in terms of a fixed camera. That poet is one of the best tools of the animator is an exaggeration of reality. The animator must re-interpret the movements in a "hyper-realistic" way so that the poses are expressed and sustained a little longer than in reality.
If you completely obey the laws of physics, then the bouncing ball when it reaches the most correct point and falls to the ground creates a smooth parabola. However, the animator may decide to hold the ball slightly at the top point (creating a lead in the process), similar to how a martial artist character hangs in the air and then strives down with a jump shot.
Similarly, a boxer in the real world can knock an opponent with an uppercut, knocking him to the ground, but the animator can lift an opponent into the air to make the movement more compelling and readable by the player. Giving actions credibility with their “addition” is an excellent technique that allows the player to understand what is happening, especially if the camera is far from the scene.
Great exaggeration of the facial expressions from the game Cuphead.
You need to be careful and maintain the same level of exaggeration for the entire project, and usually this is the task of the lead animator or animation director, because the level of exaggeration is a stylistic choice, and its inconsistency in different animations will be striking and seem unattractive when passing the game.
Principle 12: professional drawing
Although at first this does not seem so important in the era of 3D animations, you need to remember that drawing is an important way to transfer information between team members, and almost every day you have to use sketches to explain problems or find solutions. All the best animators can draw to such an extent that they can provide support or indicate the direction of development, and this skill is especially useful in the early stages of working on a character, it allows you to show the pros and cons of individual visual elements.
Be that as it may, professionalism was very important in the era of 2D animation and allowed us to convey the volume of characters moving and turning on the page. Therefore, much attention was paid to the skills of the animator in drawing and the ability to visualize the character in three dimensions when transferred to a two-dimensional page. Although today we no longer work with pages, understanding the volume and three-dimensionality is still important for the animator when animating a character in 3D. It helps in creating poses and understanding the limits and work of a body mechanic.
The principle of “professional drawing” can be interpreted as a professional understanding of the mechanic of the body. This topic includes everything from understanding the center of mass and balance to the chain of reactions along the limb or spine when the foot touches the floor. Understanding body movement is the basic skill of a good game animator, and the need to know how a character will look from any angle does not allow him to cheat.
This article is a fragment of the third chapter of the book "Game Anim: Video Game Animation Explained" by the famous game animator Jonathan Cooper.
It was published in January and can be purchased directly from the publisher of CRC Press .