Audio Visualizer Service [UPDATE 2.0: MORE SHAPES, AND BETTER ANIMATION]

UPDATE VIDEO

Exmaple Place.rbxl (28.4 KB)


Info
This is a service where you can create your own Audio Visualizer with ease. It allows you to customize your visualizer; whether is from making your Visualizer have textures to having a rainbow color bars. I hope this helps :slight_smile:.

Here is a video - Example Video

What is a Audio Visualizer?

An Audio Visualizer is model or a sort of object where it moves according to the audio frequency. Or in other words Parts moving according to the music.

How will the visualizer work?

We be using local script to control the movement of the visualizer. This will reduce lag in the movements. First we use the Sound Instance’s class PlaybackLoudness to move the bars.

Is there any easier way to write this script?

Well In the future I will make a plugin for this project where it will have more intuitive way of customizing and creating an Audio Visualizer

Setup

  1. First Insert a LocalScript inside StarterPlayer.
  2. Download the Audio Visualizer Module or your use require(5637113345) to get the updated version
    2.1 If you downloaded the Module then place in Replicated Storage
  3. You can paste this Example Code in the LocalScript for test
Example Code
local Module = require(game.ReplicatedStorage.AudioVisualizerModule)
local RunService = game:GetService("RunService")
local Configs = {
	SizeDirection = Enum.NormalId.Top,
	PartType = Enum.PartType.Block,
	StartingOrientation = Vector3.new(0,0,0),
	Material = Enum.Material.Neon,
	CustomPartName = "Part",
	StartPosition = Vector3.new(0,0,0),
	StartingSize = Vector3.new(3,3,0),
	EndPoint = workspace.Visualizer,
	Spacing = Vector3.new(4,0,0),
	CloneNumber = 20,
	LoudnessDivider = 15,
	Music = workspace.Visualizer.Sound
}

Module.Create(Configs)

game.Workspace.Visualizer.Sound:Play()

RunService.RenderStepped:Connect(function()
	for i,v in pairs(game.Workspace.Visualizer:GetChildren()) do
		if v:IsA("Part") then
			Module.Play(game.Workspace.Visualizer.Sound)
		end
	end
end)
Module.RainbowEffect(game.Workspace.Visualizer:GetChildren())

API

API

.Create()

This method would need Table value with your Configurations. This will create a Visualizer depending on your Configurations

Table Value needed

local Configs = { -- your Table Variable
	SizeDirection = Enum.NormalId.Top, -- MUST BE A ENUMITEM
	PartType = Enum.PartType.Block, -- MUST BE A ENUMITEM
	StartingOrientation = Vector3.new(0,0,0),  -- MUST BE A INSTANCE VECTOR3
	Material = Enum.Material.Neon, -- MUST BE A ENUMITEM
	CustomPartName = "Part",  -- MUST BE A STRING
	StartPosition = Vector3.new(0,0,0),  -- MUST BE A INSTANCE VECTOR3
	StartingSize = Vector3.new(3,3,0), -- MUST BE A INSTANCE VECTOR3
	EndPoint = workspace.Folder,  -- MUST BE A INSTANCE VALUE AND IT MUST BE A FOLDER
	Spacing = Vector3.new(4,0,0), -- MUST BE A INSTANCE VECTOR3
	CloneNumber = 20, -- MUST BE A INSTANCE INTEGER/NUMBER
	LoudnessDivider = 15, -- MUST BE A INSTANCE INTEGER/NUMBER
	Music = workspace.Visualizer.Sound  -- MUST BE A INSTANCE VALUE
}

.Edit()

This method would need Table value with your Configurations. It will create a new visualizer depending on your configurations, and will delete the old Visualizer

Table Value needed

local Configs = { -- your Table Variable
	SizeDirection = Enum.NormalId.Top, -- MUST BE A ENUMITEM
	PartType = Enum.PartType.Block, -- MUST BE A ENUMITEM
	StartingOrientation = Vector3.new(0,0,0),  -- MUST BE A INSTANCE VECTOR3
	Material = Enum.Material.Neon, -- MUST BE A ENUMITEM
	CustomPartName = "Part",  -- MUST BE A STRING
	StartPosition = Vector3.new(0,0,0),  -- MUST BE A INSTANCE VECTOR3
	StartingSize = Vector3.new(3,3,0), -- MUST BE A INSTANCE VECTOR3
	EndPoint = workspace.Folder,  -- MUST BE A INSTANCE VALUE AND IT MUST BE A FOLDER
	Spacing = Vector3.new(4,0,0), -- MUST BE A INSTANCE VECTOR3
	CloneNumber = 20, -- MUST BE A INSTANCE INTEGER/NUMBER
	LoudnessDivider = 15, -- MUST BE A INSTANCE INTEGER/NUMBER
	Music = workspace.Visualizer.Sound  -- MUST BE A INSTANCE VALUE
}

.Destroy()

This method would need the folder of your Audio Visualizer Folder. NOTE: It must be a Instance

local AudioVisualizerService = require(game.ReplicatedStorage.AudioVisualizerService)
AudioVisualizerService:Destroy(workspace.Folder) -- Will Destroy your Visualizer 

.AddColor()

This method would need a table value. This is help to find of the color should be Solid, Rainbow, have Texture, or All of them.

	local ColorType = Configs["ColorType"] -- MUST BE A STRING AND EITHER "CUSTOM OR RAINBOW"
	local Color = Configs["Color"] or nil -- MUST BE A COLOR3
	local Texture = Configs["Texture"] or nil -- MUST BE STRING OR NUMBER

.AddTexture()

This method would need the first Parameter to be an Instance or in this case the part. The second Parameter to be a Texture URL or ID. NOTE: Make sure this method is run under a for loop.

local AudioVisualizerService = require(game.ReplicatedStorage.AudioVisualizerService)
for i,v in pairs(workspace.Folder) 
      AudioVisualizerService:AddTexture(v,"YOUR ID") -- Will a Texture to your Visualizer on all sides
end

.RainbowEffect()

This method would need the table value of all your parts. This method can be used in any other project outside of this Audio Visualizer Project.

local AudioVisualizerService = require(game.ReplicatedStorage.AudioVisualizerService)
AudioVisualizerService:RainbowEffect(game.Workspace.Folder:GetChildren())

.Play()

This method would need first parameter to be the Sound Instance, the second to be the Parts Table, and the third is the Size Multiplier. This method can be use for any Audio Visualizer Project, this method is made so any Audio Visualizer is compatible with this method. NOTE: This method should be called every time the sound is played.

local AudioVisualizerService = require(game.ReplicatedStorage.AudioVisualizerService)
AudioVisualizerService:Play(game.Workspace.Visualizer.Sound,workspace.Visualizer:GetChildren(),10)

Updates

1.0 - August 31, 2020
  1. Launch
  2. Bug Fixes
2.0 - September 2, 2020
  1. More Shapes Support
  2. Better Tweening and smoother animation
  3. More customization
  4. You can use Custom visualizer and connect to the .Play() method

FEEDBACK

Please reply to this post, it would help me a lot. You can comment on my work, or I need to fix any bugs, or even just want help. I will be updating the module.

Thanks for reading :slight_smile: and hope this helped !!!

52 Likes

I love it! It’s unique! I’ve never seen anyone do this before keep up the good work!

4 Likes

How does this module work? I did the steps but nothing happens. I am not at all experienced in Audio Visualization.

2 Likes

could show me your code/your end result? Ty btw, I will take a look and give your answer asap

1 Like

Very cool, thank you for sharing! :slight_smile:

2 Likes

I have a question after looking at the code. Do I just import the scripts into a baseplate and it automatically works or do I have to insert parts and/or an audio?

2 Likes

Well you have 2 ways for you to go about.

  1. You can add in Custom Part where the Shape Class is a Block, parent it to a Folder. Then you can use the .Play(SOUND_INSTANCE,YOUR_FOLDER:GetChildren()). I am fixing some more stuff to make to more flexible/
  2. You can use the .Create() method to automatically create a Visualizer deeding on your Config, and then Run the .Play(SOUND_INSTANCE,YOUR_FOLDER:GetChildren()) and it will work.

MAKE SURE THE :Play() Method is under a loop or RunService.RenderStepped()

1 Like

Ok, thanks! I didn’t do that before, I’ll try it.

2 Likes

Any further problem just ping me, I will help you out. I am also releasing the the 2.0 Version tomorrow, U can expect more improvements on the movements to be more smoother and New Shapes Support :eyes:

New Update guys take a look, make sure you read the API, I hav made some changes and added more parameters.

Anyone who also would like the Example Place I have also linked it too above

Ashp, there is a way to make your (visualisation system more smoother if you’d like to know!)

Sure I would like to know how?

Hey, this system is awesome! I would like to let you know that the testing place does not work. I do not know why. I would also like to know how you made the visualizer the entire screen, like in the video. Also, is it possible to make a playlist? So it would play multiple songs? Sorry for all the questions, I am a novice scripter. :grimacing:

You can use tweening to make it smoother, or lerping! :slight_smile: Oh and sorry i didnt see you replied.

Could you explain this more? I don’t really know that much about scripting… could you give me an example? Also, is it just me that the example place doesn’t work?

I havent tried the example place, but the script is buggy, and im trying to resolve it.

1 Like

Alright so i found the issues and i need permission to upload the rblx of the fixed module if thats okay wiit you @Ashp116

can i put any music id in this?

not just the dododododododododo one