How do I improve my GUI animations script?

Hello Developers,

I’m here to talk about GUI animations. So basically, what I want is to make a really good animation script for GUIs such as buttons and frames. However, it seems like my animations are not smooth and clean whenever I create the animation script for a GUI. I’m just wondering if you guys have some tips so that I can improve my animation scripts for the GUIs.

Sample 1:

local TweenService = game:GetService('TweenService')

local Info = TweenInfo.new(
    0.3, -- Increase duration for a smoother effect
    Enum.EasingStyle.Quad, -- Use a different easing style for a smoother transition
    Enum.EasingDirection.InOut,
    0,
    false,
    0
)

local AnimScale = script:WaitForChild('AnimScale')
AnimScale.Value /= 1000

local function playTween(tween)
    tween:Play()
    return tween.Completed:Wait()
end

local function animateButton()
    local startSize = script.Parent.Size
    local newSize = UDim2.fromScale(startSize.X.Scale + AnimScale.Value, startSize.Y.Scale + AnimScale.Value)

    local ShrinkAnimOpen = TweenService:Create(script.Parent, Info, {Size = newSize})
    local ShrinkAnimClose = TweenService:Create(script.Parent, Info, {Size = UDim2.fromScale(startSize.X.Scale - AnimScale.Value, startSize.Y.Scale - AnimScale.Value)})
    local DefaultAnim = TweenService:Create(script.Parent, Info, {Size = UDim2.new(0.1, 0, 0.09, 0)})

    script.Parent.MouseButton1Down:Connect(function()
        playTween(ShrinkAnimClose)
        playTween(DefaultAnim)
    end)

    script.Parent.MouseEnter:Connect(function()
        playTween(ShrinkAnimOpen)
    end)

    script.Parent.MouseLeave:Connect(function()
        playTween(ShrinkAnimClose)
        playTween(DefaultAnim)
    end)
end

animateButton()

Are you tweening on the client?

Yes, I’m always tweening GUIs on the client-side.