Summarize Video Releases

Turn a monthly What’s New post into a short, fast-paced marketing video that shows the month’s changes with real Elements components, CLI output, and lint results. The post is the source of truth. This skill runs after summarize-releases and adds a WebM video, its WebP poster, a static WebP snapshot of each showcased feature in the corresponding post section, and three video metadata fields in the post frontmatter.

The video should make someone who has never used Elements want to read the post. It should be accurate to the release, legible at 1080p, and consistent with the Elements design language.

How the pieces fit

The scripts own everything that must be exact; you own the story and the markup.

• scripts/read-post.js parses the post into a JSON outline and resolves the input and output paths.
• You write a storyboard JSON: scene order, copy, durations, and nve-* demo markup. See references/storyboard.md.
• scripts/compose-video.js turns the storyboard into one static HTML page from assets/video-shell.html. It computes all timing, escapes code, and rejects videos outside 24–36 seconds.
• scripts/render-video.js serves the page with Elements CDN URLs mapped to this repository’s built packages, captures frames on a virtual clock, and encodes VP9 with the browser’s built-in WebCodecs encoder. scripts/webm.js writes the WebM file. The video workflow uses no external encoder: VP9 and its encoder are royalty-free and BSD-licensed. The renderer uses the pinned Sharp dependency to convert PNG screenshots to lossless WebP posters and stills. Output is deterministic: the same storyboard renders the same video.

Prerequisites

Run everything from the repository root.