归藏 product video skill：复用真实产品组件和设计语言，用代码制作软件更新宣传片。包含分镜文案、原创配乐、动作音效与视频渲染，支持 Claude Code 和 Codex。

归藏 product video skill – AI‑assisted promo‑video creation

What it is – A skill (plugin) for AI‑coding assistants such as Claude Code or Codex that turns a software repository (or its recent changelog) into a short promotional video. The AI is guided through a structured workflow: it extracts the most interesting changes, re‑uses the product’s own UI components, writes copy, composes or synthesises music, adds sound effects, animates everything with GSAP/Three.js, and finally exports an MP4 together with a fully editable video project.

Who would use it?

User	Why it helps
Product developers who have just released a new version and need a quick, on‑brand demo video for social media, newsletters or landing pages.
Marketing teams that want a video that looks exactly like the product, without hiring a designer or a video‑editing studio.
AI‑coding tool users (Claude Code, Codex, Vercel Skills) who want to extend their assistant with a concrete, revenue‑generating capability.

Core capabilities (as described in the README)

Change‑log mining – scans recent commits / release notes, picks out user‑facing improvements and rewrites them into plain‑language selling points.
Component reuse – mounts the real UI components from the target repo, preserving colours, fonts, corner radius, layout, etc., so the video feels native.
Style modes – three presets:
- repo – fully inherits the product’s visual language.
- default – uses a built‑in CodePilot “warm‑white / charcoal” style.
- hybrid – mixes real UI with a custom outer wrapper.
Storyboard generation – the AI proposes a sequence of shots (title, feature close‑ups, full workspace, detail cuts) and asks for any missing details.
Animation engine – GSAP drives the timeline; Three.js / canvas provides background effects; Playwright renders static frames and the final video.
Audio pipeline –
- Generates a short music track (either from a user‑provided file, a local music‑generation model, or code‑synthesised examples shipped in the repo).
- Adds per‑action sound‑effects (clicks, alerts, “ding” cues) and automatically ducks the music when needed.
Export – produces:
- An MP4 ready for upload.
- A complete video‑project folder (editable source, timeline, assets).
- Key still frames for thumbnails or cover art.
- A manifest of component sources, audio licences, and any fallback‑rendered elements.

How you get it running

Install via the Skills CLI (the recommended one‑liner):

npx skills add https://github.com/op7418/guizang-product-video-skill --skill guizang-product-video-skill

Or clone manually into the appropriate directory for Codex (~/.agents/skills) or Claude Code (~/.claude/skills).
The first run checks for:
- Node ≥ 22 + npm
- Python ≥ 3.9
- FFmpeg/ffprobe
- Playwright Chromium (installed automatically if missing)
After installation you invoke the skill from your AI assistant, e.g.:

“用 guizang‑product‑video‑skill，把这个项目最近三周的主要更新做成一支宣传片，横版 45‑60 秒，中文。”
The assistant walks you through the required parameters (target version range, audience, platform, aspect ratio, language, style) and then proceeds with the automated pipeline.

What’s inside the repository?

LICENSE                – AGPL‑3.0 (main code & docs)
COMMERCIAL_LICENSING.md – optional commercial‑license contact
SKILL.md               – formal definition of the skill for AI tools
agents/                – metadata for Codex display
references/            – design vocabularies, storyboard templates, audio licences
scripts/               – env‑check, audio synthesis, mixing, validation
assets/
  starter/             – minimal React + esbuild + Playwright project (the “engine”)
  fx-lab/              – reusable visual effect samples (particles, streams…)
  fallback/            – default CodePilot UI components (BSL‑licensed)
  audio/               – two example music tracks + 11 synthetic sound‑effects
  readme/              – images used in this README
tests/                 – unit & integration tests for the pipeline

The repo also ships a GNU AGPL‑3.0 licence for the core workflow, with a separate Business Source License for the default CodePilot UI assets.

Limitations & practical notes

The skill is not a one‑click video generator – the AI still needs access to the target repo, its dependencies, and a runnable build so that real components can be rendered.
It works best with React‑based front‑ends; other frameworks can be integrated via the integration.config.mjs mapping, but may require extra glue code.
Commercial use of the default CodePilot style must respect its BSL; you can replace it with your own branding to avoid that restriction.
Audio generation falls back to a small set of pre‑built synthetic WAV files if no local music‑generation model is available.
The output project is fully editable, so you can fine‑tune timing, replace assets, or re‑render after code changes.

Bottom line

guizang-product-video-skill is a real, open‑source AI‑agent skill that automates the end‑to‑end creation of short, product‑specific promotional videos. It combines code‑driven UI rendering, AI‑written copy, and programmatic audio synthesis, and is intended to be used from AI coding assistants like Claude Code or Codex. If you need a fast, on‑brand demo video for a recent software release, this skill gives you a reproducible, editable pipeline rather than a static template.

Repository last updated 2026, licensed under AGPL‑3.0 with a commercial‑licensing option.

op7418/guizang-product-video-skill