CommunityCoding & Developmentgithub.com

thativanng/reels-maker

The gates every code-rendered film passes before anyone sees it. A 40 fps collision pass (no mover touches a solid or another mover), pixel probes (nothing sits over or behind a face, a head, a subtitle or the frame edge), then an independent auditor (a fresh agent) who reads frame sheets at ≥2 fps and signs off. The builder never signs off their own film. Use it before sending ANY render, after every fix round, and whenever someone says "check the film", "audit this", "is it ready", or "why does this frame look wrong".

What is reels-maker?

reels-maker is a Claude Code agent skill that the gates every code-rendered film passes before anyone sees it. A 40 fps collision pass (no mover touches a solid or another mover), pixel probes (nothing sits over or behind a face, a head, a subtitle or the frame edge), then an independent auditor (a fresh agent) who reads frame sheets at ≥2 fps and signs off. The builder never signs off their own film. Use it before sending ANY render, after every fix round, and whenever someone says "check the film", "audit this", "is it ready", or "why does this frame look wrong".

Works with~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/thativanng/reels-maker/tree/HEAD/skills/film-audit

Installed? Explore more Coding & Development skills: steipete/bluebubbles, steipete/eightctl, steipete/blucli · View all 6 →

Ask in your favorite AI

Open a new chat with this agent skill pre-loaded.

Documentation

film-audit: no film goes out without these checks

Where the kit lives: run every command in this skill from the reels-maker folder (the clone of github.com/thativanng/reels-maker that holds template/ and tools/). If the project has none, set it up first by following that repo's SETUP.md.

The rule: a film goes to the person only when (1) the collision pass says NO COLLISIONS, (2) every "is X over a face" worry has a pixel number, and (3) an independent auditor has signed off with no MUST-FIX open. A 1-fps look by the person who built it is a sketch check, not a gate. A fix moves other things (moving a speech bubble once pushed it off the frame), so every fix round gets a narrow re-check of the windows it touched.

Gate 1 · Collisions in 3D (node tools/collide.mjs)

  • The page exposes window.collide(t). It compares the bounding boxes of every mesh in AUD_M (things that move) against AUD_S (things that stand) and against each other, after shrinking each box by 0.03.
  • Register every new mover and solid, or the check cannot see it. Thrown boxes, carried cups, passing cubes and floating viruses all count as movers.
  • Contacts that are meant to happen (a cup in a hand) are excluded by name, in HELD.
  • Meshes under 0.12 units tall (floor decals, road markings, thin plates) are skipped, so a flat thing can't raise a false alarm. A real thin mover needs its own check.
  • Run it at 40 fps (STEP=.025, the default). At 10 fps it missed two one-frame contacts: thrown boxes through two people's heads.
  • Output is one line per pair: from–to s A × B depth (frames). Ship only on NO COLLISIONS.

Gate 2 · Pixels on screen (node tools/probe.mjs)

Some defects never touch in 3D. A bottle cap 3 m behind someone's head can still look like it's growing out of their hair. Measure the screen:

node tools/probe.mjs "4.4,4.6,4.8" "D.CUPS[0]" "head"   # overlap of a cup and the hero's head, in pixels
node tools/probe.mjs "24.5,26" "head" "pill"           # is the head behind the subtitle?
node tools/probe.mjs "3.0,3.5" "D.GUESTS[1].v.root"    # one rectangle: is this person inside the frame?
  • Read overlap: [x, y] (both > 0 means on top of each other), gapY, and inside (A sits wholly within B).
  • On any page, 2D included: sel:<css selector> is what an element actually paints (its letters, measured line by line, plus any background, border or image) and safe is the platform's keep-clear core (from window.FILM.safe). Every word on screen must be inside: true against safe at every beat:
    node tools/probe.mjs --page reels/<name>/page.html --format 9:16 "2,6.4,10.4" "sel:.title,.line,.kicker,.handle,.cap" "safe"
    
  • To try a camera key without editing the file, pass PRE (it runs before each time): PRE="window._CK.find(k => k[0] === 23.8)[1] = window._dbg.A(72.2, 10, 31, 72, 5.2, 1.5)" node tools/probe.mjs "25,28" "head".
  • Boxes are conservative (a bounding box is bigger than the shape), so a few px of overlap may be clear in reality. The auditor's crop decides.

Check every one of these with a number before you render:

  • Every word, caption and logo inside the platform's keep-clear zone (safe, from template/formats.json). On organic 9:16 reels that is the middle band (the app covers the bottom quarter and the right-hand button rail); on a paid reel, everything above the bottom 35%
  • Anything near a face: caps, screens behind the head (the halo), cubes passing, props at the mouth
  • The hero against the subtitle pill during camera moves
  • The speech bubble against the frame edge and nearby props
  • People and vehicles against the frame edge (≥24 px is safe)
  • Flying things (thrown boxes, coins, virus clusters) against every head they pass

Gate 3 · The independent auditor

Start a FRESH agent (never the builder, never one that saw the build) with references/auditor-brief.md.

  • It reads the rendered MP4, not the live page: ffmpeg -i out/film.mp4 -vf fps=2 …, then timestamped sheets (tools/sheet.py).
  • ≥2 fps for the whole film, ≥4 fps on every changed window, frame by frame (30 fps) at contact points such as a pick-up or a hand-off.
  • It answers per item: FIXED / NOT FIXED / REGRESSED / NEW, ranked MUST-FIX / NICE-TO-FIX, then one line: SIGN-OFF or NOT.
  • A re-check after fixes is narrow: only the windows the fixes touched, plus a short regression look. It can be cheaper to start a fresh agent than to resume one that carries its whole history.

What auditors kept finding (look for these first)

  • Something touching or behind a head: a bottle cap in the hair, map pins behind the head, a monitor glowing behind the head, a cube across a chin
  • Things passing through things: trucks through buildings and through each other, a van parked under a desk
  • Logic: a truck docking nose-first, the second truck overtaking the first, a cup left on a table's edge that should fall
  • People: two people standing so close their heads fuse into one figure; someone half outside the frame
  • Motion: a one-frame jump (teleport), things dropping through the floor in 0.1 s, the hero vanishing between scenes
  • Words: text inside a zone the platform's buttons cover, Chinese broken in the middle of a word, a banner out of step with its scene, mixed UK/US spelling, a number nobody can defend, the subtitle covering the hero
  • Sound: whooshes, a cue that's inaudible under the music, cues drifting after an inserted beat

Individual skills in this repo

This repo contains 4 individual skills — each has its own dedicated page.

thativanng/reels-maker

Build and render a film, reel or animation as code. One HTML page draws any frame on demand with window.seek(t), and a headless browser renders every frame at 2x into an MP4 with sound. Use it whenever someone wants a video made with code rather than a video generator, says "make a film / reel / animated explainer / career video", "render this to MP4", "turn this page into a video", or needs the finishing steps (audio cues, loudness, colour-safe encode, phone preview). It is style-agnostic and renders 9:16, 4:5, 1:1 or 16:9. It runs after reel-intake (the brief) and reel-style (the look), builds on template/starter.html or a style pack such as voxel-walk, and passes film-audit before anything is shown to anyone.

thativanng/reels-maker

The interview before any video is built. It reads what the person already gave (source text, CV, links, brand files), then asks the rest in a few short rounds of numbered questions with a recommended answer marked, always including the format (platform, reel or video, ratio, layout, length, sound). It ends in a one-screen brief that splits "you said" from "I assumed", plus a storyboard, and builds nothing until the person says yes. Use it whenever someone asks for a reel, a video, an explainer, a career film, an animation or a "make a video about X", before film-engine or any style pack, and again when a request changes its purpose, platform or audience mid-way.

thativanng/reels-maker

Picks the look of a reel or film before it is built. It shows three genuinely different looks as stills of the same opening frame with the same words, so the person judges the look and not the content. It keeps a log of every look ever shown, so no look comes back unless asked for, and it locks one look on purpose for a series. Use it after reel-intake's brief is signed and before any test strip, whenever someone says "what should it look like", "give me options", "make it look different from last time", "it looks cheap", or starts a new reel or a new series.

thativanng/reels-maker

The voxel career-film style. A blocky 3D version of the person walks, without ever vanishing, through one scene per role. Their outfit changes as they walk, each scene rises out of the floor ahead of them, and a dark banner tracks year, company and role. Use it when someone wants their career, a journey or a "how I got here" told as a short 3D film for LinkedIn or a portfolio, says "make my career film", "turn my CV into a video", "voxel film", or wants a new chapter added to an existing one. It runs on film-engine (render, audio, finish) and must pass film-audit before anything is sent.

Related Skills