Architecture

LeetDreamer is built around a modular pipeline with swappable adapters at each stage.

Pipeline Overview

The build process flows through these stages:

1. Scene Spec - JSON defining narration steps and visualization state
2. TTS Adapter - Generates audio from narration text
3. Template Renderer - Produces HTML animation from scene spec
4. Recording Adapter - Captures animation to video
5. Merge Adapter - Combines audio and video tracks

Adapters

Each pipeline stage uses an adapter pattern, allowing easy swapping of implementations:

• TTSAdapter - Text-to-speech generation (OpenAI, local, etc.)
• RecordingAdapter - Video capture (Playwright, Puppeteer)
• MergeAdapter - Audio/video merging (FFmpeg)

Scene Specifications

Scenes are defined in JSON with Pydantic schema validation. Each scene contains:

• Metadata (title, algorithm type)
• Steps array with narration text and visualization state
• Template reference for rendering

Templates

Animation templates are Jinja2 HTML files that receive step data and timing information. Templates handle:

• Visual rendering of data structures
• Animation timing based on audio durations
• Smooth transitions between steps