Animating for Videogames
At this point you’ve animated a few different forms of animation. The skills you’ve learnt here will be important when it comes to your game project later on in the year, where you will animate the various visual assets. Watch through the video below and take notes to answer the following questions.
How 2D Fighter Games are Animated
List the six key techniques recommended for creating stylish animations, along with descriptions for what each one means.
Technique | Description |
Keyframing | It is the process of drawing the most important frames of an action, where the extreme poses are drawn, to signify the most impactful shots of the animation. Then in betweens are drawn to connect, and make it more cohesive. |
Anticipation | It’s the frame(s) to signify an oncoming action. So that the character or object doesn’t feel weak or sudden with no anticipation within the audience to see that the attack was about to come. |
Follow Through | The principle which says that not all parts of the body or object stop at the same time when a main action is happening. For example, when a person is running/sprinting, then stops. Their hair, loose clothes, etc. may move for a while. This shows the weight of the objects to give a sense of depth. |
Smears | A technique in which the illusion of fast motion is created in a frame of short repetition of frames. Instead of drawing the object in its normal state or stage, the animator stretches, distorts, or even duplicates to create a blur effect. This mimics real life in how our eyes would perceive motion blurs. |
Overshooting | The action, character or even object “overshooting”, which is going past its intended position, or pose before settling into the end point of an animation. This gives life and energy to the movement to make it feel natural, as if no overshooting happens, it might feel like they are robotic. Like a character looking over to his right, his head bounces a bit, before resting to the original state. Exaggeration can be applied here as well. |
Breaking/Exaggeration | It's amplifying or enhancing certain proportions, features, or even actions. In order to give a more expressive or humorous visual impact. This can be applied to anything, like shape, size, speed, emotions, and sometimes even colours. Like when a character is charging up their punch, they would pull back a bit, have their arm squeeze and crush to be small, then an explosive punch that's twice the size. |
Which of these techniques are from the 12 principles of animation we previously studied?
Anticipation, Follow Through and Breaking/Exaggeration |
What is the key benefit from applying smears (or smear frames) to an animation?
It shortens down the animation to small chunks of a frame or couple of frames, while still showcasing the fast movement of the action or scene. Saves time basically(most of the time). |
What is the difference between smears and multiples?
Smears is blurring and stretching the action, while multiples is having multiple copies of the pose, like a weapon, arm, or clothing item that repeats and mimics a “shutter” effect from that would be from a camera. |
When animating a character throwing a punch, which part(s) of the character could you apply follow through to?
I would have the clothing, or hair follow through. Like if he was wearing a bandana, I would draw and animate it still flowing for a couple of frames, then whiplash on his head, or go down quickly. |
Analyse the following sprite sheet - Which techniques are used here? Specifically refer to the individual sprite by number and describe how the technique has been applied, as well as what effect it has.
Is there anything you would alter to change the look of the animation? Which technique could you apply to make the animation more effective?
Follow through is used, as the lock/straps on the backpack of the character is bouncing up and down from the character’s walking motion. The hair is also doing the same thing, the pony tail and a bit of the ‘fringe’. Exaggeration is used sparsely. It isn’t very noticeable, and barely seen. It's in 16 bit sprite art, so it wouldn’t generally be noticed, but it would be felt. The legs are exaggerated a bit, in the 4th frame, the character’s left leg smooshes up a bit, then proceeds to extend back to normal. I would cut down the animation down to 4 or 5 frames, remove the 3rd frame, and have the hands and legs smear a bit. This would mostly keep the original spirit of the walk cycle, but she would look more like jogging, than ‘speed-walking’. |