educational-video-creator

Educational Video Creator

Create professional educational videos with Kurzgesagt/回形针 visual style using Remotion.

Prerequisites

This skill requires remotion-best-practices for Remotion technical implementation.

Check and install (MUST complete before Phase 1):

# Check if already installed, install if not
npx skills list 2>/dev/null | grep remotion-best-practices || npx skills add https://github.com/remotion-dev/skills --skill remotion-best-practices

Once installed, read the remotion-best-practices skill to load Remotion API details into context. This is essential — without it, Phase 4 code will have incorrect Remotion API usage.

External dependencies (needed for Phase 4.5 audio generation):

# ffmpeg (provides ffprobe for audio duration measurement)
brew install ffmpeg        # macOS
# apt install ffmpeg       # Linux

# edge-tts (Python TTS engine for narration generation)
pip install edge-tts

Project Setup

This skill creates videos in a dedicated remotion_video subdirectory within the current workspace.

First-time setup (recommended — non-interactive):

# Create video project directory
mkdir -p remotion_video
cd remotion_video

# Initialize without interactive prompts
npm init -y
npm install remotion @remotion/cli @remotion/google-fonts @remotion/transitions react react-dom
npm install -D typescript @types/react

# Create minimal project structure
mkdir -p src public/audio/narration

Then create the required entry files:

• src/Root.tsx — Main composition registry
• src/index.ts — Remotion entry point with registerRoot(Root)
• remotion.config.ts — Remotion configuration
• tsconfig.json — TypeScript config

Alternative (interactive — may block in automated environments):

mkdir -p remotion_video && cd remotion_video
npx create-video@latest --blank
npm install

Note: npx create-video may prompt for project name, package manager, etc. In CLI/automation contexts, use the non-interactive method above to avoid blocking.