remotion-composer

# Remotion Composer

Production-quality video composition with AnimStats-level animations. Supports data visualization, spring physics, easing presets, and cinematic transitions.

## Quick Start

```bash
# Install enhanced packages
cd orchestkit-demos && npm install

# Add composition for a skill
./scripts/add-composition.sh explore

# Render
npx remotion render ExploreDemo out/ExploreDemo.mp4
```

## Package Library (v2.1)

### Core Animation
```json
{
  "@remotion/shapes": "^4.0.0",      // Geometric primitives (pie, rect, triangle)
  "@remotion/paths": "^4.0.0",       // SVG path animations (evolvePath)
  "@remotion/noise": "^4.0.0",       // Procedural noise (noise2D, noise3D)
  "@remotion/transitions": "^4.0.0", // Scene transitions (fade, slide, wipe)
  "@remotion/motion-blur": "^4.0.0", // Motion trails and blur
  "@remotion/gif": "^4.0.0",         // GIF synchronization
  "@remotion/animated-emoji": "^4.0.0", // Lottie emojis
  "@remotion/layout-utils": "^4.0.0"   // Text fitting and layout
}
```

### Advanced Capabilities
```json
{
  "@remotion/three": "^4.0.0",       // Three.js 3D graphics
  "@remotion/lottie": "^4.0.0",      // After Effects animations
  "@remotion/rive": "^4.0.0",        // Rive interactive animations
  "@remotion/captions": "^4.0.0",    // Subtitles and captions
  "@remotion/player": "^4.0.0",      // Embeddable player
  "@remotion/renderer": "^4.0.0",    // Server-side rendering
  "@remotion/media-utils": "^4.0.0"  // Audio/video metadata
}
```

### 3D & Animation Runtimes
```json
{
  "three": "^0.175.0",                    // Three.js core
  "@react-three/fiber": "^9.1.0",         // React Three Fiber
  "@react-three/drei": "^10.3.0",         // Three.js helpers
  "@lottiefiles/react-lottie-player": "^3.5.4", // Lottie player
  "@rive-app/react-canvas": "^4.21.0"     // Rive runtime
}
```

## Animation Presets

### Easing Reference
| Preset | Use Case | Feel |
|--------|----------|------|
| `bounce` | Success celebrations | Playful |