Animation for games is not too different from animations for movies, cartoons or even anime! This is good because it means many techniques and skills learned to make animations can be used in other types of animated media.
There are two major types of animation used in games which are 2D and 3D animation. 3D animation is a newer type of art form that has existed for a few years now that uses 3D objects. The barrier for entry is definitely higher for 3D animation although it’s gotten much more accessible in the more recent years.
All that aside this post is all about 2D animation. Let’s first talk about how are animations used in games.
Mario through the ages:
From the NES and the SNES. The SNES was able to use more colors than the NES.
Sprites
Sprites are static images made for games, whether characters, backgrounds or even in-game text, these images are called sprites. Depending on the capabilities of the hardware, the size and complexity of the colors that can be used varies. Older video game consoles such as the Nintendo Entertainment System (NES) could only support 8×8 pixel-sized sprites, this is where the term 8-bit comes from. On top of the small sprite size, original games on the NES could only support 54 total colors and only 3 colors per sprite!
54 colors of the NES color palette.
Over time the next iterations of game consoles became less and less restricted, doubling then tripling the size of the useable sprites, allowing dozens then hundreds of more colors. Today video game hardware has become much more sophisticated, now the only limitation is our imagination.
So how do we make sprites?
There are a handful of programs dedicated to creating sprites out there though many of them are good most lack tools to do much more than just sprites.
A good tool to for making sprites and other types of animations is Adobe Photoshop. Photoshop allows you to create sprite outlines, color, shadows and edit them with ease. Let’s check out the basics!
The canvas is the area in which we can draw our sprite. We will be using a canvas size of 32×32 4 times the size of NES, 32×32 is a good size for readability but also charming in its simplicity. We will ignore the color restrictions for our monster.
I decided I want to make a cute chicken monster that the player might encounter early in the game. I wanted to make a chick but one who is growing up, so he’s wearing sneakers!
Outline
He looks a bit like ghost!
Don’t get discouraged early on if your initial design looks off.
Flat colors
With base colors, he looks better but still incomplete.
Next, add some shading to help with readability. The sun is in the top right of the image so let’s add shadows accordingly.
Shading
We added some shadows but it’s a little boring so we will use a cool technique that will give the chicken a nice effect.
Outline Shading
Now we added different shading on the outlines of the chicken that mimics the light source of the picture. The one important thing missing from this animation is the animation!
Idle animation
Most characters and monsters have an idle animation, a simple animation of the character moving slightly to show the player that the character is living and interactable.
Animation workflow
From outline to Idle
What’s Next?
Congratulations we just made our first monster for our game, next let’s make a world for the chicken to live in or maybe color variations?
for more information or comments please feel free to contact us at
