How would i be able to create a super responsive ui like this?

Help and Feedback Scripting Support
#1

I want to basically know how i could make my script be as responsive as this cuss

Mine looks like that and it’s very buggy and not so responsive

local Tweenservice = game:GetService("TweenService")

local Info = TweenInfo.new(

0.1,

Enum.EasingStyle.Linear,

Enum.EasingDirection.Out,

0,

false,

0

)

--Shop Then

local ShopShopTween = Tweenservice:Create(script.Parent.Shop, Info, {Size = UDim2.new(0.334, 0,0.426, 0); Position = UDim2.new(0.157, 0,0.232, 0)})

local ShopStatsTween = Tweenservice:Create(script.Parent.Stats, Info, {Position = UDim2.new(0.535, 0, 0.232, 0); Size = UDim2.new(0.296, 0,0.388, 0)})

local ShopAutoclickTweenOff = Tweenservice:Create(script.Parent["Auto-click (Off)"], Info, {Position = UDim2.new(0.869, 0,0.232, 0); Size = UDim2.new(0.296, 0,0.388, 0)})

local ShopAutoclickTweenOn = Tweenservice:Create(script.Parent["Auto-click (On)"], Info, {Position = UDim2.new(0.869, 0,0.232, 0); Size = UDim2.new(0.296, 0,0.388, 0)})

local ReverseShopTween = Tweenservice:Create(script.Parent.Shop, Info, {Size = UDim2.new(0.296, 0,0.388, 0); Position = UDim2.new(0.157, 0,0.232, 0)})

local ReverseStatsTween = Tweenservice:Create(script.Parent.Stats, Info, {Position = UDim2.new(0.495, 0, 0.232, 0); Size = UDim2.new(0.296, 0,0.388, 0)})

local ReverseAutoclickTweenOff = Tweenservice:Create(script.Parent["Auto-click (Off)"], Info, {Position = UDim2.new(0.829, 0,0.232, 0); Size = UDim2.new(0.296, 0,0.388, 0)})

local ReverseAutoclickTweenOn = Tweenservice:Create(script.Parent["Auto-click (On)"], Info, {Position = UDim2.new(0.829, 0,0.232, 0); Size = UDim2.new(0.296, 0,0.388, 0)})

script.Parent.Shop.MouseEnter:Connect(function()

ReverseShopTween:Cancel()

ReverseStatsTween:Cancel()

ReverseAutoclickTweenOff:Cancel()

ReverseAutoclickTweenOn:Cancel()

ShopShopTween:Play()

ShopStatsTween:Play()

ShopAutoclickTweenOff:Play()

ShopAutoclickTweenOn:Play()

end)

script.Parent.Shop.MouseLeave:Connect(function()

ShopShopTween:Cancel()

ShopStatsTween:Cancel()

ShopAutoclickTweenOff:Cancel()

ShopAutoclickTweenOn:Cancel()

ReverseShopTween:Play()

ReverseStatsTween:Play()

ReverseAutoclickTweenOff:Play()

ReverseAutoclickTweenOn:Play()

end)

local StatsStatsTween = Tweenservice:Create(script.Parent.Stats, Info, {Size = UDim2.new(0.334, 0,0.426, 0); Position = UDim2.new(0.495, 0,0.232, 0)})

local StatsShopTween = Tweenservice:Create(script.Parent.Shop, Info, {Position = UDim2.new(0.136, 0,0.232, 0); Size = UDim2.new(0.296, 0,0.388, 0)})

local StatsAutoclickTweenOff = Tweenservice:Create(script.Parent["Auto-click (Off)"], Info, {Position = UDim2.new(0.869, 0,0.232, 0); Size = UDim2.new(0.296, 0,0.388, 0)})

local StatsAutoclickTweenOn = Tweenservice:Create(script.Parent["Auto-click (On)"], Info, {Position = UDim2.new(0.869, 0,0.232, 0); Size = UDim2.new(0.296, 0,0.388, 0)})

script.Parent.Stats.MouseEnter:Connect(function()

ReverseShopTween:Cancel()

ReverseStatsTween:Cancel()

ReverseAutoclickTweenOff:Cancel()

ReverseAutoclickTweenOn:Cancel()

StatsShopTween:Play()

StatsStatsTween:Play()

StatsAutoclickTweenOff:Play()

StatsAutoclickTweenOn:Play()

end)

script.Parent.Stats.MouseLeave:Connect(function()

StatsShopTween:Cancel()

StatsStatsTween:Cancel()

StatsAutoclickTweenOff:Cancel()

StatsAutoclickTweenOn:Cancel()

ReverseShopTween:Play()

ReverseStatsTween:Play()

ReverseAutoclickTweenOff:Play()

ReverseAutoclickTweenOn:Play()

end)

My current script looks like this.

1 Like
#2

I would probably try to create the tween into a function, then connect the functions to Button.MouseLeave and Button.MouseEnter.

#3

Your approach is very hardcoded, you should base it on events, like when player entered on a new icon, or when tween start again cancel the previous one.
You are kinda waiting for previous tweens to finish, just cancel them

#4 
local function onbutton(button)
    if button:IsA("ImageButton") then
        local up = game.TweenService:Create(button.UIScale, TweenInfo.new(0.25,Enum.EasingStyle.Quad,Enum.EasingDirection.Out),
            {Scale = 1.1}):Play()

        local down = game.TweenService:Create(button.UIScale, TweenInfo.new(0.25,Enum.EasingStyle.Quad,Enum.EasingDirection.Out),
            {Scale = 1}):Play()

        button.MouseEnter:Connect(function()
            up:Play()
        end)

        button.MouseLeave:Connect(function()
            down:Play()
        end)
    end
end

for _, button in pairs(buttons:GetChildren()) do
    onbutton(button)
end
buttons.ChildAdded:Connect(onbutton)