During this week I have been very busy with the walking animation cycle of the kid design I wrote about last week. Because I have had very limited knowledge of animation earlier I broke down the process into small enough steps that I thought I could manage. I also made this using photoshop CS, which is not the most ideal program to use for animation, but it works and I still learned a lot about frame by frame animation.
I started by visualizing how I thought this hungry, happy kids would walk. It will hunt the player across the screen in hopes to take the candy away from him/her. The kid would be happy and running. I imagined the sort of hopping run where the child pushes off harder with one leg than the other, making for a regular run with one leg and a high jump on the next step. I have seen kids do this when they get excited and since almost no adult does it is a very childish thing that will help convey the message of what this enemy is.
When I knew what I wanted to do I started sketching on the key frames for my animation. I started with the character at its lowest point, and then I made it at its highest and started filling in the spaces in between. At this point I only made a head and a body with two legs. I didn’t want to make too many frames because I wanted to save time, and through testing what looked alright at this stage I made a loop with 12 images.
After this I added arms at each stage and when they looked the way I visualized I moved on and created the slight turn of the head. I knew it would be more work with the face later on, but it was important to show the mood of the kid (hyped) and the face is the easiest way to do that.
The last thing I added was the hair. It is one of two styles, but the one that moves the most. It helps with giving the child an even more bobbing, happy look that is what I’m going for.
During these stages I kept in mind the squish and stretch principles of animation. Especially for the body and hair, but also for the legs, making their shapes rounder as they hit the ground and prepare to push off, as well as stretching them as they jump up.
Above I have put the first clean images of the running cycle into a sprite sheet that can be used in the game. These are the base I’ll by putting my concepts into. I will make all base clothing in grayscale to be able to change the coloration easily and get in a lot of variety later.
I put the top and bottom part in different layers so they can be changed individually. The hair, skin and face paint are on separate layers as well and this lets me change their coloration and form. I do this to save the time it would take to redo the whole animation.
This is the first version. It needs some polishing around the edges where the lineart is still showing underneath but then it is good to go for the coloration. 
Now I’ll run along and come with a new update next week!
Matilda Nagy 
Hello Matilda,
This is a very interesting post, especially for those who are not artists. I like that you describe in detail the process of creating an animation for an in-game object (a child in this case) and give your motivation for some of the character design choices (especially jumping). From your post, I learned that there was such a thing as animation principles (via your mention of the “squash and stretch” principle). A post which makes its readers want to google things up is valuable as it teaches them something.
There was, however, one thing I felt you should have made a reference to. (This is not a shortcoming in itself, but rather my personal preference.) I think a reference to the design document of the game and a quick summary of how that character (the child) was portrayed in the document would have been useful. It provides context to the reader and lets them better see how the character you are making will fit in the entirety of the game.
The animation itself and the character looks very good. I have playtested the pre-alpha of the game and liked the somewhat dark, nightly visual style of the game. I am looking forward to the final game.
Best wishes and good luck with the game development.
Rokas
LikeLike
Hi Matilda, this is looking great so far!
When you describe the things you say you want to visualize, I get a clear image in my head of what it is you’re trying to convey. That happy, candy hungry kid who’s full of joy, a late Halloween night.
The workflow you’re explaining, sounds like a great way to work. Focus on the key frames and then work on the in-betweens, using a simple body with no arms to lighten the workload. I can also relate to Photoshop CS being a hassle to work with when it comes to animating.
Something you could do for future work would be to look up a bunch of references. References are a life saver and it’s always good to have them at hand when working on something new.
Because at the moment it looks like the kid is jumping over an obstacle instead of doing a skipping walk. A skipping walk has less frames on the ground and more frames in the air.
What you currently have is a good looking, smooth animation but it doesn’t completely fit the goal you described at the start. Take a look at references.
The face animation looks really good and it’s obvious that you have experience with drawing them in tricky angles. I’m also really impressed with your use of the *squash and stretch technique, giving your character a nice fluid motion.
Good luck and nice work!
LikeLike