AuthorTopic: [WIP] Misc Animations  (Read 37008 times)

Offline sagarverma

  • 0001
  • *
  • Posts: 2
  • Karma: +0/-0
    • View Profile
    • Milling machine

Re: Fighting Game Animations

Reply #20 on: May 29, 2015, 08:17:31 am
Heyyy....great ones

Offline Cheetah

  • 0001
  • *
  • Posts: 48
  • Karma: +0/-0
    • View Profile

Re: Fighting Game Animations

Reply #21 on: May 30, 2015, 01:52:10 am
The character design is better and your pixel art skills have improved, but you have gone completely backwards in terms of the animation. All the previous work to get good speed, rotation, and impact developing in the previous versions of the animations has disappeared. The current punches just look so wimpy and unnatural. Reread the feedback from your previous attempt and make sure to have good references to get the form and the pacing of the animation better.

Offline Conzeit

  • 0100
  • ***
  • Posts: 1448
  • Karma: +3/-0
  • Camus
    • conzeit
    • View Profile
    • CONZEIT

Re: Fighting Game Animations

Reply #22 on: May 30, 2015, 11:39:59 pm
sorry Rosier but I gotta echo that.

When I made a big crit and did edits on your stuff you really listened and put a lot more dynamic movement into your sprites, it was really impressive to see you could do that. But here you're back to moving as little as possible, even after Wolfenoctis has shown just how much more weight you can put into your animation if you give it your all.

This style is as simple as it gets so it shouldnt be hard to redraw frames, I know you can do it because you did it when you first got here so it just seems like you just dont want to put as much effort into animation anymore

Offline The B.O.B.

  • 0011
  • **
  • Posts: 699
  • Karma: +3/-0
  • currently losering it up...
    • View Profile

Re: Fighting Game Animations

Reply #23 on: May 30, 2015, 11:52:49 pm
   Whoo, haven't done one of these in a while. Hey, Rosier. Saw this a while back and saw some of the responses you've gotten thus far. Some have been really good, but I'm not sure if I'm quite seeing it in your updates. I decided I had enough time today to do some quick edits and maybe try to add some info to this discussion, regarding the animation of small scale pixel art. So after about 2 hours or so of doodling in Pro-motion and a few artistic liberties I've taken with your initial concept, here's what I came up with so far!

Bumping cause I finally decided to finish some new stuff...

Idle: Based somewhat on Sol Badguy's Idle from Guilty Gear -- http://chaoti.csignal.org/sprites/large/ggx/sol_badguy_standing.gif

   The idle you have so far is decent, but there are some odd things happening here. I looked at your inspiration, via the Sol Badguy gif, and see where you're trying to go with this. It kinda' seems like you're missing the subtleties of the idle. To be more specific, your character's feet keep moving up and down, as if he's in a constant state of perpetual tip-toeing, moving up and down. You could make the excuse that he's hovering with ice powers or magic(or something), but I got the feeling he's grounded in that idle. Therefore, look at your reference one more time in Sol's stance, and notice from the knee's down those body parts rarely move. Therefore, I think it would be wise to leave the feet in a static state.

   Also, you have to understand you're working with a small space here, so traditional animation may give way to traditional pixel art technique. That is to say that you can't just focus on moving a pixel from one place to another and call it a day, as if it were a traditional line. Instead, you may have to implement a method called 'sub-pixeling'. That is to say, that within a set of frames, where one pixel was, another pixel that changes in color or contrast may take it's place creating the illusion of movement, yet somehow smoother transitions. In higher res animations, think of the equivalent of auto-tween effects between two animated frames/graphics. They are similar concepts, but sub-pixeling would be very helpful here.

   Therefore, I tried to add these concepts in this singular idle pose that I've edited for ya'. Also note that the majority of pixel movement is happening in the chest region. As you look further past the chest in all directions, you'll notice the further it moves throughout the body from the chest, the less pixel movement or sub-pixeling there is(which makes sense, as the major action in the animation is the breathing, happening through the lungs, not the other body parts!  ;D ), except for maybe the head region:




Went ahead and redid the combo into a more viable, less flail-y motion.  What I mean when I say W/O Delay is that I took out a 'Lead Up' Frame right before the actual 'Full Hit' Frame.  I couldn't decide whether or not I wanted it to look more snappy or not, and thought you guys might have more insight.

One Hit:
One Hit W/O Delay:

   As for the one hit animation, it seems you've already been told about the snap in the attack, but I'm still not quite noticing it. For animation, timing matters especially if you are to convey motion or actions to people. What some beginner tend to do when they jump into animation initially is to start animating an action, from the starting frame to the end frame in chronological order. Of course, logic would dictate that as being the smart thing to do, but animating is a bit different. It's all about communication and translating it to paper(digital or not). With this, it's about timing.

   As I mentioned previously, your animations look as though you're following through each frame chronologically, making it look as though each frame is running at the same frames per sec causing the movement to look slower than it should. In this case, you don't want to do that. Try and make key frames first, dotting their positioning before doing the 'tweens'(or "in-betweens", as there known generally). By doing so, you'll find that you'll have a better idea with mapping out the timing for each key, and how many frames it may or may not take to move to another key. Take a look at this quick edit I've done here:



   So, here it's a simple 5 frame animation. We're moving from stance to a quick jab and a recover back to stance. The key animations are the stance and the jab here, obviously. It's a simple jab, so you don't need to do much work. In fact, this could be done shorter, which you'll see in this next little sample I've done. However, for the moment focus on the changes I've made:
  • In frame 1, there's the idle stance. We'll consider this a key frame.
  • In frame 2, there is a transition moving to the next key frame, which is a solid jab.
  • In frame 3, we see the key frame, in a lower stance throwing the jab.
  • In frame 4, we have a transition/recovery frame. It looks very similar to frame 3 and the movement changes little. This is done for a reason! By making a small change from the snapping jab, we're creating the illusion of a snappy punch, slightly extending it's normal reach. Think of it as a squish-squash technique that Disney animators use on their models/characters. But altering the model's general shape/length/form, it gives it more flow and liveliness. I added the white flashy stuff, to add to the ice-effect you mentioned earlier(not that it looks like ice, just to show which hand is causing harm).
  • In frame 5,  we have what SEEMS to be a slightly out of place transition frame. However, not so much. Because we're dealing with video game animation(as you stated earlier) there are some frames that may need to be drawn that can be reused to easily transition a movement to repeat itself. In this case, we've drawn a stance that is slightly crouched, but similar to the transition frame 2. However, it could technically be a an idle frame all on it's own. This is done on purpose, as we want a universal stance that other similar attacks can be done from, so combinations can easily flow from one type of attack to another, along with repeat frames.


   Based on the last frame I mentioned earlier, we can see it helps continue the jab, if the player continuously presses the same command, programming-wise:



   So in a way, that last frame is a transitional frame not only in an animation sense, but in programming sense as well(for a fighting game, at least)!

      The other thing is timing here. On the first single jab attack I posted, the timing in chronological order from frame 1 to frame 5 is as follows in the DELAY of milliseconds per frame: 1st frame-150 ms/f, 2nd frame-60 ms/f, third frame- 40ms/f, fourth frame-60 ms/f, fifth frame-150 ms/f. Notice the quickest frame is the 3rd frame(with the smallest delay, meaning it's moving at more frames per second), which is the attack itself. Again, by adjusting our timing we can create the snapping effect.

   Much like animating a swinging pendulum, an animator notices that when the pendulum reaches each end of it's respective swing, there are more frames to be drawn/tweened in those end positions. However, when the pendulum swings downward reaching it's' midpoint of the swing, an animator will notice there are less tweens drawn there to create the illusion of speed(ie, each frame is further from one another at the mid-point so the eyes are seeing images appear in different spots on the screen at such a fast time, they seem like the images are moving quicker than the prior frames which are more closer to one another, distance/position-wise). The same is happening with our animation in that these extreme changes in positions/stances/placement will determine how many frames are needed to translate our movement.

Two Hit:
Two Hit W/O Delay:

   We continue what we've discussed earlier and apply these same methods to the next attack with some minor changes, which is simply a two punch combination. I didn't mention it earlier, but the positioning of an attack really does matter. As mentioned by the other users, the starting force of a fighter's attack comes from the body, NOT the limbs. Energy travels from the center of gravity, creating a stronger attack, than simply moving an arm up or down. That's not to say one can't attack by simply flicking a limb in anothers general direction, but martial artists around the world have learned energy moves from object to object; because of this fact, if a fighter moves his body in such a way that a limb(such as an arm or leg) travel afterward in it's general path, the resulting blow would be more forceful and resolute than simply moving with a limb.

   Your character's limbs seem a bit limp, as if they are flicking the opponent with the back of their hand in a strange 'shoo'ing manner. If he is meant to be punching, than a straight arm, which begins from the chest or hip, is more devastating.



   The legs dip a bit to produce a better "spring action" for the resulting blow. Notice the end placement of the hands as well. They are placed no lower than his shoulder, as it's meant to be a high attack. Also note the placement of his feet, as even though they turn as he turns, they still remain in place. For boxers, having a stance where the legs are shoulder-width apart and set in place during a combination helps with the power.(obviously, the application of said technique can change with different styles of boxing, where a fighter who is a 'poker' will tend to move his feet as he pokes/jabs his opponent for points. However, these fighters win by points and not damage, mostly. I'm assuming your character is looking for damage, so he may sacrifice movement on such an occasion).
   
   As far as timing goes, I've intentionally slowed down the key frame attacks here for a particular reason. I'm only doing so to create an 'impact' affect. In reality, I would've timed them quicker like the first attack. However, I'm slowing each attack here, to give you a sense of how a programmer may want to see an animation play out during a game. That is to say that if first attack hits, there would be a short delay in timing for the next input to be placed in the combination series. So basically, it's how a programmer would probably want to set the programming for an attack for added effect.
 
Three Hit:
Three Hit W.O Delay:

   Again, we're just following what we've learned so far. I reused some frames to help transition the movement a bit better, and edited some existing ones slightly to extend his reach just a teensy bit further. Each key is still slowed down, for added-effect, until he returns back to his idle pose:



   As for everything else, it's all in the details. The subtle swing of the coat and hair, posing, and knowing how your timing plays into an attack. Practice makes perfect(which I'm not claiming for myself at all), as they say. Hope to see an update in the future, as I like seeing animators grow!

Good luck! :crazy:
my back hurts...

Offline Rosier

  • 0010
  • *
  • Posts: 477
  • Karma: +1/-0
    • View Profile

Re: Fighting Game Animations

Reply #24 on: May 31, 2015, 01:30:06 am
@Cheetah

--Rereading everything makes me think that I confused "Delay Frames" with simulated hold or something along those lines.  Going back to these: , the difference is the 2nd having him hold for a second before hitting.  Somehow I associated that with adding an extra frame instead of just using animation techniques to make it seem snappier.

What I ended up with was this:   I can't get the arm to hold quite like I want it, but I made it snappier and also made his legs bend rather than push out.  Still going to go over it a bit more, but I want to see if I'm on the right track.

@Conceit

If I didn't want to put in any effort, I wouldn't be redoing more or less already complete animations.  The best than I can say is that I legitimately forgot how to do what I did.  Waiting two months before working on this kind of stuff probably didn't do me any favors, either...

Regardless, I'm ready and willing to go back ten more times if I need to.  I work better at this sort of thing when I bashing my head in trying to perfect it, anyway.

@B.O.B.

As for the Idle, what I meant by saying it was based on Sol Badguy was I had a previous version that looked like this:  I didn't like it that much, which is why I never posted it.  The legs in the new one are pretty much just like Sol's position wise, but the Idle was my thing.  I'll definitely look at adding a bit more chest motion like in your example, though.

For the hit animations, I had already finished the new version of the One Punch literally as you posted this.  A hint that I might be in a better position with the new one is that your One Punch has five frames, and mine has six now. 
Otherwise, I'll take a hard look at the follow ups for the punches.  The animations ought to be a great help.

Offline Conzeit

  • 0100
  • ***
  • Posts: 1448
  • Karma: +3/-0
  • Camus
    • conzeit
    • View Profile
    • CONZEIT

Re: Fighting Game Animations

Reply #25 on: June 06, 2015, 05:19:05 am
ok rosier I went back and looked at how our crits went, and I think I made you think using a lot of fancy blurs was my idea of good animation, and when you did that I was satisfied. Good thing you're not doing that now but I thought somehow you had learnt observation and balance from that, but clearly that is not the case.

Also, you will not improve as fast if you keep doing things only in this super simplified style with no shading, you need to learn about volume and the real shape of things before you simplify, or you'll end up with a drab style instead of a minimalistic one.

When you look at something from reality in slowmotion it looks fucking awesome, right? when you look at your anims that should be the case too, but that wont happen if your keys are not interesting. so I propose when you start an animation, do it with overly long delays and only the keyframes, your poses HAVE to improve this way.

I think you still need to unpack all of what wolfenoctis did

From your response to him, clearly you want no indication of anatomy, that is ok if you still study anatomy on your other drawings, but for this animation you need to understand his skills on

posing, timing, overlapping action and followtrough.

Here's just keyframes.

a lot of your keyframes look alike, each keyframe should be one extreme of motion, they should have character so that it's interesting to look at even at slowmotion.

Now let's just look at the first punch

I can see here you did imitate Wolf, you have an overshot and then the fist spring back a little like his animation, but you have more buildup to yours, clearly you wanted more impact but I dont think you're getting it.

posing
reusing so much of your sprite is hurting your action lines. You dont want to redraw the head so it never changes angles, and specially the spine never ever gets bent here. we bend our spine all the time.


please watch this proko vid's part with the naked lady and the cyan lines.
https://youtu.be/_JHt6lOGfRs?t=20s
at the begging your pose should always be balanced on the center of gravity.

now this part
https://youtu.be/_JHt6lOGfRs?t=2m4s
 if your character is going to move as in running or taking a step to attack, he should lose that balance to get impulse for his attack. Your attacks lack that so it sorta looks like he's playing patty cake

EDIT: this part of Proko's gesture drawing video exemplifies very well how gesture improves line of action and posing
https://youtu.be/74HR59yFZ7Y?t=3m8s


here's a rough by me which has the impulse I think you meant to have with your attack. also notice how everything is changing positions a lot more.

see how his spine twists? for the buildup he's drawing an S around the line of gravity, for when he connected the punch he's way unbalanced to the right because he's putting his weight on the punch, finally  he shifts his weight back to the left to go back to starting position

I'm worried that you dont know how to draw a rotating figure in 3d. the head and the torso didnt rotate a lot, and when you did rotate his head it didnt look very real. You should not be afraid of showing his head as if we were looking down or up at it, if you cannot do that your poses will have a timidity that will make them drab. The torso rotating is really important as well, a large part of that changing of balance goes on in the hips and the shoulders.

overlapping action

there is always something that is pulling the body in the action, this is the leading action, but you still have the limbs doing something to further go with the impulse or try to balance the body.

great post about this:
http://www.animatorisland.com/beyond-the-bouncing-tail/


This rough had the general motion of the punch figured out in the last one, but look at that crazy leg on the left. that is one crappy overlapping action...does he have rheumatism or something?.



I tend to make my keys TOO unique so when animated they just look like scribbles jumping everywhere, so I went back and redid that stuff to make a better arc. the arm on the left specially has a very arcy motion, the legs I just redrew so they kept still :p

I've read you say "you already know this stuff so it's easy for you"...not really, you just have to put the effort in every time, you always have to observe real life movements, think of the principles and work trough it, removing what doesnt work. The amount of observation evident on Wolf's edit probably didnt come easy either. So try to enjoy it, and if you dont...focus on another aspect of making art for a bit :p god knows animation isnt the most rewarding thing all the time.
So when someone gives you an edit, please try to break it down aspect by aspect like I did here, step by step bit by bit. Someone who did an edit like that would probably be willing to explain whatever is too mistifying for you to understand if you point it out and ask.

followtrough


Look at the shape of the coat thing as he turns his shoulders. look at the way the pantlegs change shape just a little as hits the punch to show the impact in a subtle way.
Think of what happens to them as if they were lagging behind the body, they have no will so whatever they do is because the body just moved and now they are either falling because the support is gone or being pulled by what just moved because they're attached to it, the combination of trying to fall but being pulled at the same time is what creates that ~ shape we often like to give them. Then, when the rest of the body stops the cloth tries to keep it's movement. that's what the pantlegs do in Wold's edit, they jump forward when the punch connects because they still have the impulse of the punch


I could have animated the hair or his little coat thing but I fucking love swipes so I went for the ice effects.
it kills me that you have an ice effect and you dont use it at all, you just recolor his fists. you can do a smokey ice like I did, you can do little shards that get attracted to his fists...you can do snowflakes, you can do bigass crystals....but use it! you dont even have to be as overboard as I was, half of this anim could not have the icey swipes and it'd still be great....it probably would be better, swipes are for me like lensflares are for abrahms :p

Your idea of using ice as a way of holding pivot parts is great, that would really shine if you put a lot of emphasis into balance and lines of gravity, then freeze the pivot and whatever is leading the action...it'd be amazing =)

some more wips to remind you that it's always an effort :p




EDIT: gotta admit, the way there is no indication of anatomy in this style of yours makes it  very easy to just grab a 3x3 brush and scribble frame in and go to the next, so much that I couldnt resist making the other 2 hits :p

I know what I did is not really like what Wolf did, I have more exagerated movements while his are a bit more grounded and you're probably going for something more like that, but I just have more fun doing stuff like this and these exagerated poses better exemplify the sort of dynamism lacking in yours. again, mostly it's about what proko says in his gesture video https://youtu.be/74HR59yFZ7Y?t=3m8s
« Last Edit: June 08, 2015, 12:25:46 am by Conceit »

Offline Rosier

  • 0010
  • *
  • Posts: 477
  • Karma: +1/-0
    • View Profile

Re: Fighting Game Animations

Reply #26 on: June 08, 2015, 07:15:39 am
After looking at that a bunch of times, I think trying your dynamic type of stuff will probably do me a bit more good that trying to make it grounded.  Comparing some of my other animations in the Hyper Light Drifter esque style, they're definitely not grounded, and they have a lot more diversity in frames because of it.

Otherwise, I'll see what I can gather from the video and all the edits/redos people made, and definitely expand on ice shenanigans.





Also, I tried saving B.O.B.'s animation and for some reason it only has like one frame and the rest are cut in half for some reason.  Does anyone know what's going on with that?
« Last Edit: June 08, 2015, 07:18:46 am by Rosier »

Offline Probo

  • 0010
  • *
  • Posts: 317
  • Karma: +1/-0
    • View Profile

Re: Fighting Game Animations

Reply #27 on: June 08, 2015, 09:25:17 am
^ his rise seems a bit slow, heres an edit with more acceleration

Offline Rosier

  • 0010
  • *
  • Posts: 477
  • Karma: +1/-0
    • View Profile

Re: Fighting Game Animations

Reply #28 on: June 16, 2015, 06:48:53 am


Remade the first hit with 6 frames, mostly following the conventions of the examples.  Still not as extreme in terms of motion as it, but mostly based on Conceit's. 


Assuming I'm on the right track now, I'll work on the follow ups and shading.

Offline Conzeit

  • 0100
  • ***
  • Posts: 1448
  • Karma: +3/-0
  • Camus
    • conzeit
    • View Profile
    • CONZEIT

Re: Fighting Game Animations

Reply #29 on: June 16, 2015, 10:08:06 pm


I like the effects you've done on this one, the puffy smoke fades of pretty well. are you animating in something that has onion skinning? that is, a program that lets you view a transparent version of the previous frame as you draw? that helps a lot with making cool fx.

I'm flattered every time you want to do that Rosier =) but my animations are not perfect to be honest and what I'm most trying to teach you is the stuff about gesture, action lines and balance.
try making an animation where you have to rotate his head and his shoulders OR hips, and try to make that as well as you can, I think that's one thing that would help you a lot, if you have the hang of that you could tweak his pose with more confidence. you're redrawing things more on this one but the torso or the head are still not rotating.