Video Maker - AI-Driven Video Generation

An AI-powered system that generates text-only video reels using Remotion and LLM agents.

How It Works

User Input → Supervisor Agent → Code Agent (LLM) → TypeScript Validation → Render → Video

1. User Input: Define content, hook, keywords, timing, and animation style
2. Supervisor Agent: Prepares instructions + loads design principles
3. Code Agent: Calls OpenRouter API (Mistral Devstral) to generate Remotion TSX code
4. Code Fixer: Auto-fixes common TypeScript issues
5. Validation: TypeScript compilation check
6. Render: Remotion renders the final video

Quick Start

# Install dependencies
npm install
pip install python-dotenv requests

# Create .env file with your API key
echo "OPENROUTER_API_KEY=your_key_here" > .env

# Start Remotion preview
npm run dev

# Generate a video
python agents/main.py

Project Structure

video-maker/
├── src/
│   ├── Root.tsx           # Remotion entry
│   ├── Composition.tsx    # Background + CodeReel wrapper
│   ├── CodeReel.tsx       # AI-generated animation code
│   └── index.ts
├── agents/
│   ├── main.py            # Workflow orchestrator
│   ├── supervisor_agent.py # Instruction preparation
│   ├── code_agent.py      # LLM integration (OpenRouter)
│   ├── code_fixer.py      # Auto-fix TypeScript issues
│   ├── database.py        # SQLite storage for code library
│   └── design_principles.md # Rules for code generation
├── out/                   # Rendered videos (gitignored)
├── .env                   # API keys (gitignored)
└── video_maker.db         # Code library (gitignored)

Configuration

VideoInput Options

VideoInput(
    content="Your video text...",
    hook="First 2 seconds hook",
    duration=10,  # seconds
    pacing={0: "Line 1", 2: "Line 2", ...},
    keywords={
        "important": {"color": "#FF0000", "effect": "shake"},
        "highlight": {"color": "#FFD700", "effect": "glow", "size": "large"}
    },
    entry_animation="fadeIn",  # spring, fadeIn, scaleUp
    exit_animation="fadeOut",
    background_color="#0a0a0a",
    hook_color="#FFFFFF"
)

Available Effects

Effect	Description
shake	Subtle vibration
pulse	Breathing scale
glow	Text shadow glow
scale	Growing/shrinking
explode	Spring pop-in

Size Options

Size	Font Size
huge	140px
large	100px
normal	72px
small	52px

Tech Stack

• Video Engine: Remotion 4.x
• Frontend: React 19, TypeScript
• Styling: Tailwind CSS v4
• AI: OpenRouter API (Mistral Devstral)
• Backend: Python 3.x
• Database: SQLite

License

See Remotion License