Animated changelog videos (the 60-second release reel)

The product changelog used to be a wall of text on a page nobody read. The last three years it's become a marketing surface — Stripe, Linear, Resend all ship beautiful weekly changelogs that get linked in tweets. The next step is a short video version of the changelog, shipped alongside the text.

Same source, two outputs. Here's the pipeline that makes it cheap enough to do every week.

The source of truth

Your written changelog probably already lives as markdown — a CHANGELOG.md or per-release MDX files. Don't introduce a second source for the video. Parse the same markdown and drive the video from it.

A release entry looks like:

---
title: "v4.2 — Custom domains"
date: "2026-05-19"
summary: "Bring your own domain. Faster sign-in. Audit log for admins."
highlights:
  - { title: "Custom domains", icon: "globe" }
  - { title: "10× faster sign-in", icon: "zap" }
  - { title: "Admin audit log", icon: "shield" }
---

The video is built from these fields. Title → first scene. Each highlight → one scene. Summary → final scene. The structure is enforced by the schema — every release video has the same beats.

The scenes

Three scene types cover 90% of release videos:

1. Title card. Big version number, release name, date.
2. Feature highlight. Icon, headline, one-line description.
3. End card. Brand mark, install command, link.

For visual variety, you can swap in:

• A KPI card scene (We shipped 18 features this month).
• A clip-reveal headline (for the release codename).
• A wipe transition between feature highlights.

Each scene is 3-5 seconds; a release video is 30-60 seconds total.

The build step

A script that runs in CI on every release:

async function buildReleaseVideo(slug: string) {
  const release = parseReleaseMarkdown(`changelog/${slug}.mdx`);
  const scenes = [
    { template: "title-card", vars: { title: release.title, date: release.date } },
    ...release.highlights.map((h) => ({ template: "feature-highlight", vars: h })),
    { template: "end-card", vars: { install: "npm i your-package" } },
  ];
  const mp4s = await Promise.all(scenes.map(renderScene));
  await ffmpegConcat(mp4s, `public/releases/${slug}.mp4`);
}

The video is committed (or uploaded to a CDN) alongside the text release. The announcement tweet references it. The release page embeds it. The release email includes a poster image + a "watch the release" link.

Time costs

A 60-second release video at 1080p, 30fps:

• 1800 frames × ~100ms render per frame = ~3 minutes of headless Chromium time.
• Plus ~10 seconds of encode.
• Plus ~5 seconds of concat.

A standard CI runner ships the video as part of the release workflow without slowing anything down meaningfully.

What to put in (and what to leave out)

Three rules I've shipped behind:

1. One highlight per scene. Two highlights crammed into one card looks like a spec sheet. Three or four highlights, each on their own card, reads as a release.
2. No release-name jokes in motion. A pun in text is fine; an animated pun in a release video ages badly.
3. End on the install command, not the marketing line. Developers screenshot the install command. Make it big.

The longer "git-for-video" argument is in git for video. The deterministic-CI piece is in deterministic video rendering in CI.

A close

A weekly release video is one of those things that costs nothing once the pipeline exists and would be unimaginable to do by hand. The pipeline is markdown frontmatter → scene templates → ffmpeg concat. The first one takes a day; every one after that takes zero. The reason most teams don't ship release videos is that they assume each one costs a day. With this pipeline, no one ever does.