AISkills/remotion-sound-effects/SKILL.md

name, description

name	description
remotion-sound-effects	Which sound effects (SFX) to use for FlatRender video templates and exactly where to place them in the timeline. Use when adding audio punch to a template — whooshes, impacts, sparkles, pops, risers, confetti — and syncing them to keyframes with Remotion's Audio component.

Sound-effect design for templates

Status: current FlatRender templates have NO audio yet. This skill is the playbook for adding it. SFX dramatically raise perceived quality — a logo "thud" + sparkle makes a reveal feel pro.

How audio works in Remotion

Use <Audio> from remotion, placed in the composition tree, timed to frames:

import { Audio, useVideoConfig } from "remotion";
// play a one-shot SFX starting at frame 55 (the logo-land beat)
<Audio src={staticFile("sfx/impact.mp3")} startFrom={0} volume={0.8}
       // mount it only around its moment using a <Sequence from={55}> wrapper
/>

Patterns:

• Wrap one-shots in <Sequence from={FRAME}> so they trigger at the right beat.
• volume can be a function of frame for fades: volume={(f)=>interpolate(f,[0,10],[0,1])}.
• Layer SFX over the music bed (see remotion-music-picker); keep SFX ~ -6 dB under dialogue, on top of music.
• Put shared SFX in services/remotion/public/sfx/ and load with staticFile().

SFX → moment mapping (sync to the KEYFRAME, not vaguely)

Moment in the animation	SFX	Place at
Element/text flies in	whoosh (short, directional)	2-3 frames BEFORE it lands
Logo / hero lands	impact / thud / boom	the exact land frame (spring settle)
Glitter / magic reveal	sparkle / shimmer / chime	over the particle gather (0.3-0.5s)
Small element appears	pop / tick / blip	each appearance (stagger to match)
Countdown ticking	clock tick per number, ding/airhorn on GO	each number frame
Birthday / party	party horn + confetti rustle, soft chime	greeting reveal + confetti burst
Sale / promo	cash register "cha-ching" / coin, stamp on the badge	badge pop
Shine sweep across logo	soft shimmer swell	sweep start→end
Transition between scenes	whoosh + light riser	on the cut
Build-up before reveal	riser / uplifter (0.5-1.5s)	leading INTO the hero moment

Placement principles

• Anticipation: risers and whooshes START before the visual peak and resolve ON it. A whoosh that lands with the logo sells the motion.
• One hero hit: the reveal gets ONE big impact — don't stack 3 booms; it muddies.
• Match the motion curve: fast spring = sharp transient; slow ease = soft swell.
• Stagger to the visuals: if 5 elements pop on different frames, 5 pops on those frames (vary pitch slightly so it's not robotic).
• Less is more: 3-6 well-placed SFX per template beats a wall of sound. Leave silence for contrast.
• Loudness: normalize SFX, peak ~ -3 dB, sit them under the music bed; the final mix shouldn't clip.

Free / royalty-aware SFX sources

Mixkit, Pixabay (sound), Freesound (check each license — CC0 vs attribution), Uppbeat (free tier), and Remotion-safe CC0 packs. ALWAYS record the license per file; prefer CC0/royalty-free with commercial use. Keep an attributions file if any source requires it.

Workflow

1. Identify the 3-6 key beats (reveal, pops, transitions, CTA).
2. Pick one SFX per beat from the table.
3. Place via <Sequence from={frame}> + <Audio>; tune volume + a short fade.
4. Render with audio and LISTEN — adjust timing by a few frames so hits land exactly on the visual.

Related: remotion-music-picker, remotion-template-composition.