AuthorTopic: Bear Punch animations for prototyping  (Read 559 times)

Offline Dawck

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

Bear Punch animations for prototyping

on: August 04, 2018, 04:51:38 am
im making a timing based game, (similiar to kirbys minigame Megaton Punch!) im more of an artist than a programmer but im starting to enjoy basic programming very much, not too good at optimizing code tho, anyway heres what i have so far this are all the states chained together, theres some big issues here but im more focused on getting something i can start to iterate on so as long as it reads and i can move on to figuring out code, im happy.

im a beginner at doing pixel art but i really wanna improve, i dabbled in it every once in a while but this is the first time im animating this much per se, most of it has been doing studies and the like, im very bad at clustering still. i do draw alot everyday but its not pixel art related.

any comment or critique is appretiated!

things i already see but got not much of an idea of what to do about them

missing secondary animations

ease in is non existent

colors and clusers are way too simple and in some places plain wrong to describe form

line is too noticable for my liking but ive yet to experience what to do about coloring line, im looking at some resources but nothing to show so far

no aliasing not a bad thing really but maybe it would help?

im just talking tricks/ gimmicks not really "animating" and it feels like im too dependant on smear frames and stuff like that, the only animation ive ever done is motion graphics in AE and pixel art so im a not so solid on animation terminology and process, ive watched a ton of animation over the years so that has been carrying my, recalling tips or tropes of animation ive seen/liked over the years. not sure if this is even recommended, anyway thanks for reading!

Offline Rydin

  • 0011
  • **
  • Posts: 888
  • Karma: +0/-0
  • ...zzzt...
    • View Profile
    • hitori

Re: Bear Punch animations for prototyping

Reply #1 on: August 09, 2018, 09:30:49 pm
I can't say much about the animation (I'd be way out of my element)

But this area catches my eye:

You could simplify in this area to help better define it.

If you were to draw this from the other angle, what would it look like? This exercise will give you a better idea of what's actually going on right there rather than just kinda winging it.


Man cannot remake himself without suffering for he is both the marble and the sculptor.

Offline Atnas

  • Moderator
  • 0100
  • *
  • Posts: 1064
  • Karma: +2/-0
  • very daijōbs
    • paintbread
    • paintbread
    • View Profile

Re: Bear Punch animations for prototyping

Reply #2 on: August 13, 2018, 03:34:55 am
Hi Dawk!

First, this is a cute character and your keyframes are very clear and powerful. They all convey the meaning and intent of the pose very well, and there's nothing to change there. Also, you reminded me of how enjoyable kirby minigames are, thank you.

As for the smear frames - yes, they aren't exactly working. There's a few parts to why
-The smears are noisy, and pixel noise break fluidity, interrupting the flow of reading the movement. I would recommend smearing with large blocks of color.
-The smears are not isolated to just whats moving the fastest. A smear is technically a stand in for a frame which does not exist - the frame between the frames is drawn with motion blur. Not blurring in the gaussian blur sense, but more a stretching of the object. For the punch for instance, I would isolate the smear just to his fist.
-You smear things that don't need it. The head turn for instance, that effort would be better spent on other areas than adding a smear to the nose. In the end it adds visual priority to something that doesn't need it. You could, instead, have the ears lag behind and catch up. I feel like that would not detract from the information and sell the movement as quick.
-The teleport (which is kinda a smear!) is used because he is moving too fast to see, if I'm reading it correctly? But then, the direction of the pixels go in both directions, away from where he will be moving. I would suggest a quick blink before the cut away, wherein he assumes a movement pose.
-For those smears when he is assuming a fighting stance, it would work better to draw the tweens for the arms and such on those frames. There is power in firmly and smoothly assuming a stance - rocketing between steps actually makes it seem less well trained!

For the blue lines radiating in, I think they work, but would work better if they held on him, retaining the energy for another frame or two before vanishing. The dissipation conveys that they are not really clinging to him

That punch will really benefit from secondary animation! The cloth, ears, everything. He was just moving faster than light, and hits something with that impact. They will be lagging behind at first, but then immediately he stops, fist transferring all that kinetic energy into the thing he's punching, and the ears and shirt will catch up to him in a moment and swing forward, before returning to their rest position. I think this is the crucial element missing from selling the impact.

Let me know if you'd like an edit! I recommend trying secondary motion first on the list, you'll be able to clearly see where its preferable to the smears.

Offline astraldata

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

Re: Bear Punch animations for prototyping

Reply #3 on: August 16, 2018, 02:35:37 pm
This is a great concept, drawn very well, and Atnas has totally nailed almost everything, but there's a couple of other things too:

First, the arm is bent slightly (at the moment of the punch as well as the moment *after* the punch too.) There is no frame where the arm is extended directly straight from the initial position, which results from the movement/blur losing power and no frame (or secondary motion) shows the impact or its follow-up. The arm would be directly straight from a solid punch that was moving that fast, but it is curved the entire time of the punch.

Also, Atnas touched on this a bit, but the lower frame-count and the "speed lines" in the animation cause it to seem too jerky and distract from the movement itself. I know how tempting it is to draw these if you come from an illustration background, but you have to not be afraid to add in more frames (when you need them), and to avoid drawing anything too distracting (in an attempt to lead the eye), you definitely need the additional frames.

Rather than the distracting speed lines, you could open the fingers slightly for a frame and clench the fists (while adding secondary motion) as an alternative to the speed lines. Remember, speed lines are where light is smeared across frames. Use secondary motion and body language (through squash and stretch) instead to indicate speed.

Sometimes, even purposefully skipping frames and adding them in (with almost no changes) where you might otherwise not think to is enough to indicate the "force" you want. Try that before (when building up power) and delaying after impact too! This is how you have to do it sometimes when there isn't the convenience of "floppy" ears or material to bounce around.

Sorry for butting in, Atnas -- I just wanted to approach this from an illustrator's perspective a bit more too!

I hope this helps, Dawck!
I'm offering free pixel-art mentorship for promising pixel artists. For details, click here.