A Case Study of Animated Loops, Courtesy of Game Freak.



I've been dabbling with animation for a while now, just practicing and trying to get a feel for the process on my own. But they say if you really want to get good at something, learn from the masters.

For anyone unfamiliar, the most recent generation of Pokemon--Black and White versions--features animated sprites in the battle sequences, a first for the series. The one I've been working on for who knows how many hours is based off of this sprite:



Something I've always liked about the Pokemon series is that their in game sprite artwork is always beautiful, and the addition of animations does not disappoint. I figured trying to recreate one of them in vector form might be a fun exercise, and this was the result.

I'm kind of disappointed that I didn't keep better track of how long this took but suffice to say, it ended up being a lot more complicated than it looks at a glance. Mainly because there are a bunch of overlapping actions happening, which is something I've never really worked on in my brief time with animation.

Some barely intelligible notes I took during the process:






Like I said, there are a lot of things going on at once so the first thing was to put them into basic categories. There are 2 "main" cycles: the up-and-down floating motion (often referred to as the "bounce" in the notes), and the shiver motion from side to side. Then there are the minor actions: the waving of the arms, the specular reflections on the cones, the delay of the topping, and the cloud of frost being shot upward during the shiver.

Before jumping straight into the frames, I did a quick painting of the Pokemon to make sure it looked accurate. Once the basic animation cycles were outlined, I just tackled them one by one, often pulling out my DS Lite for reference when necessary. First I did test animation cycles using the rough sketch version of the model, just to get an idea of how it would look.  Here's one of the in-progress versions I saved along the way:




I wanted to make sure that the fundamental 'look' of each action was right before doing anything with vectors. But once all of the movements looked OK, I traced over the rough painting with Pen Tool shapes and redid all of the movements with the vector model, adding more in-between frames in some areas to smooth out the animation. So basically I had to animate it twice. Much less planning (and errors) the second time around though...

In total it ended up being 196 frames. This isn't even the full size, I had to shrink it down because the original file was over 27 MB. It was more difficult than I could have guessed looking at the sprite, but I learned so much from doing this. My hat's off to Game Freak and Nintendo as usual. A lot of video games include sprite animations that loop, so it was a good way to get introduced into the idea of animated loops and how they can be used to breathe life into characters and creatures. It's got me interested in going back and looking at looped sprites in other games I used to (and have yet to) play, and trying similar studies, so that one day I can start making loops like these on my own.

No comments:

Post a Comment