Making realistic 2d ball bounce in ui

Help and Feedback Scripting Support
#1

Hello! I tried to tween a ball to bounce up and down but it doesnt look realistic. Are there any easing styles or anything I can do to my code to fix this? Here is my code:

spawn(function()
	while script.Parent.Enabled == true do
		local tween = script.Parent.Background.ImageLabel:TweenPosition(UDim2.new(0.448, 0,0.414, 0), Enum.EasingDirection.InOut, Enum.EasingStyle.Linear, timez)
		wait(timez)
		script["bounce boing sound effect"]:Play()
		local tween = script.Parent.Background.ImageLabel:TweenPosition(UDim2.new(0.447, 0,math.random(0.2, 0.3), 0), Enum.EasingDirection.InOut, Enum.EasingStyle.Linear, timez+0.3)
		wait(timez+0.3)
	end
end)
#2

You’re using Enum.EasingStyle.Linear which isn’t realistic because in real life when you throw a ball up in the air; it gets faster as it goes down cuz the Potential Energy (PE) transfers to Kinetic Energy (KE) which makes it faster as it comes down eventually to a halt.

I’d recommend trying Enum.EasingStyle.Back as it goes a bit further than it’s target then moves back. Here’s an example of it in action form another DevForum post:

1 Like
#3

Thanks a lot bro :pray: But Should I change the easing style for both of them or just going down?

1 Like
#4

I’m not sure, I’d suggest trying the down one first but you can experiment to see which one is best.

#5

use Enum.EasingStyle.Bounce for the easing style

#6

Going off of Kurookku’s post, Roblox has a really cool built-in easing style called bounce. I hope that this is what you’re looking for…

Here is the modified script:

local timez = 0.5

local tweenService = game:GetService("TweenService")
local tweenDown = tweenService:Create(script.Parent.Background.ImageLabel, TweenInfo.new(timez, Enum.EasingStyle.Bounce, Enum.EasingDirection.Out), {Position = UDim2.new(0.448, 0,0.414, 0)})
local tweenUp = tweenService:Create(script.Parent.Background.ImageLabel, TweenInfo.new(timez, Enum.EasingStyle.Circular, Enum.EasingDirection.Out), {Position = UDim2.new(0.447, 0, math.random(0.2, 0.3), 0)})

while script.Parent.Enabled == true do
	tweenUp:Play()
	wait(timez)
	script["bounce boing sound effect"]:Play()
	tweenDown:Play()
	wait(timez)
end

And here is a short video showing how it looks!

1 Like