screen-demo: add synthetic-terminal mode via Remotion TerminalScene

Make synthetic screen recording a first-class, discoverable capability
alongside real OS capture. For CLI / terminal / install-flow demos where
commands and output are predictable, author a `terminal_scene` cut instead
of driving a real screen recorder — deterministic, privacy-safe, pixel-
perfect, and frame-accurate to narration cues.

Components:
- TerminalScene.tsx: window chrome, char-by-char typing, blinking cursor,
  scrolling output, non-blocking floating pills, spring-based reveals
- ProviderChip.tsx: rotating badge overlay that cycles through provider
  names (used in AI-generated-motion scenes)
- BackgroundVideoLayer + source_in_seconds + backgroundVideo props on
  every scene type — supports video-behind-component composition

Discovery chain (six layers, so the next agent finds this without reading
source code):

1. pipeline_defs/screen-demo.yaml — bump to 2.1, declare production_modes
   (real_capture, synthetic_terminal) with required_tools, scene_type, and
   agent_skills pointers
2. skills/pipelines/screen-demo/idea-director.md — mode-selection table
   at brief time; brief.metadata.production_mode contract
3. skills/pipelines/screen-demo/asset-director.md — reads production_mode
   and branches asset production (capture+overlays vs steps+narration+
   pacing check)
4. .agents/skills/synthetic-screen-recording/SKILL.md — Layer 3 skill with
   step kinds (cmd/out/pause/pill), pacing rule, and the frozen-terminal
   failure mode captured from the showcase v3 retune
5. AGENT_GUIDE.md — TerminalScene added to Remotion routing; links
   SCENE_TYPES.md as the authoritative cut-type registry
6. remotion-composer/SCENE_TYPES.md — new cheat sheet of every cut.type
   and overlay.type with required fields, plus a "how to add a new scene
   type" section (candidates: ChatTranscript, EditorScene, PrReview,
   SlackThread, TicketBoard)

Guardrail:
- lib/verify_scene_pacing.py — reusable trace() and assert_alignment()
  helpers that mimic the TerminalScene frame math exactly. Fail loudly
  before render if steps burn through too fast or leave the scene frozen.
This commit is contained in:
calesthio
2026-04-16 19:22:46 -07:00
parent 33ba37704e
commit a36ce99793
11 changed files with 918 additions and 26 deletions
+36 -5
View File
@@ -1,14 +1,45 @@
name: screen-demo
version: "2.0"
version: "2.1"
description: >
Screen recording pipeline. Takes raw screen capture (app demo, browser walkthrough,
coding tutorial) and produces a polished demo video with callouts, zoom crops,
subtitles, and cleaned audio. EP orchestration adds quality gates for legibility,
audio clarity, and pacing.
Screen recording pipeline. Two production modes:
1. REAL CAPTURE — takes raw screen capture (app demo, browser walkthrough,
coding tutorial) via screen_recorder, cap_recorder, or playwright-recording
and produces a polished demo video with callouts, zoom crops, subtitles,
and cleaned audio.
2. SYNTHETIC (Remotion TerminalScene) — for CLI/terminal/install-flow demos,
renders a deterministic terminal animation with typed commands, scrolling
output, floating command pills, and blinking cursor. See
.agents/skills/synthetic-screen-recording/SKILL.md. Preferred when the
demo content is predictable (install walkthroughs, make targets, git clone,
API key config) because it's faster to iterate, privacy-safe, pixel-perfect,
and frame-accurate to narration cues.
The idea-director picks the mode at brief time based on whether the demo surface
is a real app UI (real capture) or a scriptable terminal session (synthetic).
category: screen_recording
stability: production
default_checkpoint_policy: guided
# Production modes this pipeline supports
production_modes:
- name: real_capture
description: "OS screen recording of a real desktop/browser session"
required_tools: [screen_recorder]
optional_tools: [cap_recorder]
best_for:
- Real app UIs (Figma, Photoshop, web apps with live state)
- Demos that depend on unpredictable live behavior
- User explicitly asked for a recording of their own screen
- name: synthetic_terminal
description: "Remotion TerminalScene — synthesized terminal animation"
required_tools: [video_compose] # Remotion path
scene_type: terminal_scene
agent_skills: [synthetic-screen-recording]
best_for:
- CLI / terminal / coding session demos
- Install walkthroughs, setup demos, config flows
- Tight narration-synced pacing where every command lands on a beat
- Reproducible renders (same input = identical pixels)
orchestration:
mode: executive-producer
skill: pipelines/screen-demo/executive-producer