Video Generation

Create professional marketing videos from structured specs using HTML-based scene templates, GSAP animations, and automated rendering.

How It Works

The Video Generation engine turns a declarative VideoSpec into a finished MP4. You define scenes, pick templates, fill in content slots, and the system assembles an HTML composition with synchronized GSAP animations, then renders it frame-by-frame through a headless browser and stitches the result with FFmpeg.

Key Concepts

  • VideoSpec — JSON schema defining title, brand, format, and scenes
  • Scene Templates — reusable HTML + GSAP building blocks
  • Assembly Engine — compiles spec into a single composition
  • Render Pipeline — headless Chrome + FFmpeg output

Supported Formats

  • • Desktop — 1920 x 1080 (16:9)
  • • Landscape — 1280 x 720 (16:9)
  • • Square — 1080 x 1080 (1:1)
  • • Portrait — 1080 x 1920 (9:16)

End-to-End Workflow

1

Define Your VideoSpec

Choose a format, set brand colours and fonts, then add scenes. Each scene references a template and fills its content slots (headline, subtitle, stat value, etc.).

2

Preview in Browser

The admin editor shows a live iframe preview with play, pause, restart, and scrub controls. Switch between Desktop, Square, and Portrait tabs to check every aspect ratio.

3

Add Voiceover (Optional)

Write narration text per scene, then generate speech with ElevenLabs. Scene durations auto-size to match the audio length plus configurable padding.

4

Render & Export

Hit Render and the pipeline captures each scene individually, then FFmpeg stitches them into a final MP4. Progress is tracked in real time. Finished videos are uploaded to cloud storage with a download link.

Key Features

Scene Templates

Choose from built-in templates or create your own. Each template defines content slots, default duration, and GSAP animations.

Hook
Bold headline + subtitle opener
Chat Demo
Animated user/AI chat bubbles
Stat
Animated counter with label
CTA
Call-to-action with URL

Platform Pacing

Auto-adjust scene durations and transitions per platform. Short, punchy cuts for TikTok; longer, smoother pacing for YouTube and LinkedIn.

YouTube
TikTok
Stories
LinkedIn
Twitter

Voiceover Generation

Write narration per scene, generate speech with ElevenLabs, and let auto-sizing adjust scene durations to fit the audio.

Text-to-Speech
ElevenLabs multi-voice TTS
Auto-Sizing
Scenes expand to fit narration
Inline Preview
Play VO clips in the editor

Batch & Variations

Generate multiple video variations from a single base spec, or auto-split a long video into 15-second Instagram Story segments.

Content Variations
Swap headlines, stats, or CTAs across a series
Story Auto-Split
Splits into ≤15s segments in portrait format

MCP & API Access

Every video operation is available through both the admin UI and the v2 REST API, which is also exposed as MCP tools for AI-assisted workflows.

CRUD
create, get, update, list, delete videos
Rendering
trigger renders, check progress, download
Advanced
batch, voiceover, list templates
Documentation - BlackOps Center | BlackOps Center