23-second example rendered by this skill from examples/larkfield-leek-toast · 1280×720
Example settingswhat each example above was built from
examples/larkfield-leek-toastbrief.json
- Brand
- Larkfield Pantry
- Name
- Charred leeks on toast
- Kicker
- A 25-minute lunch
- Format
- tall
- Colors
- accent #a63a17
examples/night-larder-noodlesbrief.json
- Brand
- Night Larder
- Name
- Miso butter noodles
- Kicker
- Ten-minute supper
- Format
- square
- Colors
- accent #d9782e
What you get
- A 1080×1920 or 1080×1080 MP4 of your recipe, about 20 to 30 seconds long
- Ingredients drawn in code as gouache cookbook illustrations with real shadows
- A list card whose quantities count up as each row lands
- Step cards with a running timer dial while the food browns and steams
- Whip pans along one table, every cut on the beat
- An original soundtrack with synced ticks, whooshes, sizzle and a closing sting
- A layout gate and audio checks that stop the render on any failure
- Open-source licenses for every part it builds on
Good fit
- Food brands that want a recipe reel every week without a photographer, a kitchen or a stylist.
- Cookbook authors and meal-kit companies posting short step-by-step recipes to Reels, TikTok and Shorts.
- Cafes and restaurants turning a signature dish into a calm, editorial social post with their own name on it.
Not for
- Real food photography or footage
- Recipes with more than 5 steps or 7 ingredients
- Talking-head cooking tutorials with voice-over
- Long-form recipe videos or full cooking classes
About this skill
An overhead recipe short drawn entirely in code. The camera looks straight down on a stone counter and travels along it station by station. Ingredients drop onto the table with shadows that tighten as they land, and a paper card lists them while each quantity counts up. Every step is a numbered card whose dial is a running timer, and while it runs the food in the pan browns, chars and steams. A whip pan on the beat carries the camera to the next station, and the film ends on the plated dish with the recipe name. The food is painted like a gouache cookbook plate, with irregular shapes, glints and contact shadows. An original soundtrack with ticks, whooshes and a sizzle is generated and synced to every event.
Example request
Use the recipe-steps-short skill to make a 9:16 recipe short for my brand. Here is the recipe: name, 3 to 7 ingredients with amounts, 3 to 5 steps with their times, and how it is plated. Keep my amounts and times exactly, condense the steps to 7 words or fewer each, show me the brief before you render, then apply it, look at the snapshots and render it with the music.
How it works
Your agent
- 1
Make the project
- 2
Get the recipe
Ask the person for the recipe as they cook it: the name, the ingredients with their amounts, and the steps with their times.
- 3
Write the brief
Create
brief.jsonin the project. - 4
Apply it
It checks every field and lists every problem at once, writing nothing until there are none.
- 5
Look, then render
Look at every snapshot before you render.
- 1
You get
- renders/recipe-steps-short.mp4


What you need
- Node.js 22 or newer and FFmpeg (with
ffprobe) on the PATH. FFmpeg also checks and mixes the sound. - Google Chrome (or the headless Chrome HyperFrames downloads). HyperFrames runs through
npx, pinned:npx --yes hyperframes@0.8.192. Ifrendersays Chrome is missing, runnpx --yes hyperframes@0.8.192 browser ensureonce. The layout gate drives the same Chrome. - Network access to
fonts.googleapis.com(Fraunces, Instrument Sans) andcdn.jsdelivr.net(GSAP).
Last checked Nov 2, 2026: the package’s own build and render commands ran and passed.
If something goes wrong
A word is too long for the card.
Shorten the step (
apply-briefrefuses words over 13 letters) or use fewer words. The card sets 2 to 3 lines and shrinks the type only down to the readable minimum.The gate fails T2 (safe area).
A name of 4 or 5 long words can push the serving line low in 9:16. Shorten the name.
A long ingredient row widens the card.
The card grows (up to the safe area) instead of spilling off. In 1:1, keep names to about 12 characters.
What’s in the download
- SKILL.md12.3 KB
- examples/two briefs for invented brands.
- examples/larkfield-leek-toast/1.28 KB1 file
- examples/night-larder-noodles/1.25 KB1 file
- scripts/
- scripts/gate/
- scripts/gate/cdp.mjs5.63 KB
- scripts/gate/gate.mjs19.5 KB
- scripts/music/beatgen 2.1, the procedural music and effects generator, with
check.mjs. - scripts/music/examples/
- scripts/music/examples/events.example.json555 B
- scripts/music/samples/
- scripts/music/samples/manifest.json371 B
- scripts/music/beatgen.mjs11.8 KB
- scripts/music/check.mjs50.2 KB
- scripts/music/dsp.mjs20.0 KB
- scripts/music/engine.mjs51.7 KB
- scripts/music/mux.mjs2.36 KB
- scripts/music/presets.mjs36.8 KB
- scripts/music/README.md23.7 KB
- scripts/music/samples.mjs4.90 KB
- scripts/music/sfx.mjs17.1 KB
- scripts/music/theory.mjs3.34 KB
- scripts/music/voices.mjs16.9 KB
- scripts/apply-brief.mjs20.2 KBchecks the brief and writes the project.
scripts/beat-grid.mjshandles the beat grid and the beatgen calls, andscripts/cooking.mjsmakes the sizzle and simmer. - scripts/beat-grid.mjs13.0 KB
- scripts/cooking.mjs3.76 KB
- scripts/render.mjs8.34 KBthe gate, the render, the sound check and the mix.
scripts/gate/is the layout gate. - template/
index.html(the composition),reel.js(layout, camera, timeline),food.js(every ingredient, vessel, steam and drizzle),data.js(written by apply-brief). - template/data.js4.63 KB
- template/food.js38.3 KB
- template/hyperframes.json318 B
- template/index.html6.29 KB
- template/package.json312 B
- template/reel.js24.1 KB
- NOTICE.md1.65 KB
- TESTED.json3.61 KB
30 files · 404 KB · installs to ~/.claude/skills/recipe-steps-short for Claude Code and ~/.agents/skills/recipe-steps-short for other agents
Credits and licenses: NOTICE.md plus any LICENSE files inside the ZIP.
Similar Skills
View allDetails
- Output
- MP4 · 23 s · 1080×1920
- Needs
- Node.js 22+, FFmpeg with ffprobe, and Chrome (HyperFrames drives it headless through npx)
- Series
- Social Shorts · 14 skills
- Updated
- Nov 2, 2026
- Checked
- Nov 2, 2026: its own commands ran and passed. That is a working check, not a security audit.
Written for
See all 31 agents that read skill folders.
Install guides
For your agent
Generates with
Installed it? Tell others how it went. Reviews come from people who installed this skill.
Write a reviewFAQ
Which ingredients can it draw?
Lemon, leek, garlic, white beans, olive oil, sourdough, parsley, chilli, spring onion, butter, miso, egg, noodles and tomato. Each ingredient picks the nearest drawing by look, so noodles cover udon or spaghetti and beans cover chickpeas. In the pan or on the plate they are drawn cooked: beans loosen, chilli becomes rings, butter melts.
How long is the film?
With 6 ingredients and 3 steps it runs about 20 to 30 seconds at the default tempos. The layout is counted in beats, so a slower music preset or 5 steps makes it longer, and apply-brief prints the exact length before anything renders.
Can I use it in a square post?
Yes. Set format to square for 1080×1080: the card sits on the left, the vessels and the plate on the right, and the name runs across the top on the final plate. The tall format keeps all text in the band the platform buttons leave clear.
Which agents is Recipe Steps Short written for?
Any agent that reads SKILL.md folders, including Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI and OpenCode.
Do I own what I make with it?
Yes. Everything your agent makes with this skill is yours, including for client and commercial work.
What if it doesn’t work for me?
Email support@lookbk.dev within 7 days of buying and we’ll fix it or refund you.
Credits and licensesBuilt on heygen-com/hyperframes
What Lookbk adds on top of heygen-com/hyperframes (Apache-2.0): Lookbk wrote this package from scratch on HyperFrames (Apache-2.0) and GSAP (Standard License), with Fraunces and Instrument Sans (SIL Open Font License 1.1) and a soundtrack synthesised by the bundled beatgen.
Credits and licenses for the open-source software and fonts it uses are in NOTICE.md inside the download.