How to Create Cool Bounce Effects Using a Loop

In this video we'll build an easing function for a bounce. This could be used in a game, or a UI to make objects or elements bounce realistically. There are a few different ways to do this. In this video, we'll use a loop to add bounces.

========== Timetable =================

0:00 - Intro
1:06 - Hardcoded Bounce Desmos
5:22 - Hardcoded Bounce Shadertoy
7:06 - Visualize Graph
10:20 - Building the Loop
18:49 - Geometric Series
20:40 - Attenuation
21:55 - Normalizing Length
23:58 - Fixing Floating Point Error
25:21 - Outro

========== Social Media Links ==========

Twitter: @The_ArtOfCode

========== If you want to follow along ==========

Starting point:
End point:

========== Other videos to watch ==========

[realcygnus]

So cool ! These tuts are always truly priceless, can't wait for the next one, whatever it is. 👍

[fyisic]

Beautiful! Easy to follow and very informative as usual.

[curiouspers]

Very cool! Looking forward for the next one!

[tidatida]

Works very well in a fuse of Blackmagic fusion. Thanks for this great tutorial and very effective code

[alejmc]

I think this would work incredibly great with ‘fake particles’ moved on a vertex shader colliding over a flat predefined height plane… just need to adapt the bounce loop to take into account different starting height points. And actually just offsetting and clipping the curve function would make it look like a particle got shot downwards, upwards or ‘released’ (like the current example actually does).

[RequiteFahrenheit]

If you could simply make these videos every week...😊

[tidatida]

At line 54 you can add if (x < 0.5) val = -val; to get the nicely flipped version, which is also often desired...

[olli]

could you adjust the bounce heights by ball weight? set ball weight by size / density?

[marcthenarc]

Me: "Grab your laptop ...", Ha! This is so 2010s, I'm going to use my phone ...
Me, 15 minutes later: I see your point ...

[thesupermanking]

Could you give a hint why the logarithm will be part of the smarter solution? I'd like to try to find out myself before your video comes out <3

[vzzzk]

What do you think about y = abs(cos(x*pi*n))*(1-x) ?

[syntax_error]

thanks for this video, i never know when i must use mathematical formula or when i need to do a more classic approach like
if ball.x > border ... direction *= -1;
that's hard to know the difference beetween gpu and cpu programing ... and efficienty in game ready shader ... AHHH
anyway thanks