how to do a moonwalk with transitions ?

Solar2D General Questions/Discussion
#1

Howdy Corona people,

has anyone ever (tried to) make a character do a moonwalk ? - while moving backwards ?
 

i’m trying to make a robot do the moonwalk, the problem is that i have 6 frames that look kinda ok when not moving backwards, but here is the problem:

to do a moonwalk, the tippy-toe foot must stay at the same place while the other one slides backward. Then the sliding one becomes the tippy-toe one and the previously standing one slides backwards etc… 

the problem is that the transition makes the entire character move therefore the tippytoe foot does NOT stay at the same place !

has anyone done that before and would be happy to share tips ?

thanks !

#2

You mentioned transition.  Are you using transitions to move it or are you treating it like a sprite and moving it frame by frame?

#3

If you can make a quick video to share, that would also be helpful.

#4

i’m using transitions to move it as the character has to move from one side of the screen to the other. Which is the problem as it makes the whole character shift when the tippy-toe foot should NOT move until it starts being the sliding foot.

i’ll try to put a video on

#5

i only read the title but maybe play the sprite (a forward walking animation) and then make add transition for the sprite to move back. SO it will create the illusion of a moonwalk.

#6

It seems like you need a non-linear transition. You can try breaking up the transition into lots of little transitions triggered by certain animation frames.  You could then try applying easing to some smaller transitions.

#7

getting there … 

the trick is to create the frames relative to the tippytoe foot (that doesnt move). then each movement of the body must be the same # of pixels so a timer (instead of a transition) can move the pix by -10pixels

i’m nearly there … not quite Michael Jackson yet but working on it.

will publish the result when done.

and btw… there is a great tutorial on the moonwalk at 

https://twistedsifter.com/2013/09/how-to-moonwalk-animated-gifs/

but i’m too old for the real thing … just trying to animate it ! :wink:

#8

It would take some work and physics but I bet you could make an awesome moonwalk with Spine

Maybe you can find a workable demo of a moonwalk or similar puzzle.

#9

ok, as promised, here is the (nearly) final result 

I did it with 8 frames. 4 with each foot. could do with more for more smoothness but … 

the trick is to have every frame the same WIDTH (*) and have the frames align the tippy-toe foot (first 4 frames on the right foot (blue) and 4 next frames on the left foot (brown)

Also the distance of the body (without legs) has to be the same between frames.

So for the duration of the 8 frames, do NOT move it in corona. When the sequence is finished, then move the frame backward about 2/3 of the frame size to align with the next foot again.

(*) now the problem is that png with transparency will not be the same width as the body/legs are of different size.

So i had to add a dot at the start and end of the frame. This way they all end up the same width.

(unfortunately it seems we’re not allowed to upload mp4 so I can’t show you the result !)