How to go about making a clicked GUI effect

Help and Feedback Scripting Support
,
#1

Saw this effect in a game, (also common in simulators) where when a GUI is clicked, some particles show up on the screen coming from it. See video.

How do I go about making this? How will I calculate the angles and the positions the particles will end at?

#2

Those particles are randomly spread around the cursor’s screen position, that’s all you’ll need.

#3

no they dont. they start at the center and tween to random positions. how do i calculate the random positions in a circular shape?

#4

Being as it’s random there are no calculations required.

tween to random positions

randomly spread around the cursor’s screen position

Exactly what I stated.

#5

how do i calculate the random positions in a circular shape?

#6

Here’s how you would calculate the random positions in a circular shape:

local an = math.random(0,360)
local mag = math.random(35, 70)
local x = math.sin(an) * mag
local y = math.cos(an) * mag

Then, just offset it via a newly made ImageLabel’s Position, and use the TweenService to create a standard tween instance to play for the label. Only the tween duration is required as everything else is automatically filled. Then, just repeat that protocol several times via a for i=1, 10 do loop.

Further details require researching how to use the TweenService and some understanding of using UDim2 values in Guis.

I would fully detail it all, but I am currently busy at the moment.

EDIT: @Forummer deserves the Solution mark on this one.

#7 
local Game = game
local Debris = Game:GetService("Debris")
local Tweens = Game:GetService("TweenService")
local Players = game:GetService("Players")
local Player = Players.LocalPlayer
local Mouse = Player:GetMouse()
local PlayerGui = Player:FindFirstChildOfClass("PlayerGui")
local ScreenGui = Instance.new("ScreenGui")
ScreenGui.Parent = PlayerGui

local _Random = Random.new()

local function OnClick()
	for _ = 1, 10 do
		local ImageLabel = Instance.new("ImageLabel")
		ImageLabel.Position = UDim2.new(0, Mouse.X, 0, Mouse.Y)
		ImageLabel.Size = UDim2.new(0, 15, 0, 15)
		Debris:AddItem(ImageLabel, 1)
		ImageLabel.Parent = ScreenGui
		
		local Tween = Tweens:Create(ImageLabel, TweenInfo.new(0.5), {Position = ImageLabel.Position + UDim2.new(0, _Random:NextInteger(-60, 60), 0, _Random:NextInteger(-60, 60))})
		Tween:Play()
	end
end

Mouse.Button1Down:Connect(OnClick)

The pattern isn’t even circular, it just appears as such as the cursor’s position is the center point.

6 Likes