How do you make a fading intro text GUI?

Hi, I’m Tronsusu, I wanted to know how one would go about making a fading intro gui screen with text.

8 Likes

If you want just that text, you could use image labels. However, there is no native font that supports that glow effect you show. You could create a custom font with images for each letter - Yet the easiest way is singular images.

4 Likes

if you want the text or imagelabel to smoothly fade, use TweenService.

for example

local tweenService = game:GetService("TweenService")

local timeToFade = 1
local object = script.Parent --put the script inside TextLabel or ImageLabel
local tweenInfo = TweenInfo.new(timeToFade)
local goal = {}

--If you want to use TextTransparency
goal.TextTransparency = 1
--if you want to use ImageLabel to Transparent
goal.ImageTransparency = 1

local tween = tweenService:Create(object, tweenInfo, goal)
tween:Play()

17 Likes

Here is a post that can help. It uses a logo but you can easily make it text.

2 Likes

If you want to get actual fading text in your UI, go ahead and use the TextTransparency attribute to a text label.
You can use a while wait() loop to -0.1 from the transparency ever desired amount of seconds to get a smooth fade in/fade out effect. :smile:

2 Likes

No please.

Use TweenService, it superseded using loops for doing this kind of thing. Wherever possible, you should always choose a method that allows you to get an event-driven system and avoid loops. Use loops only when it’s absolutely necessary.

4 Likes

You can either use a for loop which constantly changes the transparency value by a given increment/integer, or what I would strongly suggest, is use the service called TweenService which can not only be used to tween/fade the transparency but also any other visual property/object. For the effect you are looking to achieve, you’d first have to establish an instance which declares a TweenInfo object, then you can parse the info in the Create() function using TweenService to acquire a TweenObject.

local TweenService = game:GetService("TweenService") -- Service
local GUI = script.Parent.Frame -- example object
local Info = TweenInfo.new(0.1, 'Sine', 'InOut') -- Increment/Integer + EaseStyle + EaseDirections 
local goal = { -- primary goal for tween, initiates fade for this example
       Transparency = 1 -- invisible basically
}

local Tween = TweenService:Create(gui, info, goal) -- invokement
2 Likes

Unfortunately, the EasingDirection and EasingStyle you provide have to be the Enumerations and not the string names in TweenService::Create.

1 Like

There are many methods how to fade out a text, but I reccommend using TweenService:

1 Like