remotion
Best practices and comprehensive guide for Remotion - programmatic video creation in React with animations, compositions, and media handling
62
45%
Does it follow best practices?
Impact
93%
1.43xAverage score across 3 eval scenarios
Advisory
Suggest reviewing before use
Optimize this skill with Tessl
npx tessl skill review --optimize ./cli-tool/components/skills/video/remotion/SKILL.mdEvaluation results
90%
15%Product Launch Showcase Video
Frame-driven animations and scene transitions
useCurrentFrame driven
100%
100%
No CSS transitions
100%
100%
No Tailwind animation classes
100%
100%
Clamped interpolation
100%
100%
Spring damping config
50%
100%
FPS-based frame math
0%
100%
TransitionSeries used
100%
100%
Per-module transition imports
100%
100%
Premount sequences
0%
0%
Correct total duration
100%
100%
100%
Podcast Channel Intro Sequence
Font loading and text animation patterns
Google Fonts package
100%
100%
Top-level loadFont
100%
100%
Specific weights and subsets
100%
100%
fontFamily in style
100%
100%
useCurrentFrame typewriter
100%
100%
String slicing typewriter
100%
100%
No CSS text animations
100%
100%
Type not interface for props
100%
100%
Composition in Root.tsx
100%
100%
90%
70%Social Media Clip with Synchronized Captions
Media assets with captions and sequencing
Remotion Img component
100%
100%
staticFile() for assets
100%
100%
Audio from @remotion/media
0%
100%
Video from @remotion/media
0%
100%
Premount sequences
0%
0%
parseSrt for captions
0%
100%
createTikTokStyleCaptions
0%
100%
Sequence-based caption rendering
0%
100%
- Repository
- davila7/claude-code-templates
- Commit
eaafb99
- Evaluated
- Agent
- Claude Code
- Model
- Claude Sonnet 4.6
Table of Contents
Is this your skill?
If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.