Audio Visualizer System - Parts and GUI Elements

Hey!

I’ve released an open source Audio Visualizer system you can use for free in your games.
It works for parts and GUI elements. It functions in a module script and can be easily added in with full customization!

Find it here: Audio Visualizer - Roblox
GitHub Repository: GitHub - Audio Visualizer

Demo Video:

Features:

  • Visualization for Parts and GUI Elements
  • Fully Customizable Visualizer Properties Such as: Type, Direction, Size, Minimum and Maximum Size, Minimum Reaction Volume, Volume Sync, Randomness, Smoothness and more!

How to Use:

Once you’ve gotten the module script from the Roblox library in a game, put it somewhere into ReplicatedStorage and then you can require it in a server or client script and start using it. The full customization comes in with visualizer settings whenever you are making a visualizer, which are the key component, their usage is documented below with different options.

Visualizer Settings Documentation:

You need to include each of these settings with different values as a dictionary to pass it onto the module script so it can work. Some parts don’t work well. Setting values can be different to look good based on what type of instance you are updating its size. Recommended settings for parts are: Division = 25, Minimum = 0.001 and Maximum = 10. And for GUI elements taking up the whole screen are Division = 1000, Minimum = 0 and Maximum = 1.

Open

Type - The type of movement the visualizer will update to.
Values: Pillar1Side, Pillar2Sides, Pillar4Sides

Direction - The direction of the size updates.
Values: All, Top, Bottom, Left, Right

Size - Settings about the size updates. All values under are in a dictionary inside this element.
Values: Dictionary.

Type - The type of property to change for the visualizer if it’s a GUI element.
Values: Y.Scale, Y.Offset, X.Scale, X.Offset

SyncWithVolume - Syncs the size updates to the sound’s volume.
Values: true, false

ReactionVolumeMinimum - The minimum sound volume needed to cause a size update.
Values: 0 or any number

Divison - Divides the size update so it fits the maximum. Can be lower or higher than the maximum, it depends on the usage.
Values: 0 or any number

Minimum - The minimum number for the size update.
Values: 0 or any number

Maximum - The maximum number for the size update.
Values: 0 or any number

Multiplier - Multiplies the size update by a set amount.
Values: 1 or any number

Randomness - Settings for the randomness of the size update. The size update is multiplied by a random number generated from the values under. All are in a dictionary inside this element.
Values: Dictionary.

Minimum - The minimum random size the size update will follow.
Values: 0.5 or any number

Maximum - The maximum random size the size update will follow.
Values: 1.2 or any number

Smoothness - Makes the size update smoothly update. All values under are in a dictionary inside this element.
Values: Dictionary.

Enabled - Is smoothness enabled.
Values: true or false

Time - The time needed to update smoothly.
Values: 0.1 or any number

Note:

Visualizer types are now supported for GUI elements. Using a Pillar1Side or Pillar2Sides type has the same effect on size. Use the AnchorPoint property to adjust this as needed. Using Pillar4Sides or a direction of All has the same effect on size.

Sound Visualizer Module Script Documentation:

You have to call the “Update” function each time you want to update the size of a visualizer part.
You need to include 3 parameters which are Sound, Destination and VisualizerSettings.

Open

Sound - The sound instance the visualizer will update upon.
Destination - The place where the system will get each child from and update them. Can be a folder or model.
VisualizerSettings - Dictionary with the settings for how the sound updates will look. Read the documentation above for more info.

Example Local Script:

Open
local Workspace = game:GetService("Workspace")
local Sound = Workspace.Sound
local VisualizerParts = Workspace.VisualizerParts
local RunService = game:GetService("RunService")
local ReplicatedStorage = game:GetService("ReplicatedStorage")
local AudioVisualizer = require(ReplicatedStorage.AudioVisualizer)

local VisualizerSettings = {
	Type = "Pillar1Side",
	Direction = "Top",
	Size = {
		Type = "Y.Scale",
		SyncWithVolume = true,
		ReactionVolumeMinimum = 0,
		Division = 25,
		Minimum = 0.001,
		Maximum = 10,
		Multiplier = 1,
		Randomness = {
			Minimum = 0.5,
			Maximum = 1.2
		},
		Smoothness = {
			Enabled = true,
			Time =  0.1
		}
	}
}

RunService.Heartbeat:Connect(function()
	AudioVisualizer:Update(Sound, VisualizerParts, VisualizerSettings)
end)

Bug Reports and Suggestions Guide:

Leave any bug reports or suggestions as replies in this post.

33 Likes

Yep! I aimed for easy creation of visualizers.

1 Like


Um…
You ok there or is that just some sort of code?

Very cool!

It reminds me of something I had made in the past. Does it just use volume/ loudness values?

Thanks!
Yes, it does use the PlaybackLoudness property.

2 Likes

New Update:

:tada: Visualizer types are now supported for GUI elements!

Make sure to read the note at the bottom of the visualizer settings documentation for more info on how to implement this feature properly.

1 Like

I’ve been looking for something like this for SOOO long. You are a life saver.

2 Likes

Your system is outdated because roblox released audioAnalyzers for perfect audio visualization

if you don’t want to use it then don’t
they just wanted to release a module to help the community

the resource is primitive and outdated which means they’re sourcing outdated technology to creators. This results in a lack of quality in comparison to new industry standards. Its recommended they update the system to accurately represent Roblox’s new capabilities with the release of more accurate sound replication.

like I said earlier, if you’re unhappy with outdated methods then simply ignore it
the current Roblox’s audio visualizer is good, sure
but the get spectrum function doesn’t even work properly which is the main reason why people want to use it
on top of that, the quality isn’t bad at all, if you aren’t happy with something then simply edit it to your liking, nothing that’s free for use fits perfectly, and ive been using this for a while and its been working pretty darn good
as for “new industry standards”, im sorry but the standards barely changed, high quality games have been getting very minimal attention
so like I said
please don’t say things like and simply ignore this post if you don’t want to use it
devforum isn’t the place for these types of comments

I appreciate that you find this resource useful and that it has worked well for you. However, I’d like to highlight that feedback, even if it’s critical, is essential for growth and improvement. Constructive criticism helps identify areas where tools and resources can be enhanced to benefit the entire community.

It’s important for all of us to be open to various viewpoints. When we share feedback, it’s not about invalidating each other’s experiences but rather about collaborating to make our resources better. By embracing feedback, we can work together to develop higher-quality tools that meet evolving industry standards.

Let’s continue to support each other by providing and considering constructive feedback. This way, we can ensure our community thrives and our resources remain top-notch.

you did not even send constructive criticism
“your system is outdated” is definitely not constructive
i do value the growth of the community but it wasnt necessary here since this module had no problems to start with
its simply an alternative method of visualizing audio to not use roblox’s “audioAnalyzers”
until you prove to me that its outdated in a way
my point stands

You’re bumping a 2 year old thread without a solid reason, this resource is of course outdated, and I highly don’t think the developer is going to update it anyway.

And generally everyone knows about the upcoming Audio API and its new features.