UIEmitter Module - UI Particles [Version 2: recoded update]

Rylvns · April 5, 2024, 4:36am

I’ve made a new impactful module to make your UI designs come to life - introducing UIEmitter!

LATEST UPDATE

With UIEmitter you could:

Create celebratory confetti explosions for victories and milestones or even purchases.
Shower players with stars or sparkles when they level up or achieve a goal.
Mimic fire, smoke, rain, or magical auras within UI components.
Add gentle animations or moving patterns behind menus and screens.
Use shimmering effects or subtle trails to highlight important information.
Create subtle particle bursts on button clicks or hovers.

Version 1 usage & examples

Setup:

local UIEmitter = require(game.ReplicatedStorage:FindFirstChild("UIEmitter")) -- get & require the module
local Emitter = UIEmitter.New() -- create a new screen gui dedicated to these emits

Example usage:

Emitter:Emit({
	Size = Vector2.new(10, 10),
	Position = Vector2.new(0, 0),
	Acceleration = Vector2.new(0, 0),
	Gravity = Vector2.new(0, 0),
	FrictionCoefficient = 1,
	LifeTime = 4,
	Properties = {},
	FadeIn = {
		Duration = 1,
		EasingStyle = Enum.EasingStyle.Linear,
		EasingDirection = Enum.EasingDirection.InOut,
		TweenProperties = {},
	},
	FadeOut = {
		Duration = 1,
		EasingStyle = Enum.EasingStyle.Linear,
		EasingDirection = Enum.EasingDirection.InOut,
		TweenProperties = {},
	},
	Texture = "",
});

(V2)

Would you use this?

Definitely!
Yes, when I get the chance to.
I’m not sure.
Probably not.
No, sorry.

0 voters

What do you think about UIEmitter?

Love it! Super easy to use and looks great.
Seems promising, but I’d like to see more features.
Fun to experiment with, not sure if it’s essential for my projects.
I wish it integrated better with my existing UI workflow.
Too complex for my needs.
I’ve encountered some bugs/performance issues.
Not worth the effort compared to other solutions.

0 voters

SavAlt17 · April 5, 2024, 8:47am

make a github repository about this, it would be way easier to give feedback!

edit: are you going to try and multi-thread this code for performance?

JunisL0L · April 6, 2024, 4:08am

This is byfar one of the most unique modules out there I am 100% going to use this in the evorooms development!

OVERKILLCREATIONS · April 6, 2024, 5:38am

Is it possible for the module to create an outline effect similar to what’s shown here?

Rylvns · April 6, 2024, 4:47pm

Those effects are for buttons, not for particles. Although I don’t know what you’re trying to show me since there’s multiple effects in that message.
Can you be more specific?
Thanks.

Rylvns · April 9, 2024, 11:55pm

New version: Version 1-cb

Added

UIEmitterModule.From(<GuiObject>)
This can be used on the server, and client. It’s used for gui objects like SurfaceGui and BillboardGui.
Some code optimization.

Roblox Marketplace

I’m getting an error when I try to distribute the module on marketplace. So I’m not sure if you can even get it. This is why I created the GitHub Repository.

If you want anything else to be added please tell me. I can’t read your mind.

Rylvns · May 26, 2024, 1:01am

New version: Version 1-ea

Changelog
Added:

Emit presets.
I’ve added a default preset called “Confetti”.
More default presets will be added in future versions.
Performance upgrades.

Fixed:

FadeIn & FadeOut tweens not playing.
Memory leaks.

How to use
Setup:

Look inside the default Confetti preset module for an example of how to make your own preset.

Usage:

Emitter:EmitPreset(Preset, Configs)

Example usage:

Emitter:EmitPreset("Confetti", {
	Size = Vector2.new(3, 5),
	Position = Vector2.new(100, 200),
	ShootToPosition = Vector2.new(100, 100),
	AccelerationFraction = 10,
	Gravity = Vector2.new(0, 0),
	FrictionCoefficient = 1.02,
	LifeTime = 1.3,
});

Get Version 1-ea
Roblox Creator Store

imloadingdot2 · May 26, 2024, 1:59am

Community: “wE wAnt pArtIcLe rEnDeRiNg iN vIeWpOrT fRaMeS ”
This dude:

But fr this module is real cool, good work man

IrisYouLuck · July 26, 2024, 9:59pm

You mind showing the confetti example???

Is there a WIKI or documentation for this? How about more effects or showcase how effects can be created and utilized?

Rylvns · August 5, 2024, 3:32am

I gave you the emit code example. That’s all you should need.

I created the confetti preset, if you’re a scripter you would know what to do by learning how I did my preset.

oke_dokie · October 30, 2024, 12:05am

Awesome module, lots can be built from this.

Ended up modifying the module slightly so Screen GUIs do get cleaned up after all particles are destroyed.

Would be neat to see a couple different presets, do you have this in source control anywhere? (git link dead)

Rylvns · October 30, 2024, 11:00pm

no i dont :<, my git got suspended

ill add like a :Destroy() thing for the next version that would be good probably

i agree, thanks

Rylvns · June 6, 2025, 5:16am

UIEmitter v2-ab

What’s New

Fully rewritten for performance and flexibility.
Properties are now like ParticleEmitter.
Support for NumberSequence & ColorSequence.
Pass randomized values directly as properties.
Unified Emit() function - no server/client split.
More features and cleaner API.

Feature Breakdown

Random Number Ranges
You can pass a {Min, Max} table to get a random number between the two, each time the particle is emitted.

Size = {8, 24}, -- Emits with a random size between 8 and 24
LifeTime = {1, 3}, -- Particle lives between 1 and 3 seconds

Random Vector2 Ranges
For properties such as Velocity, Direction, or Gravity, you can use a nested table to define randomized ranges. Format it as { {MinX, MaxX}, {MinY, MaxY} }.
If either the X or Y entry isn’t a table, it will be treated as a fixed value.
```
Velocity = { {5, 20}, 40 }, -- X will be randomized between 5 and 20; Y stays fixed at 40
Direction = { {-1, 1}, {-1, 1} }, -- X and Y are both random between -1 and 1
```
NumberSequence Support
You can pass a NumberSequence, optionally using the .Envelope property for randomization:
```
Transparency = NumberSequence.new{
    NumberSequenceKeypoint.new(0, 0, 0.1),
    NumberSequenceKeypoint.new(1, 1, 0.1),
}
```
Same goes for ColorSequence’s.

Code Examples

Emit

UIEmitter:Emit(Amount_of_particles, {
	Texture = "",
	Velocity = {{-8, 8}, {6, 12}},
	Direction = {{-1, 1}, -1},
	Gravity = Vector2.new(0, 20),
	Drag = 0,
	LifeTime = 1,
	ZIndex = 100,
	Size = NumberSequence.new{NumberSequenceKeypoint.new(0, 50, 0), NumberSequenceKeypoint.new(1, 50, 40)},
	Squash = 1,
	Color = ColorSequence.new{ColorSequenceKeypoint.new(0, Color3.new(0.4, 0.4, 0.4)), ColorSequenceKeypoint.new(1, Color3.new(1, 1, 1))},
	Transparency = 0,
	Rotation = 0,
	RotationSpeed = 0,
	Properties = {
		Position = UDim2.fromOffset(Camera.ViewportSize.X/2, Camera.ViewportSize.Y/2),
	},
}, Parent)

Presets

local Preset = UIEmitter:GetPreset("your_preset")

Preset:Emit( --[[ Custom args for your preset ]] )

UIEmitter Version 2 - Creator Store

What should come next?

Particle collisions with collision groups
Particle methods, example: “.OnUpdate:Connect()”
Optimization using a single heartbeat connection
Max particles limit config
Particle emission rate config
Spritesheet texture animation support

0 voters

Lord_BradyRocks · June 6, 2025, 10:26pm

Is there an editable testing place, link… like at the top of the post?..

Rylvns · June 7, 2025, 6:07pm

no sorry, how would u even intend for it to work…

Lord_BradyRocks · June 8, 2025, 12:25am

what? u just publish a place that has an example, that is editable…

Rylvns · June 8, 2025, 1:08am

oh i thought you meant like an editable example where you edit configs and everything

i dont see the need for this since the “test” preset is an example all you do is emit it with its configs

local er = require(game.ReplicatedStorage["UIEmitter Version 2-ab"])

local ss = workspace.CurrentCamera.ViewportSize
local cs = ss/2

local testtimetick = os.time();

while task.wait(1) do
	er:GetPreset("test"):Emit({Amount = 50, pos = UDim2.fromOffset(cs.X, cs.Y), Parent = script.Parent});
	if os.time()-testtimetick >= 10 then
		break;
	end;
end;

put under a screen gui

Lord_BradyRocks · June 16, 2025, 10:08am

umm,

when I run the above ( beside changing the first line to …

local er = require(game.ReplicatedStorage["UIEmitter"])

I get the error


 03:05:23.453  Players.Lord_BradyRocks.PlayerGui.LocalScript:12: attempt to call missing method 'GetPreset' of table  -  Client - LocalScript:12
  03:05:23.453  Stack Begin  -  Studio
  03:05:23.453  Script 'Players.Lord_BradyRocks.PlayerGui.LocalScript', Line 12  -  Studio - LocalScript:12
  03:05:23.453  Stack End  -  Studio

on line of the code

er:GetPreset("test"):Emit({Amount = 50, pos = UDim2.fromOffset(cs.X, cs.Y), Parent = script.Parent});

Rylvns · June 16, 2025, 3:43pm

You’re still using version 1 of UIEmitter.
Version 2 is a completely new asset in the creator store which you will have to add to your inventory.

Lord_BradyRocks · June 16, 2025, 4:00pm

I got the model right before I tried it from the creator store.