Audiogram

Turn an audio clip — a podcast highlight, a voiceover, a quote — into a short, captioned video that stops the scroll in a muted feed. The moving element (a waveform or equalizer bars) signals "there is sound here," the captions carry the message for the 80% who watch on mute, and cover art + title + a progress bar give it a finished, branded frame.

When to use

• A podcast soundbite or quote clip for Reels / TikTok / Shorts / feed posts.
• A voiceover or narration that needs a visual so it can post as video.
• Music or any audio where a reactive waveform/bars is the hero.

The one rule that prevents 90% of bugs

Drive every bar height from the current frame, never from a real-time analyser loop. Live AnalyserNode + requestAnimationFrame reads "what is playing right now" — but a video renderer paints frames out of order and faster/slower than real time, so the wave desyncs or freezes. Instead, decode the whole file to amplitude samples once, then compute the displayed value as a pure function of the frame. In Remotion this is useAudioData() + visualizeAudio(); in plain canvas it is decodeAudioData() into a sample array you index by frame.

import { useAudioData, visualizeAudio } from "@remotion/media-utils";
import { useCurrentFrame, useVideoConfig } from "remotion";