Why does my code not work? (Fade-in UI)

I’m trying to implement a script that allows my GUI (which is an image) to fade in after a set period for my menu screen sequence.

I’m a bit of a novice when it comes to scriptwriting :confused: I can read what the script means but can never seem to work out how to put it into action. This is the same, and I seem to be unable to pull off what I want. Whenever I try and implement a script that fades in a UI, it either stuffs up the rest of my code, or nothing happens.

I’ve searched YouTube for tutorials and tips, the Creator Documentation and even external dashboards to see if I can make sense of it but I’ve had no luck.

This is what my code looks like:

local remote = game.ReplicatedStorage.Menu
local ReplicatedFirst = game:GetService("ReplicatedFirst")
local menuGui = game.StarterGui.ScreenGui
local plr = game.Players.LocalPlayer -- Player
local cam = game.Workspace.CurrentCamera -- Current Camera
local camPartA = game.Workspace.CamPartA -- Camera facing signage
local camPartB = game.Workspace.CamPartB -- Camera facing spawn
local playButton = script.Parent.Play -- Playbutton
local pbImage = script.Parent.Play.ImageLabel
local logo = script.Parent.Logo -- Nostalgia logo
local background = script.Parent.Background -- The blue darkener
local blur = game.Lighting.Blur -- Blurs the menu screen
local menuTheme = script.Parent.titlemusic -- Roblox Xbox Music for the menu theme
local credit = script.Parent.Credit -- 'A game made by SBTechh'

-- Services
local tweenService = game:GetService("TweenService")

function mainMenu() -- Main functionality for the menu
	repeat
		cam.CameraType = Enum.CameraType.Scriptable
		wait(0.01)
	until cam.CameraType == Enum.CameraType.Scriptable
	
	menuTheme:Play()
	playButton.Visible = true
	pbImage.Visible = true	
	credit.Visible = true
	logo.Visible = true
	background.Visible = true
	blur.Enabled = true
	
	game:GetService("TweenService")
	local goal = {BackgroundTransparency = 1}
	local info = TweenInfo.new(1, Enum.EasingStyle.Cubic,Enum.EasingDirection.Out)
	local tween = tweenService:Create(background, info, goal)
	plr.CharacterAdded:Connect(function()
		background.BackgroundTransparency = 0
		tween:Play()
		wait(10)
		background.BackgroundTransparency = 1
	end)
	
	cam.CFrame = camPartA.CFrame
	

	
	local TInfo = TweenInfo.new(
		30,
		Enum.EasingStyle.Cubic,
		Enum.EasingDirection.Out,
		0,
		false
	)
	
	local angle = CFrame.Angles(math.rad(-15),math.rad((199)),math.rad(-10))
	
	local goal = {CFrame = CFrame.new(camPartB.Position) * angle}
	
	local cameraMove = tweenService:Create(cam, TInfo, goal)
	cameraMove:Play()

end

remote.OnClientEvent:Connect(function()
	mainMenu()	
end)

playButton.MouseButton1Click:Connect(function()
	playButton.Visible =  false
	credit.Visible = false
	logo.Visible = false
	background.Visible = false
	blur.Enabled = false
	menuTheme:Stop()
	
	cam.CameraType = Enum.CameraType.Custom
	
	
end)

I would greatly appreciate any help or advice! I am relearning after all and any help I could get would greatly aid me.

2 Likes

This code sets the transparency of the background to fully transparent and makes it visible. Then, it creates a Tween object that animates the BackgroundTransparency property from 1 to 0 over a period of 1 second. Finally,

– Services
local tweenService = game:GetService(“TweenService”)

function mainMenu() – Main functionality for the menu
– …

background.BackgroundTransparency = 1 -- Set transparency to fully transparent
background.Visible = true -- Make the background visible

-- Tween the BackgroundTransparency property to 0 over 1 second
local tween = tweenService:Create(background, TweenInfo.new(1, Enum.EasingStyle.Linear), {BackgroundTransparency = 0})
tween:Play()

-- ...

end

2 Likes