What problem does it solve?
Creating predictable, flicker-free, and production-ready videos with Remotion requires many platform-specific rules that are easy to miss: animations must be frame-driven, assets must be loaded deterministically, captions must be properly formatted, and external tools (FFmpeg, Mediabunny, TTS) must be integrated correctly. This Skill centralizes guidance so engineers and creators avoid common pitfalls that cause rendering failures, visual artifacts, or mismatched timing.
Core Features & Use Cases
- Animation safety: Enforce useCurrentFrame-driven animations and forbid browser/CSS-driven or third-party animated styles that cause flicker.
- Asset & media handling: Best practices for staticFile usage, fonts, images, videos, animated images, and audio (volume, trimming, loop behavior).
- Captions & voiceover: Guidelines for generating, importing, and displaying captions in Caption JSON format and for integrating ElevenLabs TTS with calculateMetadata.
- Tooling & media utilities: Recommendations for using Mediabunny for duration/dimensions/frame extraction and guidance on FFmpeg/ffprobe for safe trimming and encoding.
- Use Case: Audit a Remotion composition to ensure animations are frame-driven, assets are properly referenced, captions sync correctly, and rendering settings are configured for transparent or high-quality outputs.
Quick Start
Use remotion-best-practices to audit my Remotion project and provide concrete fixes for animations, assets, captions, audio, and FFmpeg usage.
