Free
Ember & Bun · 4:5
Rendered by this Skill
Leaderboard Race v1.0.0
A leaderboard where each person's avatar bounces across their row at a speed set by their count, top performer fastest.
No ratings yet 0 downloads
- Format
- Video · 4:5
- Length
- 0:16
Free Free with an account
Paste this into your agent. It connects the CLI if needed, then installs the Skill.
A free HyperFrames block for a 16-second 4:5 leaderboard. Under an eyebrow, a title, a period and a total, each person gets a row with their name and count, and their avatar or initials bounce across the row; the more they did, the faster they go. Eyebrow, title, period, total, footer, source and the rows (name, count, avatar) are variables; the background is transparent.
Updated Nov 4, 2026
What you get
- A 16-second 1080×1350 leaderboard with a transparent background
- Avatars that bounce at speeds set by each count
- Variables for every label and the rows
Good fit
- Team and community shout-outs
- Sales, delivery and support leaderboards
- Open-source contributor recaps
Not for
- Dozens of people
- Precise comparisons
About this Skill
You say
/week-in-merges Make a leaderboard race for Ember & Bun: "Orders delivered this week", 27 October to 2 November, 412 orders, riders Sam 96, Priya 88, Leo 74, Ana 66, Tomas 51 and Mei 37.
Leaderboards make results fun. Leaderboard Race turns a week of numbers (deliveries, sales, sign-ups, pull requests) into a race where every person bounces across their row at their own speed, so the leader is obvious and everyone gets a moment.
How it works
- Ask: tell your agent who is on the board, each person's count, what is being counted, and the period.
- Fill: it writes your copy and colours into the block's variables, keeping text close to the length the layout was made for.
- Render: it renders a draft with
npx hyperframes render, checks a few frames and renders the final MP4. - Reuse: the variables live in one small JSON file, so the next version is one more render.
Tips
- Six to eight rows read best in 4:5.
- Use photos as avatars, or leave them empty for initials.
- The background is transparent, so render it with an alpha channel and lay it over your own footage, photo or a plain colour; the SKILL.md shows the two commands.
- Post it in LinkedIn or Instagram feeds; it is built at 1080×1350.
Open source
This is a block from the HyperFrames registry, made by HeyGen and the HyperFrames contributors (heygen-com/hyperframes) and shared under the Apache License 2.0. The download is the block with its assets and a SKILL.md written by Reelity, so your agent knows how to fill and render it; HyperFrames itself runs from npm.
What you need before you start
- You bring
- Names and counts for six to eight people, what is counted and the period.
- Dependencies
- Node.js 22 or newer — required · FFmpeg — required
- Outside costs
- None. HyperFrames is free and open source and renders on your own machine.
- Last tested
- v1.0.0 —
User reviews
No reviews yet. Install the Skill and be the first to rate it.
FAQ
What does it count?
Anything: the sample counts deliveries. The unit word is set in the HTML, and every label is a variable.
Can I add photos?
Yes. Each row takes an avatar image; empty rows show initials.
Why is it free?
It is an open-source HyperFrames block by HeyGen and the HyperFrames contributors. We list it as it is, with a SKILL.md so your agent can use it and a sample made with one of our house brands, Ember & Bun.
