33.8-second example rendered by this skill from examples/trialcloud · 1280×720
Example settingswhat each example above was built from
examples/trialcloudbrief.json
- Brand
- Northdesk
- Name
- trialcloud
- Headline
- of trials become paying teams
examples/hirewellbrief.json
- Brand
- Fieldhouse & Co.
- Name
- hirewell
- Headline
- of applicants become colleagues
What you get
- A 1080p MP4: about 34 s for 5 stages, 38 s for 6 and 25 s for 3
- A channel drawn to each stage’s true share, with a lost pile, count and reason at every gate
- A camera that zooms as the stream narrows, with a minimap and the zoom factor on screen
- An optional improved stage that widens on screen with an old-vs-new badge
- A closing sankey with every rate and loss, under a headline with the overall rate
- Two looks (glow and paper), an original soundtrack written by code and two made-up example films
- Open-source licenses for every part it builds on
Good fit
- SaaS and product teams can show where a trial cohort drops off, and what an onboarding change won back, in one film.
- Recruiters and hiring teams can share a hiring round from applicants to hires, with the reason people left at every stage.
- Founders get a funnel for an investor update that moves, with every rate and loss on the closing sankey.
Not for
- More than 6 stages, or a last stage under 0.4% of the first
- Counts that go up from one stage to the next
- Vertical or square social cuts (16:9 only)
About this skill
A conversion funnel told as one continuous pour of particles. The channel is as wide as each stage’s true share of stage 1, and at every gate the people who drop out peel off to the right into a growing lost pile with its count and reason. The camera zooms as the stream narrows, with a ghost minimap and a zoom factor that keep the scale honest. One improved stage can widen on screen with an old-vs-new badge. At the end the camera rolls 90° so the whole funnel lies across the frame as a sankey with every rate and loss, then your brand and URL, with an original 110 BPM soundtrack.
Example request
Make a Funnel Flow Film of our Q3 trial cohort for https://northdesk.example: 48,000 trials down to 2,210 paying teams in five stages, with the onboarding stage shown as improved.
How it works
Your agent
- 1
Ask the user for the funnel
Never invent numbers.
- 2
Write the brief
Start from
<skill>/examples/trialcloud/brief.json(glow, with an improved stage) or<skill>/examples/hirewell/brief.json(paper, six stages). - 3
Make the film
(Leave out
GSAP_FILEwhen jsDelivr is reachable.) The script copies the template intomy-film/and applies the brief. - 4
Check before you hand it over
Look at the sheet.
- 1
You get
- trialcloud-1080p.mp4
What you need
- Node.js 22 or newer and FFmpeg on the PATH.
- HyperFrames through
npx, pinned:npx --yes hyperframes@0.8.192. The first render downloads its own headless Chrome (npx --yes hyperframes@0.8.192 browser ensureif it says Chrome is missing). - Network access to
fonts.googleapis.comandcdn.jsdelivr.net(GSAP) while rendering. If jsDelivr is blocked, setGSAP_FILEto a localgsap.min.js3.14.2;make-film.mjscopies it into the project and points the page at it. - The funnel's numbers: one count per stage, widest first.
Last checked Nov 2, 2026: the package’s own build and render commands ran and passed.
If something goes wrong
apply-brief stops with a list of problems.
Each line names the field and the limit; fix them all and run again. The most common ones are a count higher than the stage before and a reason on stage 1.
The console prints
[funnel-flow] text too long.That line did not fit even at its smallest size; shorten it in the brief.
The render stops with "Chrome is missing".
Run
npx --yes hyperframes@0.8.192 browser ensureonce, then render again.
What’s in the download
- SKILL.md11.8 KB
- examples/
- examples/hirewell/1.11 KB1 file
- examples/trialcloud/1.19 KB1 file
- scripts/
- scripts/apply-brief.mjs13.0 KBchecks the brief, writes the beat sheet,
storyboard.js, fonts and music into the project - scripts/color.mjs1.40 KBcolour helpers (contrast, mixing)
- scripts/make-film.mjs4.79 KBone command from brief to MP4 (template, brief, music, render;
GSAP_FILEsupport) - scripts/music.mjs18.5 KBwrites the original 110 BPM soundtrack and its sound design from the cue sheet
- template/
- template/cues.json1.64 KBthe default beat sheet (rewritten for each brief)
- template/film.css6.13 KBlayout and type
- template/film.js51.8 KBthe particle field, camera, gates, lost pile, sankey roll and all type on one GSAP timeline
- template/hyperframes.json298 B
- template/index.html1.93 KBthe HyperFrames composition
- template/package.json195 B
- template/storyboard.js3.42 KB
- NOTICE.md1.14 KB
- TESTED.json1.62 KB
16 files · 120 KB · installs to ~/.claude/skills/funnel-flow-film for Claude Code and ~/.agents/skills/funnel-flow-film for other agents
Credits and licenses: NOTICE.md plus any LICENSE files inside the ZIP.
Similar Skills
View allDetails
- Output
- MP4 · 25–38 s · 1080p · with music
- Needs
- Node.js 22+, FFmpeg and Chrome
- Series
- Data Stories · 10 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
How many stages can the funnel have?
3 to 6, widest first, each count no higher than the one before. The last stage must be at least 0.4% of the first; if it is smaller, start the funnel at a later stage.
Can it show an improvement?
Yes. Mark one stage, not the first or last, as improved, with its old count and a label for the old way. The stage first shows the old figure, then the channel widens to the new one and a badge shows the change.
How long is the film?
About 25 s for 3 stages, 34 s for 5 and 38 s for 6, at 1080p with an original 110 BPM soundtrack generated on the same beat sheet.
Which agents is Funnel Flow Film 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: the particle pour, the lost pile, the zoom and minimap, the sankey roll, the brief checks and the soundtrack generator.
Credits and licenses for the open-source software and fonts it uses are in NOTICE.md inside the download.