playwright-recording

Official

Record browser demos for Remotion videos.

Authordigitalsamba
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill enables recording browser interactions as video using Playwright, making it easy to produce demo videos and app walkthroughs for Remotion pipelines without manual, tedious screen recording.

Core Features & Use Cases

  • Recording browser interactions as video to capture demos, UI flows, and walkthroughs for Remotion-based projects.
  • Configurable viewport sizes and video output to align with Remotion requirements and reduce post-production effort.
  • Use Case: Generate repeatable product demos by scripting a browser flow and exporting a WebM suitable for inclusion in Remotion pipelines.

Quick Start

Use the playwright-recording skill to scaffold a simple demo recording with a script at scripts/record-demo.ts and run via npx ts-node scripts/record-demo.ts or npx tsx scripts/record-demo.ts.

Dependency Matrix

Required Modules

playwright

Components

scriptsreferences

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: playwright-recording
Download link: https://github.com/digitalsamba/claude-code-video-toolkit/archive/main.zip#playwright-recording

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.