herk-edit-kit README

The project's README from github.com/nateherkai/herk-edit-kit. As one markdown file: README.md.

HyperFrames Student Kit

Nate Herk's reusable video-editing kit for Codex and Claude Code. Bring your own footage. Cut dead air, review mistakes, plan the story, and build motion graphics with HyperFrames and GSAP.

Examples

Four finished videos made with this kit.

YouTube motion showreel

Made with the motion-showreel skill: 15 seconds, 1920x1080, 60fps, cut to a 129 BPM grid. The red scrubber dot travels through seven craft chapters and lands as the play button in the logo.

https://github.com/user-attachments/assets/056b46e9-7379-4e71-b825-20fb9f8e9555

The three short-form videos below were created by Nate. Press Play on any video to watch it here in the README.

Curiosity reel: unlock your project

https://github.com/user-attachments/assets/920cc3b7-6ef0-4324-aa98-870c1c2a07c5

Curiosity reel: build a better AI system

https://github.com/user-attachments/assets/ba468302-fe07-4e4c-949b-68951dd84625

AIS Live ad

https://github.com/user-attachments/assets/4ad48761-d14c-407a-9dec-1b76a9afb04a

What's included

Tools and optional services

Nate uses ElevenLabs Scribe to transcribe and Kie.ai to generate videos and image assets. Bring your own API keys and credits when using those services. You can ask the assistant to use OpenAI Whisper or local Whisper instead, or supply an existing word-level transcript. Generated assets are optional.

The local starter needs no paid transcription or generation API. See the tools, accounts, and API-key guide for required tools, optional services, setup details, and prompts you can copy.

Install

Install Node.js 22 or newer, Git, FFmpeg (including ffprobe), and Chrome or Chromium. Make node, ffmpeg, and ffprobe available in your terminal. Then run these commands in PowerShell, macOS Terminal, or a Linux shell:

git clone https://github.com/nateherkai/hyperframes-student-kit.git
cd hyperframes-student-kit
npm ci
npm run setup
npm test

Setup checks the tools and creates .env only if it is absent. Add only the keys for services you choose. The included transcription helper uses ElevenLabs; Whisper and Kie.ai integrations need the setup described in the tools guide. Setup and troubleshooting.

Render your first example

npm run demo
cd video-projects/demo
npx hyperframes lint
npx hyperframes preview

Scrub the eight-second animation in Studio. After reviewing it, stop the preview with Ctrl+C, then render:

npx hyperframes render --quality draft --output renders/demo.mp4

The demo uses local GSAP. HyperFrames may download and cache its font substitutions on the first render. It has no voiceover. The separate synthetic transcript exercises the cutting tools; it is fictional test data, not a transcript of the title animation.

Edit your footage

Open this repository folder in Codex or Claude Code and say:

Use edit-video to edit my recording at [local path]. Keep my examples and core lessons. Tighten dead air, show me the proposed mistake cuts, and use the dark graph-paper style with occasional glass cards. Produce a reviewed draft.

Codex: $edit-video. Claude Code: /edit-video. For a single operation use cut-silences, cut-mistakes, video-storytelling, or style-library. See the step-by-step workflow, prompt recipes, and storytelling workbook.

Create a reel or YouTube Short

Use short-form-edit to turn my recording at [local path] into a 9:16 reel. Build a truthful hook and payoff, preserve my meaning, tighten mistakes, and add precise captions, purposeful moving footage, and sound design. Prepare a draft for review. Use my existing footage before proposing generated assets.

Codex: $short-form-edit. Claude Code: /short-form-edit. The skill includes planning references and validators for caption timing, source mapping, scene coverage, and footage reuse. It is an agent-guided workflow; review the actual motion and audio before publishing. Short-form walkthrough and validation commands.

Make a motion-design showreel

Use motion-showreel to make a 15-second showreel for [brand]. Study my reference reel at [local path] if I give one. Pick one motif that transforms through every chapter, cut on the music's beat grid, and end on the logo. Show me the storyboard and beat sheet before building, and confirm before any paid music or asset generation.

Codex: $motion-showreel. Claude Code: /motion-showreel. The skill includes a measured breakdown of the reel it was built from, a chapter technique library, a HUD template, and Node tools to analyze a reference video, measure a music take's beat grid, splice it onto the cut grid, and premix sound effects.

Existing examples and migration

This is the main student-kit repository. The newer video-pipeline kit has been merged here with both Git histories preserved. The original 12 projects remain in video-projects/, alongside the original shared brand examples and the make-a-video, short-form-video, and website-to-hyperframes skills. Use short-form-edit for new reels; short-form-video documents the older May Shorts compositions. Migration and compatibility notes.

Explore and customize

Resource Start here
Shared agent instructions AGENTS.md
Motion and transition vocabulary MOTION_PHILOSOPHY.md
Card library and design tokens Library guide
Searchable card metadata registry.json
Whole-scene templates Template guide
Codex setup and mirroring .codex/README.md
Release checks and limits Verification
Third-party resources Notices

The cards are reusable draft assets. Test the cards you choose with your text and footage. Library templates may load GSAP and Google Fonts from their public CDNs; localize these dependencies when assembling a final project.

The three showcase videos were explicitly supplied for public sharing. No other private recordings, transcripts, credentials, or private workspace settings were imported. Previously public examples remain in the repository. New folders under video-projects/ and raw-media/ are ignored automatically; files already tracked by Git remain tracked. Create a new project for your own footage.

herk-edit-kit (nateherkai/herk-edit-kit)

framework
Searching Database…

1.7K ·GitHub
Herk-edit-kit
What is this?HyperFrames Student Kit is Nate Herk's reusable video-editing kit that plugs into Codex and Claude Code, giving them skills to cut dead air, catch mistakes, caption, and build GSAP motion graphics from your own footage.
Is this a standalone video editor or something I run through Codex/Claude Code?It is not a standalone editor — it's 15 skills (with helper scripts and references) mirrored for both assistants, invoked by chat commands like /edit-video or $short-form-edit, that drive FFmpeg cuts and GSAP motion graphics.
How do I get it running?Install Node.js 22 or newer, Git, FFmpeg (with ffprobe), and Chrome or Chromium, then run the setup commands in PowerShell, macOS Terminal, or a Linux shell, which check your tools and create a .env file.
Do I need paid API keys to use it?Only for optional cloud services: ElevenLabs Scribe for transcription and Kie.ai for generated video/image assets. You can swap in OpenAI or local Whisper, supply your own transcript, or use the synthetic starter example, which needs no API key at all.
Does it finish and publish the edit automatically?No — skills like short-form-edit and motion-showreel produce a reviewed draft and show you the storyboard, cuts, or captions first; it's an agent-guided workflow and you must review the actual motion and audio before publishing.
Which operating systems can I run this on?It works cross-platform — the setup commands run in PowerShell, macOS Terminal, or a Linux shell.
What are the 406 motion-graphics cards for?They are draft animated scene cards in two styles (dark graph paper and a glass popout) with manifests, CSS tokens, and editable slots so you can drop in your own text and footage.
What does the motion-showreel skill actually build?Given a brand and optional reference reel, it picks one motif, analyzes the music's beat grid with Node tools, and assembles a 15-second showreel that lands on your logo, backed by a HUD template and chapter technique library.
Why build motion graphics with GSAP instead of a timeline editor?HyperFrames renders scenes as animated web pages with local GSAP, letting the agent script cuts, captions, and transitions in code rather than dragging clips in a GUI timeline.
What happened to the original student-kit projects?The 12 original teaching projects are preserved under video-projects/, and a newer video-pipeline kit was merged into this repo with both Git histories kept intact.
What are similar projects?guizang-product-video-skill, saas-motion-kit, onetake, eian-riso-broll, shuohao-skills, motion-video-kit, godogen, huashu-art-motion
Which topics is it in?transcript, hyperframes, video-editor, motion-design, short-video, motion-graphics, templates, codex-cli, video-editing, whisper, codex-skill, claude-code-skill
Creator
nateherkai
Size
449.3 MB
Stars
1.7K
Updated
CommitOct 14
Age
5mo
Commits · 90 Days