A music visualiser in Remotion
Chapters7
Published7
Edition2026
Languageen-GB
The chapters.
In chronological order
Chapter 01
Audio in Remotion: from waveform to frequency array
useAudioData vs useWindowedAudioData in Remotion: which hook loads your audio, the memory-not-format difference, and how to read the frequency array.
Published
→
Chapter 02
Mapping bass frequencies to visual motion
Remotion bass frequency animation tutorial: isolate the kick from a 32-bin visualizeAudio array, gain it, and map the curve to scale and brightness.
Published
→
Chapter 03
spring() vs interpolate() for audio-reactive animation
Remotion visualizeAudio bass: why interpolate() beats spring() per-frame, where spring() physics belongs, and tuning damping to stop kick overshoot.
Published
→
Chapter 04
Audio sync drift: WAV, MP3, and Lambda
Remotion audio sync drift fix: why VBR MP3 drifts from picture, how a WAV source locks analysis to playback, and the AAC chunking pop on Lambda.
Published
→
Chapter 05
Building a radial / circular visualiser
Remotion audio visualizer radial and circular forms: map the 32-bin frequency array to angle and radius, plus a radial-gradient alpha mask.
Published
→
Chapter 06
Layered visuals with a radial alpha mask
Remotion alpha mask transparent video compositing: a static radial CSS mask shapes a time-rotating ray fan over an audio-reactive base, plus alpha WebM.
Published
→
Chapter 07
Rendering: memory, longer tracks, and Lambda quirks
Remotion render audio out of sync on Lambda: the chunked-encode cause and fix, plus useAudioData memory limits and the WAV-only windowed trap.
Published
→