How would you make a text animation sync to different beats of a song

Hello everyone! This is my first post, I hope it is alright. Here’s my issue:

  1. So I am in the middle of writing some script to replicate this text effect from a music video, specifically Pictured as Perfect by Frums (as seen in the video attached). My goal is to make this effect into roblox, as I just like recreating BGA’s (lol).

  1. My issue is that it is really difficult to find something that allows me to do it like this, I have a text animation script where it’ll type it out in the textlabel, but it is not on the beats that it should be. I am wondering if there could be a workaround to this?

  2. I’ve tried quite a few solutions, such as trying to figure out if I could make this using BPM, or try to slow or speed up time but nothing. I have looked on the devforums here but nobody really has ever needed to use something like this, as it is really not useful for anything except for very specific cases such as this one.

The code I currently have written goes like this;
There is a function that will take the text variable and set it to the string inside when the function is called, which will then edit the text property adding one character every 0.05 seconds. Now normally, if this wasn’t timing based this would be perfect as it ends on the spot it needs to, but unfortunately it is not. If there was a possible way to use BPM, which I’m assuming is what the answer is, then that would be a project saver for me without using about ~20 lines + the lines for task.wait() for the most unoptimized code you’ll ever see just for one line of text.

For anyone wondering, “textUi” is the ScreenGui, “Morse1” is the top half of the morse (there is a second but its not shown in the video), and “Line1” is the first line of morse that will be written out.

local function setText(word)
	Text = word
	for i = 1, #Text do
		textUi.Morse1.Line1.Text = string.sub(Text, 1, i)
		task.wait(0.05)	
	end
end
setText("3.1.1.3.2-2-2-6-6-2-2-6-6-2-2-")

There was a comment I found in the video by Zenokwei that breaks down the BGA, and there is perhaps some useful information that could be used? The songs bpm is 95, by the way. I am interested in music, but this is stuff I could not bear to learn loool

If there is no solution to this I’ll use my original method of writing out every text line, but there most likely is.
Any questions can be asked here if needed!

1 Like

I honestly don’t think you can detect this automatically, unless the bpm of the song is absolute (the tempo never changes, which in your showcase video does change). But if it is absolute, then just make a checking function called on renderStepped, that if enough time since the last beat has ran, visualizes another piece of text.

I probably misunderstood your problem cuz this seems pretty simple to me.

Side note, roblox recently added some new audio listeners and stuff like that. I haven’t really used any of them since I thought it was mainly for voice chat, but who knows, maybe it wouldn’t be counterproductive to check them out?

I found an Audio Visualizer a long time ago and have held onto it.

I don’t remember where I found it or why I was looking for it.

You can check out the code, I think it might have some pieces you are looking for.

SongVisualizer.rbxl (62.0 KB)

1 Like

Yes! Frums is a weird music artist when it comes to rhythm, and likes to change it a LOT so there’s enough variety with the melodies created.
On another note,
I do feel like RenderStepped would be the way to go, as oof’s music visualizer indeed uses RenderStepped to detect the sound coming through, and instead uses volume. Another thing is that if the audio is silent, the visualizer will still play so I’m now wondering, what if I make an audio that goes along to the beats of the text, and when the audio peaks at a certain height it will then add that text? This could be something worth trying, I’ll get to work on this and see if it is a solution

1 Like

I tried it after recreating the beats, it’s a sound file and I managed to get it to sort of work? The string.sub is making it all weird, though. Here’s the script so far since I can’t figure it out really

local function setText(word)
	RunService.RenderStepped:Connect(function()
		local lastsize = audio.PlaybackLoudness
		local line1 = textUi.Morse1.Line1
		if line1 then
			if lastsize > 1 then
				Text = word
				for i = 1, #Text do
					textUi.Morse1.Line1.Text = string.sub(Text, 1, i)
					task.wait(0.1)	
				end
			end
		end
	end)
end

The function called after still uses the “word” variable and it actually works well, except I need it to pause the string being written and then continued by the next beat. Right now it will continuously flash the text since there’s nothing stopping it from, well, retyping it all. You could try and remake it while testing this but with a different audio, but for now I’m not sure.