Creating a Firework Type Particle in a Ui

Hey there reader!
I’m quite new to the DevForum, or at least the creating topic side of things, and I need some help on a particular subject.

So, I love playing around with Ui, and making new discoveries while designing certain things, but one thing baffles me for sure, and it’s the way how this particle effect inside a Gui, looks as clean as it is:


(Sorry for the terrible Gif quality throughout this post)

Now, I’ve gone and done some research on this specific thing, and I’ve found rParticle, located here which sort of does what I want to, see, here’s my code for the particle example itself:

wait(.25)
local Frame = script.Parent.Parent.Parent
Frame.BackgroundTransparency = 0
local t = 5
local tick = tick
local fromHSV = Color3.fromHSV
local RunService = game:GetService("RunService")
RunService:BindToRenderStep("Rainbow", 1000, function()
local hue = tick() % t / t
local color = fromHSV(hue, 1, 1)
Frame.BackgroundColor3 = color
end)

And it ends up looking like this:
(Not quite as I imagined it.)

If any of you have any idea how I could replicate something like I showed in the first Gif, or can give any guidance it would be great. Yea, I know how the good ol’ TweenService() works, but when it comes to using math.random, and that kind of wizardry, I’m a bit stuck.

Thank you for reading! :upside_down_face:

2 Likes

Maybe have it so it expands from the unit circle so like the x and y and based from the cosine and sine and the thing u scale it by is a random value which is higher than the last one

You will notice a couple of things with the first GIF that you are not seeing in the second.

  1. There are two particle emitters. One for the trail on the way up and one for the explosion at the end.

  2. The particles in the first GIF have a emit with slight variations in size.

  3. From my view, it looks like the particles in the first GIF have no outline, while the 2nd GIFs particles do which is making it look a bit muddy.

1 Like