TweenService Basics
TweenService is one of the best ways to add smooth animations to your Roblox game – without needing to manually update properties every frame. Whether you want to move parts, fade UI elements, or scale objects, it is all posible with TweenService
Tweening is short for “in-betweening” – it means smoothly changing a property from one value to another over time.
TweenService lets you animate properties like:
.Position.Size.Transparency.Color- etc.
You just tell it what you want to change, how long it should take.
To create a new tween we start by getting the service itself, where we then after can call the :Create() function on the service. We often store this part inside a variable so we can play the animation later.
TweenService:Create() takes:
- The object you want to tween
- A TweenInfo object (explained below)
- A table of goal values – what you want to animate toward
local TweenService = game:GetService("TweenService")
local tweenInfo = TweenInfo.new(1)
local goal = { Transparency = 0.5 }
local tween = TweenService:Create(someObject, tweenInfo, goal)
To play the tween we can use tween:Play(), and to stop it again use tween:Stop(). Note when the tween is finished it will automatically stop.
local TweenService = game:GetService("TweenService")
local tweenInfo = TweenInfo.new(1)
local goal = { Transparency = 0.5 }
local tween = TweenService:Create(someObject, tweenInfo, goal)
tween:Play()
TweenInfo
TweenInfo controls how the animation behaves. It is used to set the length of the animation, the easing style and direction, repeat count, if it should reverse and delay time.
Below you can see how it is structured:
TweenInfo.new(
1, -- time, how long the tween lasts (in seconds)
Enum.EasingStyle.Sine, -- how the motion feels (e.g. smooth, bouncy)
Enum.EasingDirection,InOut, -- in/out/inOut
0, -- how many times to repeat (0 = no repeat)
false, -- true to reverse after finishing
0 -- delay before starting
)
You can use different easing styles like
Enum.EasingStyle.Bounce
Enum.EasingStyle.Linear
Enum.EasingStyle.Sine
Examples
local TweenService = game:GetService("TweenService")
local part = workspace.Part
local goal = {}
goal.Position = part.Position + Vector3.new(0, 10, 0)
local tweenInfo = TweenInfo.new(1.5, Enum.EasingStyle.Sine, Enum.EasingDirection.Out)
local tween = TweenService:Create(part, tweenInfo, goal)
tween:Play()
local frame = script.Parent:WaitForChild("Frame")
local goal = { BackgroundTransparency = 1 }
local info = TweenInfo.new(1)
local tween = TweenService:Create(frame, info, goal)
tween:Play()
If you’re new to scripting, TweenService is a great tool to learn – and it’s used in almost every game on Roblox.
