Platformer character animations

[NaCl]

Hello Pixelation,

I feel like I've hit a plateau with animating this character. I got animations I enjoyed, then spent time refining them and everything. I know they can be better (the animations and the character itself). I've come here to get a little guidance on taking things to the next level. It feels like I've looked at it so much that the flaws have become invisible. Here are some of the animations:



Thanks for any help!

Most Recent Animations

[cels]

The slashing look very good to me. The jumping looks odd to me, and I know it's probably hard to do realistic jumping animations in games where you can jump 6 feet into the air and 4 feet forward from a standing position, but I'll leave that aside.

Unless you have a very strict limit on frames, I would make her hunch down a bit, bending her knees to launch herself upwards. Right now she just lifts into the air with no visible effort, which is odd. I'm not a big fan of the way she fall back towards the ground. Her feet are completely horizontal, which would probably hurt her heel a lot. Most people use the ball of their foot to soften the fall. She's also falling with her legs seemingly completely straight. Again, that would hurt her knees from most heights. And I don't quite like the way she extends her left leg forward. If she was doing a running jump, that would look natural. But from a standing jump, it looks odd to me. I would expect her feet to be almost directly below her, unless there was so much momentum that she would need to extend her legs forward to stay on her feet when she lands.

I have a very insignificant amount of experience with animation, so... I don't really know what I'm talking about here, to be honest.

[NaCl]

Thanks for the feedback, cels.

I see what you're saying about anticipation and buildup in the jump. The problem is that in the game, the jump needs to respond immediately to the controls. Any delay makes for really unfun gameplay. I tried to compensate a little bit by having the rising frames look like she was throwing her mess up (arms and leg), and pushing off with one leg. I can see why it would look awkward.

I agree about the way she falls, it's weird. I did a quick edit that tried to bring her mass underneath her, bend her knees, and angle her feet down in anticipation of the landing. Not a big edit, but I think it looks a bit better.



As for not being experienced with animation, that's fine. I appreciate the fresh eyes looking at this. After all, the audience is not meant to be animators, but people who play video games.

[cels]

Kids these days with their immediately responding controls. They've never played Prince of Persia! You had to plan your jump ten seconds in advance in order to hit the right spot. Could you control your direction once airborne? NO! Could you turn at the drop of a button? NO! Could you survive any encounter with dangerous obstacles? NO!

The falling looks much better though 

[PypeBros]

Kids these days with their immediately responding controls. They've never played Prince of Persia!

Prince of persia had very dedicated mechanics, partly because you never use jumps to overcome spikes or avoid ennemies/thrown hazards. You've got your sword for that. If you try to inject PoP's animation into a mario/sonic/kirby/dukenukem/superprincesspeach-like gameplay, you end up (imho) with a torture engine such as Infograme's Fantasia-on-Genesis.

As part of game design, you usually decide which laws of physics you will comply to, and which one you'll allow the player to break.

As for the animation, I note that the first airbone frame is way too far away from the one on the ground, which makes your animation look like she magically got beamed mid-air.

I'd say you can compensate the lack of anticipation for the jump by a frame that shows how much energy was involved into this sudden dash-in-the-air (there's a lot of this in DragonBall comic), for instance stretching or blurring the foot that just kicked the ground so hard, but bringing all the rest of your character's mass upwards.

[rikfuzz]

Magically beamed mid air thing mentioned above is fine - in a real game the vertical movement will be at 60fps, with lots of repeated frames at varying heights.

Actual animation looks really really nice.  Maybe the hair should be more airborne in the falling frames?  Or a little more secondary motion in the hair across all the animation wouldn't hurt. 

[NaCl]

I'd say you can compensate the lack of anticipation for the jump by a frame that shows how much energy was involved into this sudden dash-in-the-air (there's a lot of this in DragonBall comic)

Anyway you could provide a reference? I think I know what you're talking about, but in playing around with it I haven't found a technique that looks good. Maybe a little study would help. You're right about about the warp, but like rikfuzz said it will look smoother in game. Thanks for the suggestions 

Maybe the hair should be more airborne in the falling frames?  Or a little more secondary motion in the hair across all the animation wouldn't hurt.

Hey rikfuzz, I was hoping you'd post here  You're absolutely right about the hair. It's one place where a lot more life could be added. I just never really feel satisfied with my animation of their hair. It always feels like "token" animation, or like a blob wiggling around. I guess I don't have a good feel for how hair behaves. I tried to add some better movement to the hair in the slashing animation:



Edit:
Tidied it up a bit

[PixelPiledriver]

Some unfinished thoughts:


Do some animation studies on follow through.
In many cases you've reversed the flow of the hair relative to the motion.

[NaCl]

Wow, thank you PPD. There is so much in your edit that I need to go through and study. Lots of really cool touches, you really started to bring the character to life in the way I wanted. I figured I would start with the hair. It's obvious now that I was being way too timid with animating it. I tried to bring more life to the hair in the run animation, but I feel like I over-did it a bit.



I'll be posting more as I dig through your animation and try to apply ideas. Thanks again PPD 

Edit: played with the hair on the standing jump, too. I ripped off your way of having the character bounce up a pixel after standing



Edit 2: Reigned in the movement of the hair. Worked in some of PPD's ideas from the slash

[PixelPiledriver]

I feel like I over-did it a bit.

That's not overdoing it at all.
Looks good. 
The new edit is fine too.

You can animate follow thru elements to have different weights/thicknesses, just as you can animate liquids to have different viscocities.
Think about it like this:
Hair = thin. Water = thin.
Leather = thick. Mud = thick.
I think you could go even "thinner" on the hair, especially for the jump.
But really the thickness threshold you set on your follow through elements is a matter of style, taste, and function.

There's a couple things about the run.
I think its that the green line on her shorts is mostly suspended on the y axis.
The knee also seems to have the same thing going on.
Also the foot while on the ground slows down from the spacing.

I ripped off your way of having the character bounce up a pixel after standing

Glad you looked at each frame closely because that's really the only way to understand animation.
I hope you are somewhat kidding here.
Using theories that I didn't invent is in no way ripping.
So lets talk about it.
The bounce up is an animation theory that helps resolve quick motions.
Basically if an object moves to a new position quickly you move it past the destination and then bring it back.
This is sometimes called Moving Past, altho it can generally just be called Resolve.
But realize that resolve covers a large amount of animation topics and can be flexible in definition.
It is can also be related to squash and stretch but it is not exactly the same thing.
There are different ways of showing this, here's a few simple examples:

Here we don't move past at all.
Notice the ball stops instantly on the line.
It "sticks".


Here the ball moves 2 pixels past for only 1 frame.
Notice the motion feels like it gains some resistance.
The ball was moving fast but it "forced" itself to stop.


Here the ball moves repeatedly past its destination at diminishing increments.
Notice the motion is like a diving board, or spring.
It "springs" into position.


Here's another spring motion using a double image of a lighter color.
Just wanted to show there are many different ways of representing this and they have a different affect on the eye.


You can also see this in some of the edits I've done here and lots of my own animations from years ago.

http://kirkbarnett.blogspot.com/2009/10/blog-post_24.html
http://kirkbarnett.blogspot.com/2009/10/click-to-play-dialog-ani-dp-homework.html

There's also good examples in this video.
At 2:14.
And 3:25.
Another at 3:38.
http://www.youtube.com/watch?v=s2H_qYV-GkM

So how many pixels to move past and frames to use for this?
It really just depends.
Even "sticking" to the destination instantly is not wrong.
Most of the time you will want to mix it up and use a variety even in a single animation.

It's also good to note that using this will solve some motions better than using SlowIn/SlowOut. (These terms are often reversed based on who you talk to, so just whichever makes more sense in your mind)
This is because SL/SO reduces the speed of an object as it approaches its destination, which is not always what you want.
Moving past will better retain the force of the motion visually and add more "snap", "pop", "change", etc to the animation.

This also happens in real life.
Move your fist quickly forward and then try to stop it suddenly.
It will move past its final destination and then come back.

Long answer but there ya go.
You will find that this appears in a lot of my work because I like to move things fast and I think it looks cool.
I just don't want you thinking that the things I do with animation are some crazy invention of mine.
There are theories like this you can use to produce a certain visual effect.
Which theories you choose to use and how much can be called a style, but not the theories themselves.

[rikfuzz]

I tried to bring more life to the hair in the run animation, but I feel like I over-did it a bit.

I'm certainly no expert (as PPD is), but I have found it's actually very hard to over-do it, and some of the more satisfying animation tends to be really more exaggerated than you might expect. It probably just looks jarring as you're used to seeing it one way. 

Semi-related thought:  Doing new keyframes is actually pretty awkward in low res pixel art, I often find it much easier to resize x10 to sketch out the pose more freely, else I generally don't stray far enough from the last key pose. 

[Zizka]

Sorry to the OP for the off-topicness of this message. Please forgive me.

He's done it again! Wouldn't it be a good idea to archive PPD's post in a post-it thread somewhere? I just feel like they could use as a reference for a lot of people. It's a shame to seem scattered here and there and ultimately sort of ''disappear'' as the threads get abandonned.

[Mr. Fahrenheit]

You could browse through his past posts

[NaCl]

Wow, thanks PPD. Your post really illuminated some concepts I only had inklings about.

There's a couple things about the run.
I think its that the green line on her shorts is mostly suspended on the y axis.
The knee also seems to have the same thing going on.
Also the foot while on the ground slows down from the spacing.

Good catch on that. I tried to fix it up. I made her knee raise up more before extending, I think it makes the run more dynamic. Not sure if I completely resolved the issues however.

I hope you are somewhat kidding here.

Half kidding. I see that you didn't invent this technique, but its application here was really effective and all I could do was basically the same thing.

Here is a running jump animation I'm working on. I don't like how the legs come together in the landing, but I'm not quite sure what to do with them.

[cels]

Are you sure you want her to land with both legs? You could also do a Prince of Persia-style running jump. If she lands with both legs, one would imagine her to stop after the jump, losing most of her forward momentum. Like in Flashback or a long jump.

Again, just spouting my amateur opinion. If nothing else, I just bumped your thread

[Savick]

I think cels has the right of it. If you jump while running you're going to want to keep running after the jump to slow down some before you come to a stop unless you want to stop completely with both feet firmly together. Does that sound right?

[Tapsu]

I am quite a fan of the simple character design.

There seemed something fishy about the run animation, a bit like Charlie Chaplin walking.
I suggest not raising the back leg so high, at least not so soon in the run animation.
Also, according to http://www.youtube.com/watch?v=tJWPwVF30yo there are two different gaits for running, and the short-step gait (called gliding in the video) has obviously better maneuverability than sprinting. However it looks much less flashy, so I would not suggest going that far with realism. Though maybe the highest foot position is still bit too high.
While the leg is back, I think the girl should have at least a little bit of butt.

And a thought about slashing animation. If the movement comes from the legs, then other movement like hand being pulled forward, would work more like the body pulls the hand forward with the same force as the hand pulls body backward.
Did a few frames of slashing. If the weapon is not heavy, like a lightsaber, and it is just the weight of the hand that is moving forward, then I probably overdid it a bit.

[NaCl]

@cels and Savick: Yes, you're exactly right. Here is a rough first draft of the new running jump animation. Still needs some tweaks but leading with one foot makes much more sense



@Tapsu: Good feedback, thank you. I modified her legs a bit so in the impact frame, they aren't already kicked almost all the way up. Looks better. I like the way you get the body moving in the slash animation. I will have to play with that and come back with something. Thanks!