Droplet Burst Logo Revealv1.0.0
Use this Skill to make a launch video.
- Yours to keep: the files stay on your computer.
- Payment by Waffo Pancake, our merchant of record.
- 38 free Skills to try first
A logo sting skill for Claude Fable 5: liquid beads pool, your mark rides inside too warped to name, the bead bursts and one sharp lockup stays. MP4 and project included.
Picked most often by
Updated Nov 6, 2026
Preview gallery
Similar Skills
View all
What you get
- A 6 to 8 second H.264 MP4 at 30 fps on 1920×1080 or your canvas: droplets gather, your mark rides hidden inside one bead, the bead bursts and the lockup stands alone and legible for the first time.
- A HyperFrames project with the SVG filters, a hand-stamped table of satellite droplets and meta.json. There is no 3D scene, environment map or model file, so the render needs no paid service.
- A handoff note naming the mark's source and rights, your four colors, the burst frame and the legibility check, which sets the distortion by test and not by taste.
Good fit
- The closing seconds of a brand film or advert, a stand-alone sting, or a loop for a display screen.
- Brands holding a genuine vector file of their mark and the rights to use it in a film.
- Marks with a distinctive outline, since that shape alone carries the first half of the film.
Not for
- Product launches or explainers. Nothing is written until the burst, and any line added before it competes with the bead for the only attention there is.
- Identities that are only a name in a system typeface, which leaves no shape to wonder about under the liquid.
- Teams with no logo file to hand over. Your agent stops and asks instead of tracing one from a description.
About this Skill
Logo endings usually give the game away early. This Fable 5 skill holds yours back for six to eight seconds by putting it inside liquid. Droplets drift together into one near-white bead over three soft fields of color, and the mark travels inside as a dark, warped form that plainly is something and cannot yet be named. The bead stops for at least ten frames, vanishes in about a fifth of a second and throws its satellites outward, and the lockup is the first sharp thing anyone has seen. Two SVG filters make the merge and the bend; a two-pixel color fringe and slow CSS gradients finish the glass. GSAP drives it and HyperFrames renders it to MP4 on your machine, with no 3D runtime and no generation model. A handoff note records the mark's source and the legibility check on the frame before the burst.
How it works
- Confirm whether the sting ends a longer film or stands alone, and that the vector mark belongs to you
- Measure the mark's true path bounds, fit the bead around it and choose a ground plus three field colors
- Lock the burst as a frame number and lay the rest of the beat plan out around it
- Build the liquid with seeded filters and scatter the droplets from a fixed table, never random numbers
- Snapshot both sides of the burst, clear HyperFrames check at zero findings and render the MP4
Checked before delivery
- Nobody can read the mark on the frame before the burst, and everybody can once the lockup lands
- The hold before the burst lasts ten frames or more, the collapse a fifth of a second or less, the scatter at least three times the collapse
- Nothing moves two seconds after the burst; npx hyperframes check reports zero findings and the render is 6 to 8 s at 30 fps
What you need before you start
- You bring
- Your mark as a genuine vector file, plus the wordmark if there is one, both owned by you · Four colours: a ground and three colours for the soft fields behind the liquid · The canvas, and whether the sting closes a longer film or plays on its own · Optional: a music bed and a burst sound you hold a licence for
- Dependencies
- Node.js 22 or later · The HyperFrames CLI, plus FFmpeg · The HyperFrames skills with motion-doctrine and cut-the-curve added
- Outside costs
- None
- Last tested
- v1.0.0 — Claude Code / Codex / Cursor
User reviews
Loading reviews…
FAQ
Is a 3D tool or WebGL scene involved?
No. The merging beads and the warped mark are SVG filters over plain HTML, with CSS for the fringe and the color fields. GSAP animates it and HyperFrames renders it, with no 3D runtime, environment map or generation model.
How warped does the logo get?
Until nobody can name it on the frame before the burst, while it still reads as a definite form. Your agent snapshots that frame and turns the displacement up whenever the mark is legible, then snapshots the frame after to confirm the lockup reads.
Can the film run longer or shorter?
It can, because the plan hangs from the burst frame. Three relations have to hold: ten frames or more of stillness first, a collapse of a fifth of a second at most, and a scatter three or more times that long.