Manim Visualizer

Creates animated visualizations using Manim (3Blue1Brown's animation engine).

Quick Start

Install manim

pip install manim

Generate visualization

python scripts/visualize.py explore --type=workflow

Visualization Types

1. Workflow Animation

Shows skill execution phases as animated flowchart.

Input: SkillMetadata with phases

Output: workflow-{skill}.mp4

Phases flow left-to-right with:

• Phase boxes appearing sequentially
• Tool icons animating in
• Parallel phases shown side-by-side
• Completion checkmarks

2. Agent Spawning

Visualizes parallel agent spawning from Task tool.

Shows:

- Central orchestrator

- Agents spawning outward

- Parallel execution lines

- Results merging back

3. Architecture Diagram

Static-to-animated architecture visualization.

Components:

- Boxes for services/modules

- Arrows for data flow

- Highlights for focus areas

Output Specs

Type Resolution Duration FPS

workflow 1920x400 5-10s 30

agents 1920x600 3-5s 30

architecture 1920x1080 5-8s 30

Integration with Remotion

Manim outputs are imported as overlays:

<Sequence from={hookEnd} durationInFrames={150}> <OffthreadVideo src={staticFile("manim/workflow.mp4")} /> </Sequence>

Color Palette

Matches OrchestKit branding:

• Primary: #8b5cf6 (purple)

• Success: #22c55e (green)

• Warning: #f59e0b (amber)

• Info: #06b6d4 (cyan)

• Background: #0a0a0f (dark)

Related Skills

• remotion-composer : Combines Manim MP4 outputs with terminal recordings

• demo-producer : Full demo pipeline orchestration

• terminal-demo-generator : Terminal recordings that pair with Manim animations

• video-storyboarding : Scene planning before animation creation