GuiEffects Module - a quick and easy way to add simple UI effects to your projects.
My GuiEffects module is designed for common UI interactions, such as hovering over or clicking buttons. It’s based on pre-defined placeholder effects, making it ideal for such repetitive actions. I have used this system for almost 2 years now in multiple games and dozens of other projects, and improved it along the way.
How it works:
Here’s a quick example of how an effect is structured:
GuiEffects makes handling UI effects straightforward, by using 4 main interactions: Mouse Enter, Mouse Leave, Mouse Down and Mouse Up. Each interaction allows you to define further effects for specific UI elements.
- Targets, Effects: Effects are applied to target frames (UI elements), stored using values such as NumberValue,Color3Value, etc. For unsupported value types like Udim2, add a “val” attribute instead.
(a massive oversight of mine is not making this whole system use attributes instead of values - that would be more efficient and convenient to edit)
How to use it:
- Make an effect
-
Start with a parent frame (e.g., a button). If you want click effects, either the parent frame must be a ClickButton, or it should contain a ClickButton named “Click”.
-
Add the MouseEffects folder (found in the GuiEffects module or template game) in the parent frame.
-
Within the folder, you’ll find four folders: OnMouseEnter, OnMouseLeave, OnClickStart, OnClickEnd. Customize the effects within these folders for your target elements.
- Initialize the Module
local repStorage = game:GetService("ReplicatedStorage")
local guiEffects = require(repStorage:WaitForChild("GuiEffects"))
- To enable the effects, call the following function:
guiEffects.setupMouseEffects(parentFrame)
- When the effects are no longer needed (e.g., on closing the GUI), clear them to improve performance:
guiEffects.clearMouseEffects(parentFrame)
Get it here:
-
Uncopylocked template showcase game:
GuiEffects Module Showcase - Roblox -
Just the module:
https://create.roblox.com/store/asset/83813197721436/GuiEffects-Module
Video showcase:
I hope you find this useful!