Lesson 01 of 03
Build the Click Button
The heart of every clicker game — a button that feels great to press.
A great click button has
- Visual feedback (shrinks on press, pops back)
- Sound effect (satisfying click SFX)
- Floating '+1' text that flies up and fades
- The actual coin increment
We build it in layers. Start with the mechanic, then layer on the juice.
luau
1-- StarterGui/MainGui/ClickButton (LocalScript inside the button)
2local button = script.Parent
3local TweenService = game:GetService('TweenService')
4local ClickEvent = game:GetService('ReplicatedStorage').Events.ClickButton
5
6-- Visual feedback
7local function animateClick()
8 local shrink = TweenService:Create(button,
9 TweenInfo.new(0.08, Enum.EasingStyle.Quart, Enum.EasingDirection.Out),
10 {Size = UDim2.new(0, 180, 0, 180)}
11 )
12 local grow = TweenService:Create(button,
13 TweenInfo.new(0.15, Enum.EasingStyle.Back, Enum.EasingDirection.Out),
14 {Size = UDim2.new(0, 200, 0, 200)}
15 )
16 shrink:Play()
17 shrink.Completed:Connect(function() grow:Play() end)
18end
19
20button.MouseButton1Click:Connect(function()
21 animateClick()
22 ClickEvent:FireServer()
23end)
READY · 23 lines