How can I create a 2D explosion?

Help and Feedback Scripting Support
#1

Hello, I have been working on an egg hatching system and I was wondering how can I make a 2D UI explosion like this one:


I know this uses tween service but I was wondering how can I make it go from the middle and tween everywhere on the screen.
Thank you!

1 Like
#2

It seems to be a ViewportFrame (which renders 3D objects in a 2D screen).

1 Like
#3

ViewportFrames don’t work with particles.

1 Like
#4

What if you use shiny mesh or change it for images?

#5

VideoFrame??

#6

You can’t upload your own video.

#7

Neon does not display in viewportFrames.

#8

Make some ImageLabels, place them in the middle, pick some random points on the screen to tween to, and then tween the transparency, size, and position at the same time.

Which part are you having trouble with?

1 Like
#9

I think they are struggling to figure out how to get that “glow” effect. You can’t upload your own videos, particles don’t work in viewport frames and neither does neon. I’m out of ideas as well.

#10

I didn’t know how to choose random location choosing and like @synical4 said the I am struggling with the glow effect.

#11

They “weld” a part onto the camera with an offset and make use a particle emitter, they probably have another part behind the particles with the egg hatching.

4 Likes
#12

I did a script a while back that would choose a random position. I dug it up for this post from an old game:

local rand = Random.new()

local function GetRandomPositionOnScreen()
    return UDim2.new(rand:NextNumber(0,1),0,rand:NextNumber(0,1),0)
end

Edit: To use, simply do something like:

local randomPositon = GetRandomPositionOnScreen() -- auto returns the position
1 Like
#13

Sorry, but I don’t understand what do you mean with welding a part to the camera with an offset.

#14

So basically, you have an invisible part with a particle emitter inside of it. On the client / local script, make sure it is anchored and set it’s cframe to the camera’s. On your screen, there is now a particle emitter “inside” the camera. It would be better than doing the random position with the image labels.

1 Like
#15

It isn’t necessarily ‘welding’ as @KJry_s said, it’s really just offsetting a Part from the Camera’s CFrame every RenderStep. From there, you could make a ParticleEmitter and call :Emit(). In order to get the glowing effect, you could tinker around with the ParticleEmitter’s properties (like LightInfluence and LightEmission).

Obviously, this should all be done on the client (otherwise wonky things are bound to happen). Good luck creating your game.

1 Like
#16

But I would have to set the CFrame of the camera?

#17

No, if done right, the part should always stay attached to the Camera, regardless of the camera’s CFrame.

1 Like
#18

Addition to my previous post:

They could use the particle texture with most of them having random end sizes then adding attributes called Velocity to all of the UIParticles and then basically doing this:

local RunService = game:GetService("RunService")

for _, Particle in pairs(Particles) do
   Particle:SetAttribute("Velocity", Vector2.new()) -- Would be a randomized Vector3
end

RunService.Heartbeat:Connect(function(dt)
   for _, Particle in pairs(Particles) do
      local Velocity = Particle:GetAttribute("Velocity") -- Vector2
      Particle.Positon = UDim2.new(0.5, Particle.Positon.X.Offset + dt * Velocity.Y, 0.5, Particle.Positon.Y.Offset + dt * Velocity.Y)
   end
end)

Instead of this you could use the same principal instead you’d get the end result and tween it towards the end position, size and transparency.

1 Like