Fade out a lot of UI objects at the same time?

How can I fade out a lot of Ui elements at the same time?
This is what I have right now:


Here is the relevant code:

function explodeParticles()
	for i=1, #explodeParticlesTable do
		local x = math.random(0,100)/100
		local y = math.random(-20,120)/100
		local r = math.random(20,180)
		explodeParticlesTable[i].ImageTransparency = 0
		explodeParticlesTable[i]:TweenPosition(UDim2.new(x, 0, y, 0),"Out","Quint",4)
		explodeParticlesTable[i].Rotation = math.random(0,180)
	end
end

function cleanupExplodeParticles()
	for i=1, #explodeParticlesTable do
		for a=1, 3 do
			explodeParticlesTable[i].ImageTransparency = explodeParticlesTable[i].ImageTransparency + 0.34
			wait()
		end
		explodeParticlesTable[i].Position = UDim2.new(0.5, 0, 0.5, 0)
	end
end
------------------
wait(2)
explodeParticles()
wait(5)
cleanupExplodeParticles()

There are multiple ways;

  1. You could use a frame in which the particles are created, you then could fade them out at the same time. Con is that they are al faded out at the same time.
  2. In the cleanUpExplodeParticles(), check for every particle where the nearest border is, and tween the position of the partical to just beside the border, so they dissapear (ofcourse delete them after that).
  3. Same thing, but instead of checking where the nearest border is, check how far away they are from the bottom of the screen, and calculate the fall time, so they all dissappear at the bottom on the same time
  4. Change what you have done now: instead of doing for a=1,3 do and then change the imagetransparency: do a tween on the imagetransparency, instead of this loop; it will make it look a lot more smooth. More info on tweens (TweenService) here.
local ts = game:GetService("TweenService")
function explodeParticles()
	for i=1, #explodeParticlesTable do
		local x = math.random(0,100)/100
		local y = math.random(-20,120)/100
		local r = math.random(20,180)
		explodeParticlesTable[i].ImageTransparency = 0
		explodeParticlesTable[i]:TweenPosition(UDim2.new(x, 0, y, 0),"Out","Quint",4)
		explodeParticlesTable[i].Rotation = math.random(0,180)
	end
end

function cleanupExplodeParticles()
	for i=1, #explodeParticlesTable do
		local fade = ts:Create(explodeParticlesTable[i], Tweeninfo.new(.5), {BackgroundTransparency = 1})
                fade:Play()
                fade.Completed:Connect(function()
        		explodeParticlesTable[i].Position = UDim2.new(0.5, 0, 0.5, 0)
                end)
	end
end
------------------
wait(2)
explodeParticles()
wait(5)
cleanupExplodeParticles()

Try this ^
Edit: i didn’t write it in studio so you might have to debug it a bit