Free
Solenne · 16:9
Rendered by this Skill
Desktop Notification v1.0.0
An animated macOS-style notification banner slides in with your app icon, a title and a message, then slides away.
No ratings yet 0 downloads
- Format
- Video · 16:9
- Length
- 0:05
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 5-second desktop notification. A frosted banner with your app icon, app name, title and one-line message slides in at the top right, holds and slides out. The text and icon are edited in the HTML; the background is transparent so it sits over a screen recording or wallpaper.
Updated Nov 3, 2026
What you get
- A 5-second 1920×1080 notification overlay with a transparent background
- An app icon, name, title and message
- Instructions for laying it over a screen recording
Good fit
- SaaS and app demos
- Tutorials and explainers
- Feature announcements
Not for
- Vertical-only videos
- Long messages
About this Skill
You say
/macos-notification Make a desktop notification from Solenne: title "Evening wind-down is on", message "Lights dimmed to 35%, blinds closed and the heating eased to 19°", over our living room photo.
A desktop notification is the quickest way to show that your product just did something. Desktop Notification animates one in the familiar macOS style over your screen recording or wallpaper: "Evening wind-down is on", "Payment received", "Your export is ready".
How it works
- Ask: tell your agent your app name and icon, a title and a one-line message.
- 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
- Write the title as the result, not the feature.
- Keep the message to one line.
- 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.
- It has no variables: your agent edits the text and numbers directly in the HTML, following the SKILL.md.
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
- Your app name, a square icon, a title and a one-line message.
- 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
Can I show several notifications?
Render it once per notification and stack the clips in your edit, or ask your agent to duplicate the banner in the HTML.
Does it show an Apple logo?
No. It shows your own app icon and name in a macOS-style banner.
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, Solenne.
