Four skills, each loaded automatically when a request matches its description. They hand off to each other, so an agent starting a project ends up with all four.
| Skill | Teaches | Loads on requests like |
|---|---|---|
framefields |
Checking Node/GPU, writing package.json with the right install-script approvals, installing, scaffolding theme.ts / film.ts / render.ts, Git LFS for media, a first verified render |
“Make a video with framefields”, “set up framefields in this repo” |
framefields-compose |
Compositions and layer trees, flex layout, typography and fonts, keyframes and easing, text animators, scenes on a beat grid, transitions, mattes, 3D looks, charts | “Add a title sequence”, “animate these cards in on the beat”, “make the logo spin in 3D” |
framefields-effects |
Attaching effects to layers, whole films and regions; grading, grain, blur, LUTs, keying; signals on effect props; on-device vision (tracking, cutouts, pose) | “Add film grain and a vignette”, “put the headline behind the dancer”, “blur the faces” |
framefields-render |
The verification ladder: lint, single frames, frame grids, pixel tests, live preview and pinned notes, MP4 export with QA, diagnosing blank frames | “Render a frame grid of the intro”, “why is frame 40 black?”, “export the final MP4” |
What they make an agent do differently
Section titled “What they make an agent do differently”- Verify cheapest first. Typecheck and
comp.lint()before any GPU work; frames and grids before a full render. - Look at its own output. Render a PNG, open it, and compare against intent — not assume.
- Keep tokens in one place. Colors, sizes, fonts and the beat grid live in
theme.ts. - Avoid the classic breakages. Fonts registered first, local integer keyframes, absolute vs flex positioning,
durationFrameson audio,process.exit()after rendering. See Authoring rules. - Bring a person in before exporting. Start the preview, share the URL, and act on pinned notes.
Where they come from
Section titled “Where they come from”The skills are versioned with the framefields package and live in the framefields repo at plugins/framefields/skills/. framefields-effects includes a generated catalog of every effect and prop. If a skill gets something wrong, open an issue.