refactor: bundle the whole template suite under flat-artist/ + fix references
flat-artist is now the single container: all 16 template skills + the R&D references/ moved inside flat-artist/. Cross-references updated — the orchestrator points to bundled `<name>/SKILL.md`, sub-skills point to `../<name>/SKILL.md`, and the R&D report path is relative. README catalog updated. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,56 @@
|
||||
---
|
||||
name: remotion-sound-effects
|
||||
description: 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:
|
||||
```tsx
|
||||
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/SKILL.md`); 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/SKILL.md`, `../remotion-template-composition/SKILL.md`.
|
||||
Reference in New Issue
Block a user