AuthorTopic: Pixel art animation - moving sprites  (Read 1241 times)

Offline spajjder

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

Pixel art animation - moving sprites

on: February 14, 2020, 03:07:44 pm
Hi guys.

I saw this clip - the work through of making a  pixel-art monk jump attack. It looks very nice.

https://www.youtube.com/watch?v=is3DeKxPYDA

In this animation the monk jumps across the screen. It presents itself very well, but is this a common way to make pixel-art for games?
The animation do serve a purpose of moving the object itself though, it would not make much sense doing the animation moving the object in another way than moving forward.
However in my experience, when using a tool like game maker, i program the sprite itself to move, and a certain  animation is played when the object is moving a certain way or doing a specific action.

I have seen many animations made this way though, "where the whole sprite moves across the scene", including from spriters for famous games such as shovel knight.

So is this a common way to make pixel art animations for games? Or is it mostly for show? Would you implement an animation like this directly into a game, or would you first have to redo it so that the sprite is somewhat static in his movement, i.e. changing his animation but not moving across the screen?

Thank you so much! for your help and advice!

Offline eishiya

  • 0100
  • ***
  • Posts: 1204
  • Karma: +2/-0
    • http://pixeljoint.com/p/28889.htm
    • View Profile
    • Webcomic: Black Dram

Re: Pixel art animation - moving sprites

Reply #1 on: February 15, 2020, 05:34:15 am
Animations like this are common for games or individual actions where the player does not have direct control over the character's motion, such as attacks in turn-based RPGs, or things like dashes in platformers and finishers in fighting games. In these cases, the exact relationship between the player's hitbox and animation is not that important.

It's also common to do the second thing you described - draw the action as a single motion, and then reposition the sprites to match the in-game movement. It's easier to avoid characters looking floaty or slidy when you' animating them "in context" of the entire motion.

Offline spajjder

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

Re: Pixel art animation - moving sprites

Reply #2 on: February 18, 2020, 02:51:20 pm
Thank you a lot for the answer. Very helpful!

Offline yrizoud

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

Re: Pixel art animation - moving sprites

Reply #3 on: February 19, 2020, 09:06:20 am
In this painting program, frames are non-moving for their entire duration. If for example your screen is 60Hz, a "step of animation" (a unique sprite) with a duration of 0.1s will be shown at the same place for 6 screen refreshes.

When integrated in game, or first refined in an animation program, animator can fine-tune the individual positions to break a single 0.1s step into several shorter ones that show the same sprite at intermediate positions. It's also possible to let the computer interpolate steps between a starting and ending position.

Offline spajjder

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

Re: Pixel art animation - moving sprites

Reply #4 on: February 19, 2020, 12:16:58 pm
Im sorry,, in which program is that?
Could you explain a bit further?

Thank you in advance!

Offline yrizoud

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

Re: Pixel art animation - moving sprites

Reply #5 on: February 19, 2020, 02:16:33 pm
In Adobe flash this is (was) called motion tween:
Instead of saying "this image is displayed here and stays over time T", you set up "this image starts here, and moves to this place, for a total duration is T"
https://www.youtube.com/watch?v=UPluh8Mre-c

AFAIK, in addition to these movements, Flash let you resize, rotate, and change opacity, however such changes can't be applied on pixel art.

Another way of calling is that you have the program interpolate the positions of the sprite.

I don't know nowadays if there are programs that let you both draw and animate this way at the same time. From a little search, I can see there are things like this on the programming side :
https://greensock.com/docs/v3/GSAP/Timeline
So the actual anim/behavior is probably more usually refined after the pixel work is completed.