HOME | DD

SqdPxl β€” sprite bounce mini tutorial

#animated #animation #gif #pixel #tutorial #art
Published: 2016-12-18 01:38:27 +0000 UTC; Views: 12763; Favourites: 496; Downloads: 48
Redirect to original
Description

somebody requested a tutorial for these, so here's my attempt to explain my process c: I HOPE THIS ISN'T CONFUSING LOL

(Image text:

#1 Front reaches highest position, butt going up
#2 Front goes down, butt still going up
#3 Front still going down, butt catches up with front and starts going down too
#4 Front and back going down
#5 Front bounces back up, butt still going down
#6 Front still going up, butt catches up with front and starts going up too)

SO BASICALLYΒ the different parts of the body move at different rates, with some parts leading and other parts trailing behind. When one part changes direction, it takes a second for the other parts to catch up. So, when the upper body is bouncing up, the butt follows along, and when the upper body starts to drop, the butt continues its upward motion slightly before it starts to drop as well.

You can also have the head, ears, tail, or accessories follow along as well. Mostly I just screw around until I get something that looks right. I don't always get it exactly correct(the hair and ears on mr. red guy here are a little odd) but practice makes perfect. :>







I do my art in sai and animate in aseprite.
Related content
Comments: 29

Snakeinabasket [2020-11-25 05:03:40 +0000 UTC]

πŸ‘: 1 ⏩: 0

SphinxStudio [2019-01-12 22:44:57 +0000 UTC]

yes this is very helpful, thank you!!

πŸ‘: 0 ⏩: 0

TobyInks [2017-11-30 07:50:39 +0000 UTC]

Do you do customs at the moment?

πŸ‘: 0 ⏩: 1

SqdPxl In reply to TobyInks [2017-11-30 13:03:18 +0000 UTC]

I'm not open for commissions at the moment, but when I am I sell these kinds of sprites for $30! Here's a more recent example:Β 

πŸ‘: 0 ⏩: 1

TobyInks In reply to SqdPxl [2017-11-30 20:27:48 +0000 UTC]

Oh, thank you! I will think about it.

πŸ‘: 0 ⏩: 0

JiggyJaggy [2017-01-14 15:51:35 +0000 UTC]

Ahhh very handy, I do love bouncing animations and wanted to try something where the front/back bounce in a flow type motion, will need to try this out sometime soon!

πŸ‘: 0 ⏩: 0

Senkaima [2017-01-14 10:52:51 +0000 UTC]

is this ok?Β senkaima.deviantart.com/art/bo…

πŸ‘: 0 ⏩: 1

SqdPxl In reply to Senkaima [2017-01-14 11:35:53 +0000 UTC]

you've got the basic idea! when I'm doing sprite bounces I select and move parts of the finished sprite instead of drawing each frame from scratch and then finishing it. c: gyazo.com/cafb6d723143b6e9cffd…

πŸ‘: 0 ⏩: 2

Senkaima In reply to SqdPxl [2017-01-14 14:12:36 +0000 UTC]

I've got my second attempt with the bouncing:Β senkaima.deviantart.com/art/bo…

I think the first one was smoother tho .<.

πŸ‘: 0 ⏩: 1

SqdPxl In reply to Senkaima [2017-01-14 16:43:22 +0000 UTC]

yeah, at this point it's just more experimenting to see what works for you c: You could try bending the tail more to make the wag look more natural.Β 

πŸ‘: 0 ⏩: 1

Senkaima In reply to SqdPxl [2017-01-14 23:00:49 +0000 UTC]

ok o3o

πŸ‘: 0 ⏩: 0

Senkaima In reply to SqdPxl [2017-01-14 11:53:23 +0000 UTC]

Im fine with just drawing them lol


cuz I have meh sistahs tableyt n' all

but Im really fine with just drawing them :3

lemme just try it, to see which one's easier owo

but wait, there's more.

my painting software uses different layers to get the animation, so I'll have to copy paste alot

πŸ‘: 0 ⏩: 0

toothbytes [2017-01-08 21:44:30 +0000 UTC]

This look ok? I'll add ear and fur physics when i have time

πŸ‘: 0 ⏩: 1

SqdPxl In reply to toothbytes [2017-01-09 05:37:56 +0000 UTC]

yup, looks good to me! from there it's just a matter of continuing to experiment to see what looks good c:

πŸ‘: 0 ⏩: 1

toothbytes In reply to SqdPxl [2017-01-09 16:01:00 +0000 UTC]

Yup ^^ thanks. Gonna animate fur and ears to when I have time ahh

πŸ‘: 0 ⏩: 0

PalieFox [2017-01-03 10:59:34 +0000 UTC]

Thank you for this tutorial!!
I LOVE YOUR PIXEL ART! <3

here is my horrible try at bounce pixel animation:
sta.sh/21ke37d5r4zq

It looks like rubbish XD

πŸ‘: 0 ⏩: 1

SqdPxl In reply to PalieFox [2017-01-03 11:09:37 +0000 UTC]

AA TY I'M GLAD YOU FOUND IT HELPFUL and it looks like you've got the basic motion down! from there it's just refining it c:

πŸ‘: 0 ⏩: 1

PalieFox In reply to SqdPxl [2017-01-03 11:18:37 +0000 UTC]

:3
Ah! Thanks!
Ill try and do another one and refine it later

πŸ‘: 0 ⏩: 0

Shalmons [2016-12-18 03:31:25 +0000 UTC]

HMMM
**tucks away for whenever i feel brave enough to animate**

πŸ‘: 0 ⏩: 0

equinnoxious [2016-12-18 03:27:08 +0000 UTC]

yeeesssss this is perfect!!! i always wondered how you made the bounces so nice. thank you for this!!

πŸ‘: 0 ⏩: 0

StarSpangledSleuth [2016-12-18 03:02:51 +0000 UTC]

Bless you

πŸ‘: 0 ⏩: 0

Frostpeltwolf [2016-12-18 02:42:15 +0000 UTC]

Hhh hun thank you ;v;!! This is gonna help a lot of people~

πŸ‘: 0 ⏩: 0

Sneaky-Bean [2016-12-18 02:15:24 +0000 UTC]

This is great!!!!!!!!!!!!!!!


//begs for more pixel tuts

πŸ‘: 0 ⏩: 1

SqdPxl In reply to Sneaky-Bean [2016-12-18 02:28:29 +0000 UTC]

tyy! 8D i hope to do more soon

πŸ‘: 0 ⏩: 0

Some-Maniac [2016-12-18 01:45:21 +0000 UTC]

its a tiny bit confusing, but id love to see more tutorials from you :0

πŸ‘: 0 ⏩: 1

SqdPxl In reply to Some-Maniac [2016-12-18 01:51:19 +0000 UTC]

yeah, it's one of those things that's kind of hard to explain in words haha. probably the best thing to do is pick some animations you like and click through them frame by frame in an animation program so you can try to get a sense of what's going on.

πŸ‘: 0 ⏩: 0

PainterPup [2016-12-18 01:45:17 +0000 UTC]

This is really helpful, thank you! .o.

Also, may I ask if Aseprite is free?

πŸ‘: 0 ⏩: 1

SqdPxl In reply to PainterPup [2016-12-18 01:49:03 +0000 UTC]

it has a free trial version, but it won't let you save anything as a gif without the full version, which costs $15-ish c:Β 

πŸ‘: 0 ⏩: 1

PainterPup In reply to SqdPxl [2016-12-18 01:54:54 +0000 UTC]

Ah, okay. Thank you! :>

πŸ‘: 0 ⏩: 0