Silky smooth character animations

Gabe's Game

DISCLAIMER: These gifs are recorded at 15 frames per second - My game runs at 60 frames per second. The animations depicted are not representative of the final, or even current, product. 

I've been watching boxes jump around for too long. I have a character design ready to go, so let's get this thing animated and in game! 

My characters build actually presented some unique problems. The body is almost entirely legs, a deliberate design choice. Putting focus on the part of their body that is used as a weapon. 

This body composition presented some interesting challenges. It's very frustrating to control a character who doesn't seem to care as much about the action as you do. When I'm running away from a monster that's trying to kill me, I do it in a dead sprint. If my character looks like they're jogging, the player will feel like they're being held back. 

When a character that's all legs runs at full speed, you get pretty dramatic effects. 

The run itself feels great, when I'm running I know my character is going as fast as they can. However, stopping and starting both look really abrupt. The full extended legs are uncomfortably far from the idle pose, causing a snap to start and stop. 

The character already takes some time to accelerate in the game, so I just added an animation to go with it. They now do a few quick steps forward before reaching full speed. As for stopping, making the legs come down naturally every time would require a few stop animations connected to specific frames in the run. I decided to optimize my workflow, stopping the character with a sort of body jolt helps the character feel weighted while compressing the work down to a single animation. 

On to the jump. This is a pretty important animation, it's more or less the focus of the entire game. So I wanted something catchy and memorable, while also simple enough to not get annoying the ten thousandth time.  

Taking advantage of my little robot, I went with a quick lower body spin. A landing animation would obviously help imply weight and impact, but maybe I've already made it. 

The stop animation from before feels pretty good. This is one I might go back to later but, for the time being, I'm happy with it. Now for a bit of polish. 

A little squash and stretch on the head gives them the final bit of character I was digging for. A wall slide and a blink later, I have my characters basic animations ready to go. Before wrap up, I wanna mention collisions.

In a game where jumping at the right time is life or death, precise collisions are imperative. My character's boxy head helps a lot with defining their bound box, but I also put deliberate effort into filling the box with the body and only ever barely breaking out of it.

So, that's that. Now every time I test my game I'll have a cute little action hero cheering me on! In the future, Ill be adding a lot more facial animations. I'm also strongly considering a few jump variations. For the time being though, this should work great. 

William's Comment: 

The animations look great so far, but I can't help but feel like there's still something missing.  Gabe's implementation of a build-up animation for running and a stop animation, as well as an impact animation really helps to give the character some needed oomph.  The squash and stretch of the character's head feels like it perhaps does more for the character quality than the conveyance of motion (at least to me), since the shape of the holographic box comes across to me as a stand-in for expressions.

Before Gabe and I ever made Dueling Devblogs, he and I had planned to work together on making a game with a similar focus on wall-jumping (though the game itself would have been far different from what Gabe is developing now).  When we programmed a prototype for the platforming engine, I had been using Mario sprites from Super Mario Bros. as a stand-in while trying to make them feel more dynamic.  Gabe and I ended up creating a system where the sprite would: 

• Lean into running initially
• Lean back a bit as he picked up speed and the feet were what were carrying him 
• Tilt dramatically with abrupt change in direction to show a bit of whiplash
• Tilt with the angle he was falling or ascending

The prototype was pretty underdeveloped and needed lots of improvement, but even this was a lot of fun

These are pretty minor visual changes (implemented with an entire system of additional functions to get it working properly) that do a lot to emphasize things like effort and aerodynamics- that is, reactions to forces and factors that can't be seen but are subconsciously assumed to play a role in movement.

Of course, there are some issues with implementing all of this with the way that things are currently set up- you want for any tilting or squashing of the character's main body to not be so extreme as to no longer adhere to a collision box, but with the way that Gabe is currently drawing the character's head as a completely separate sprite he would also need to use some "fun" trigonometric functions to keep the head projecting out of the neck whenever the body tilts. 

Gabe isn't finished with his animation, and I'm positive he's going to continue touching up the look and feel of his character as he continues- Gabe is a graphic artist first and a programmer after the fact.  He may go a completely different route with supplementing his animations that I never would have even considered, and since this is much more his expertise than mine I'd definitely trust him with whatever he decides.