Skill to Create Product Videos

Developer aaitor released version 1.0.1 of skill-video-studio, a local video-production workspace built around the /devrel-video Claude Code skill, which uses Playwright CLI to capture real product interactions, HyperFrames to compose title cards, chapters and CTAs, and FFmpeg to master and inspect output. The project requires Node.js 22+, FFmpeg/ffprobe, Chromium and helper-specific Python dependencies, and its offline CI checks sources and selected local utilities rather than the complete production stack; portrait and social output profiles remain on the roadmap.

From product workflow to polished demo. v1.0.1 release https://github.com/aaitor/skill-video-studio/releases/tag/v1.0.1 · aaitor/skill-video-studio Quick start quick-start · Worked videos worked-videos · Usage https://github.com/aaitor/skill-video-studio/blob/main/docs/usage.md · Contribute contributing-and-support A local video-production workspace driven by the /devrel-video Claude Code skill . Capture real product interactions with Playwright CLI, compose title cards, chapters, and CTAs with HyperFrames, then master and inspect the result with FFmpeg. Start with a silent walkthrough; add narration, music, subtitles, or your own presenter footage when needed. A real Claude Code session using the installed project skill: clone the studio, prepare an Acme walkthrough brief, and inspect the three-beat plan on a black background. This short demo stops before capture and rendering ; it does not claim a video was produced. The recording guide https://github.com/aaitor/skill-video-studio/blob/main/examples/README.md includes the actual generated brief and reproduction command. For planning: Git and authenticated Claude Code. Clone the full workspace so its native skill and project layout stay together: git clone https://github.com/aaitor/skill-video-studio.git cd skill-video-studio claude Ask Claude: /devrel-video Prepare a 25-second silent walkthrough brief for the bundled Acme app: show the workspace, filter by category, then open a project. Reuse brands/acme. Show the plan before capture or rendering. Expected result: a project brief and a concrete beat plan. For a complete video, install the capture/render prerequisites https://github.com/aaitor/skill-video-studio/blob/main/docs/installation.md capture-and-rendering-prerequisites and follow the worked walkthrough https://github.com/aaitor/skill-video-studio/blob/main/projects/example-walkthrough/README.md . The production stack needs Node.js 22+, FFmpeg/ffprobe, Chromium, and the helper-specific Python dependencies. Optional narration and avatars require your own additional services or GPU setup. - Real product capture: browser interaction scripts with explicit beats and stable selectors. - Branded composition: title, browser frame, chapters, and CTA in a HyperFrames timeline. - Local mastering and QA: master/web copies, ffprobe checks, contact sheet, and thumbnail. - Optional audio: six local music styles, narration-driven timing, and voice variants. - Optional presentation: subtitles, private bring-your-own presenter footage, and terminal/browser sequences. - Source-based workflow: reusable brands, briefs, templates, and two complete worked examples. Portrait/social output profiles remain on the roadmap. Full capture/render depends on your local toolchain; offline CI checks sources and selected local utilities, not the complete production stack. See workflow https://github.com/aaitor/skill-video-studio/blob/main/docs/workflow.md and usage https://github.com/aaitor/skill-video-studio/blob/main/docs/usage.md . Product walkthrough: a local Acme fixture, real browser capture, narration/music, and EN/ES subtitles. Source and commands https://github.com/aaitor/skill-video-studio/blob/main/projects/example-walkthrough/README.md · Watch with sound https://youtu.be/H6npd3uuqls . Composed CLI/browser film: a multi-environment example whose terminal scenes are authored HTML reenactments. Source and explanation https://github.com/aaitor/skill-video-studio/blob/main/projects/example-cli-tour/README.md · Watch with sound https://youtu.be/lvpKaYUVNws . The longer examples remain intact. Generated MP4/audio files are ignored; rebuild them from the included sources. See usage prompts https://github.com/aaitor/skill-video-studio/blob/main/docs/usage.md for silent, narrated, avatar, voice-swap, and multi-environment requests. Each video uses projects/<slug /brief.yaml , brand tokens under brands/<name / , and generated output under its project folder. Optional private settings live outside Git, selected by DEVREL VIDEO ENV . | Setting | Purpose | |---|---| | brief.yaml | Product URL, audience, message, beats, brand, duration, and optional layers | | ORPHEUS URL / ORPHEUS KEY | Your optional narration endpoint and token | | AVATAR HOST / LS DIR | Your optional SSH GPU host and LatentSync checkout | | BGM STYLE | Local background-music style; default corporate | See configuration https://github.com/aaitor/skill-video-studio/blob/main/docs/configuration.md , the actual brief template https://github.com/aaitor/skill-video-studio/blob/main/.claude/skills/devrel-video/templates/brief.example.yaml , and security/privacy guidance https://github.com/aaitor/skill-video-studio/blob/main/docs/security-and-privacy.md . Keep private footage and credentials outside this public repository. Brief → explore → brand → capture → compose → optional layers → render/QA → thumbnail. The skill https://github.com/aaitor/skill-video-studio/blob/main/.claude/skills/devrel-video/SKILL.md coordinates existing tools rather than replacing them. Detailed production steps are in the workflow guide https://github.com/aaitor/skill-video-studio/blob/main/docs/workflow.md and production notes https://github.com/aaitor/skill-video-studio/blob/main/.claude/skills/devrel-video/references/production-notes.md . .claude/skills/devrel-video/ Skill instructions, scripts, templates, production notes brands/ Brand tokens and logos projects/ Curated public examples; private projects stay ignored examples/ Real harness recording, public input, generated brief assets/ Shared banner, social card, and short terminal GIF docs/ Onboarding, usage, configuration, troubleshooting - Installation and production prerequisites https://github.com/aaitor/skill-video-studio/blob/main/docs/installation.md - Configuration https://github.com/aaitor/skill-video-studio/blob/main/docs/configuration.md - Prompts and optional layers https://github.com/aaitor/skill-video-studio/blob/main/docs/usage.md - Workflow https://github.com/aaitor/skill-video-studio/blob/main/docs/workflow.md - Troubleshooting https://github.com/aaitor/skill-video-studio/blob/main/docs/troubleshooting.md - Security, privacy, and media rights https://github.com/aaitor/skill-video-studio/blob/main/docs/security-and-privacy.md - Banner generation and social preview https://github.com/aaitor/skill-video-studio/blob/main/docs/branding.md - Original references: studio design guide https://github.com/aaitor/skill-video-studio/blob/main/local-devrel-video-studio-guide.md · avatar guide https://github.com/aaitor/skill-video-studio/blob/main/local-talking-video-avatar-guide.md Use Issues https://github.com/aaitor/skill-video-studio/issues for questions, bugs, and ideas. Read CONTRIBUTING.md https://github.com/aaitor/skill-video-studio/blob/main/CONTRIBUTING.md and CODE OF CONDUCT.md https://github.com/aaitor/skill-video-studio/blob/main/CODE OF CONDUCT.md ; report vulnerabilities privately through SECURITY.md https://github.com/aaitor/skill-video-studio/blob/main/SECURITY.md . Install requirements-dev.txt in a virtual environment and run python3 scripts/check.py . See CHANGELOG.md https://github.com/aaitor/skill-video-studio/blob/main/CHANGELOG.md for changes. Live recordings, service calls, GPU jobs, and full renders are manual validation steps. MIT https://github.com/aaitor/skill-video-studio/blob/main/LICENSE for original studio content. Embedded banner fonts retain their OFL notices https://github.com/aaitor/skill-video-studio/blob/main/assets/font-notices/NOTICE.md ; external tools/models/media retain their own terms. See licensing https://github.com/aaitor/skill-video-studio/blob/main/docs/licensing.md . Built by Aitor Argomaniz https://github.com/aaitor · LinkedIn https://www.linkedin.com/in/aitorargomaniz · More open source https://github.com/aaitor?tab=repositories