Pixel Art Animation Workflow

There are many ways to approach animation, and mine is just one of many. However, there are multiple tools and tips that can benefit many different styles.

Basics

Animation principles apply to pixel art as much as to other styles of animation.

Here's a good video series to watch on the topic:

 

 

 

 

 

 

12 Principles of animation

The 12 principles are:

1. Squash and stretch
2. Anticipation
3. Staging
4. Straight-ahead action and pose-to-pose
5. Follow through and overlapping action
6. Slow in and slow out
7. Arc
8. Secondary action
9. Timing
10. Exaggeration
11. Solid drawing
12. Appeal
    

Now, I won't go into all of them but I will be mentioning a few as I explain my personal progress.

 

 

Prioritizing

Here is a finished 5 frame character idle animation:

And here is the first frame:

I tend to start animating from the first frame.

It's important to create the most important keyframes first. Knowing what happens at the beginning, the middle and the end, is the key.

 

 

 The key movement here is the head going up and down

 

After the key movement is decided, secondary actions can be added.

This one I find to be the most fun.

Here, the hands going back and forward is the second most important movement. The flower moving and the tail waving follow these movements. They're more like decorations than anything, but add more interesting movement, and character.

Personality

Animations should embrace the personality of the character. This blue character is fluffy and approachable while this bunny is more angry than anything, emphasized by the movement of the foot.

In this one exaggeration and slow in/slow out is important. It makes the personality stronger, and more noticeable. 

Other tips

I've been using Pixelorama as the program for making pixel art and it has become my go to.

When moving things around and "sketching out" the animation, I like to use the lasso tool, and fill in the blanks with the pen tool.

It is important to not be too focused on details at the beginning. Honing out the beginning, middle and end of the animation, is much more important.

Unity

When working with unity, testing in the game engine is important.

Also when working for a game project, it is important to see the animation in the actual environment they will be in game. Contrast is super important, so that the character doesn't drown in the game world.

To animate the spritesheet in Unity I used the method Antti taught us, so I don't have much to add to that.

 

When working with spritesheets, it's good to leave enough room for future animations. You can throw in your initial spritesheet with just a couple animations, test them in Unity, and add more in the future by replacing the image file in the files. Right click the spritesheet and choose "Show in explorer" and replace it that way. (This works with GitHub/GitKraken too.)

Planning how much room you need for the spritesheet relies on planning how many animations the character will have in the game.

Only thing to note is that when working in the Sprite Editor and Slicing the new frames, you want to make sure the old frames don't get deleted by using "smart" instead of "delete existing"

 Thank you for reading, and hope you have a good time animating!