How to tween more smoothly? Smooth start and finish

Hey, so here’s all of the TweenStyle's there are:

But my issue is that all of these either have an abrupt start or an abrupt end.

I would like that graph to look like this:
2

Slow at the beginning, fastest in the middle, and then slow at the end; so that I can loop it over and over seamlessly.

Let’s say this is my code:

local TweenService = game:GetService("TweenService")
local Info = TweenInfo.new(1)

local Value = Instance.new("NumberValue")
Value.Value = 0
local Tween = TweenService:Create(Value, Info, {Value = 10})
Tween:Play()

How can I make the number value tween from 0 to 10 slow at the start and end, and faster in the middle?

Thanks!

2 Likes

i’m not sure if you can tween values in number values

TweenService uses EasingDirections, if you haven’t noticed. Here’s an article on it. EasingDirection | Documentation - Roblox Creator Hub

To put it simply, EasingDirection of In is shown in your first image, Out is the reflected opposite, and InOut is a mix of both, similar to what you are trying to achieve.

1 Like

Right, I’ve been working with InOut, but the issue is still that you have to combine that with on of the possible EasingStyles, and it just doesn’t add up to perfectly smooth on both ends.

That’s the wonderful thing about TweenService friend, you can tween anything, you can literally tween boolvalues.

InOutSine
You can use EasingStyle.Sine with EasingDirection.InOut. You probably will not get any better than that unless you write your own/modify an easing function.

You may have to use sin or cos. These are what you’re sort of trying to go for but you should be able to make it work if done correctly.
image

6 Likes