Creating Animated Sprites

What is Sprite Animation in Multimedia?

Sprites are two-dimensional bitmap graphics found in some games and other media. If you've ever played 2D games like Final Fantasy VI, Chrono Trigger, or the recent game Octopath Traveler, you're already familiar with sprites in games.

Creating and animating sprites allows artists and game developers to control characters and objects independently of the overall scene.

Sprites can be static or animated, depending on their role in a larger scene or project. Game consoles such as the Commodore 64, Nintendo Famicom, and Atari became iconic due to innovative game design using only 2D sprite animation.

With such a colorful history, how can you get involved in the creative process?

Sprite Animation

Let's go over some basics of sprite animation.

How to Animate a Sprite?

Sprite animation is one of the simplest forms of virtual art, but chances are you won't get it right on the first try.

To get started, we recommend you grab some sprite sheets or create your own sprite. Do you have an original character you've been wanting to animate? Now's the time!

A sprite sheet is a sketch of all the actions you want your character to perform. If the character is running, you need to animate sprites performing each movement in a single frame.

The sheet shows everything, and the sprite creator chooses which action to render.

The Heart of Every Sprite Sheet

Cycles and frames are the two main elements that make up every sprite sheet. What you see in a sprite sheet is a bunch of frames aligned and ready for animation. When someone finally uses the magic of animation in their creations, these frames become cycles.

Frame cycles are what make sprite animation what it is.

In the game The Legend of Zelda: A Link to the Past, images of Link holding a sword in different positions are frames, and the action of him swinging the sword is a cycle of all those frames together.

Now that we know a bit more about what sprite sheets are, let's look at how we move from one frame to another in sprite animation.

Slicing Sprite Sheets

If you want to significantly reduce a sprite sheet to split the images, it's quite simple to do. This is ideal for creating small GIFs. There are many methods and tools for cutting an image by tile size or by number of columns and rows.

A great resource is the online sprite sheet cutter at EZGif.com. It also allows you to break down and decompile sprite sheets.

Coding Sprite Sheet Animation

Which command shows the animation for a sprite?
The 'Next' command. Simply enter the 'next' command with what you want to show. For example, "next movement" or "next look."

How Many Frames Do You Need for Sprite Animation?

It depends on who is creating the frames. If you're a beginner sprite animator, you might want to stick with fewer sprites. It's best to consider frames for each character action. So a character might have ten walking frames, five jumping frames, and ten running frames. 24–40 frames is fairly standard.