hyperframes-videolisted

End-to-end video production with HyperFrames (HeyGen's open-source HTML-to-video renderer) plus Whisper and ffmpeg on macOS. Installs the toolchain, scaffolds a project from a video/audio file, auto-transcribes speech to word-level timestamps, burns in synced word-by-word (TikTok/Reels-style) captions, translates captions into another language, and adds motion graphics from the catalog — animated charts, maps, social-media cards, lower-thirds, shader transitions, Kokoro TTS voiceover, background removal — then previews, lints, snapshots, and renders to MP4. Use this whenever the user wants to add subtitles or captions to a video, generate or edit video programmatically, turn HTML/CSS/JS into video, transcribe a clip, translate subtitles, build social/TikTok/Reels/Shorts-style captioned clips, or mentions HyperFrames or HeyGen video — even if they don't name the tool by name.
GiomarDev/ReelForge · ★ 0 · Code & Development · score 70

Install: claude install-skill GiomarDev/ReelForge

# HyperFrames video production (captions, transcription & motion graphics) ## What this is [HyperFrames](https://github.com/heygen-com/hyperframes) renders deterministic MP4/WebM video from plain **HTML/CSS/JS**, captured frame-by-frame through headless Chrome. It is built to be driven by coding agents. This skill pairs it with **Whisper** (speech → word-level timestamps) and **ffmpeg** to cover the full pipeline: > install → scaffold a project from a clip → transcribe → caption (+ translate) → > add motion graphics → preview/lint/snapshot → render to MP4. The CLI is `npx hyperframes <command>`. The model authoring surface is one or more HTML files where timed elements carry `data-start` / `data-duration` / `data-track-index` attributes and animations register a **paused** GSAP timeline on `window.__timelines`. ## When to reach for the bundled scripts vs. the CLI - **Captions/subtitles** are the one place where hand-writing HTML is tedious and error-prone (per-word timing). Use `scripts/generate-captions.mjs` — it turns a Whisper word-level JSON into a finished caption composition. Everything else is usually a direct CLI call or a small hand-written HTML composition. - For transcription, use `scripts/transcribe.sh` (extracts audio + runs whisper-cli with word-level output and sensible defaults). --- ## 0. Install the toolchain (one time) HyperFrames needs **Node 22+** and **FFmpeg**; Whisper needs **whisper.cpp**. Check first with `npx hyperframes doctor` (or