Claude Code Skill: Playwright Tutorial Video

Bridges Playwright recording and Remotion overlays in one pipeline.

Playwright records a real browser session at exactly 1920×1080. Element coordinates are captured live via getBoundingClientRect() in the same pixel space, so highlights line up perfectly with the recorded video. The manifest feeds a single Remotion VideoComposition that plays OffthreadVideo with HighlightBox, Caption, and Audio overlays sequenced by timestamp.

Browser session (Playwright @ 1920×1080)
  → manifest.json (timed steps + pixel-perfect coords)
    → Remotion VideoComposition (video + overlays + narration)
      → tutorial.mp4

Entry Points