Lesson 01 of 05
What is a Tween?
Tweens interpolate a property from one value to another over time — the foundation of all animation.
A tween smoothly animates a property between two values. Without tweens, things pop — they jump instantly. With tweens, they flow.
TweenService is the built-in Roblox engine for this. Every UI animation you've loved in a Roblox game used TweenService.
Key components
- TweenInfo — defines duration, easing style, direction, repeat count, delay
- TweenService:Create(instance, tweenInfo, goals) — builds the tween
- tween:Play() / tween:Cancel() / tween:Pause()
The goals table is a dictionary of property name → target value.
luau
1local TweenService = game:GetService('TweenService')
2
3local part = workspace.SomePart
4
5local tween = TweenService:Create(
6 part,
7 TweenInfo.new(
8 0.5, -- duration
9 Enum.EasingStyle.Quart, -- style
10 Enum.EasingDirection.Out -- direction
11 ),
12 { Position = Vector3.new(0, 10, 0) } -- goal
13)
14
15tween:Play()
16tween.Completed:Connect(function()
17 print('Animation done!')
18end)
READY · 18 lines