The one who built this.
2026 · Node.js · Hyperframes · GSAP · FFmpeg · Chrome DevTools Protocol · GitHub Actions · node:test · Python · uv

shipreel

A Claude Code skill and CLI that turns a codebase into a short launch video: it reads the project, captures the running UI, renders it, and then checks its own output. Forked from Shunit Haviv Hakimi's /brag and rebuilt into a verified pipeline — 36 scripts, 234 tests, 26 platform presets.

shipreel screenshot

01 — the brief

shipreel starts from a fork of /brag, a Claude Code skill that renders a launch video from a project using Hyperframes.

The original was a prompt and a set of assets: it told an agent how to make one landscape video. This version is the pipeline around that idea. It reads the project the way a person would — package metadata, README, routes, git history — then boots the dev server and captures the real UI with headless Chrome rather than inventing screenshots. It writes an HTML composition, renders it, and audits the result: duration and frame size, an audio track that is not silent, loudness mastered to -14 LUFS, the poster baked into frame 0 so every platform's thumbnail is the frame you chose, on-screen text large enough to read on a phone and held long enough to read at all, and WCAG contrast on every line. Delivery is the other half. One plan reflows to 16:9, 9:16, 1:1, 4:5 and 2:3; 26 platform presets carry each service's safe zones, caption mode, duration window and size budget, sourced from the platforms' own documentation, so an export is ready to upload rather than ready to fix. Every on-screen claim is cited to a file and quote in the repo, so a video cannot say something the project cannot back up. It ships itself too: a launch kit (videos, covers, Product Hunt gallery, an X thread, a LinkedIn post, embed snippets, credits), a patch that embeds the video in the project's own landing page, release videos built from git tags, before/after preview clips for pull requests, a GitHub Action that needs no API key, and a standalone CLI for people who do not use a coding agent. It is tested the way a renderer has to be: 234 tests run on every push, golden reference frames catch unintended visual changes, and a nightly job renders a real composition against the latest Hyperframes so an upstream break surfaces within a day.

02 — what it does

  • 01Reads the project's own code and git history to plan the video
  • 02Captures the running UI with headless Chrome, not stock imagery
  • 03Renders HTML compositions to MP4 through Hyperframes
  • 0426 platform presets: safe zones, caption mode, size and duration budgets
  • 05Verifies each render: duration, audio, loudness, baked poster
  • 06Audits on-screen text for phone legibility and reading time
  • 07Burned captions, covers, cutdowns, stories, carousels, localisation
  • 08Cites every on-screen claim to a source file and quote
  • 09Release videos from git tags; before/after preview clips on pull requests
  • 10Golden-frame regression plus a nightly render against the latest Hyperframes
  • 11Launch kit and a site-embed patch for distribution
  • 12Standalone CLI for people without a coding agent

03 — the frames

shipreel — frame 1
shipreel — frame 2

04 — the stack

Node.jsHyperframesGSAPFFmpegChrome DevTools ProtocolGitHub Actionsnode:testPythonuv

05 — adjacent evidence

Want one of these?

start a project← all work