How can i make a cooldown system witha gui?

I’ve tried everything well thats what i think

how can i make this https://gyazo.com/4415fe6dd72738154bbc2e707df60770

Tweens would make this really really easy.

I made a function specifically for tweening anything, really easy to use…

local tweenn
local function tween(Part,Prop,Val,timing,TweenType) -- credits to greatneil80
local TweenService = game:GetService("TweenService")
local goal = {}
goal[Prop] = Val
if timing then
    local tweenInfo
    if TweenType then
        tweenInfo = TweenInfo.new(timing,Enum.EasingStyle[TweenType])
    else
        tweenInfo = TweenInfo.new(timing)
    end
    tweenn = TweenService:Create(Part, tweenInfo, goal)
else
       local tweenInfo = TweenInfo.new(5)
    tweenn = TweenService:Create(Part, tweenInfo, goal)
end
return tweenn:Play()
end
tween(workspace.Part,"Transparency",1,3,"Quad")

You could just have a frame for the original perk, and the cooldown bar would another frame inside of the first. The bar would not be visible at first.

Using events, you could then make the cooldown bar visible, then adjust its :TweenSize() to move across as if the perk ability were “cooling down”.

Just an idea.