Bouncing teal ball explains a construction AI brand
280 views·6 likes·2 saves·1 reposts·Posted 26 Sept 2026 · 0:15 · Product & Ads
Our note
A 15-second launch film for Mebbian with a teal ball that bounces with onion-skin trails, handwritten marker notes like 'your firm' and 'the ceiling', a flat bids chart and a closing logo; made one-shot with HyperFrames and GSAP from the posted prompt.
The creator’s post
I WAS QUOTED $3000 FOR THIS!!! So I asked Opus 5.5 (medium) to create a launch video using Motion Graphics for us. here's the prompt that one-shots it: "Create a 15s motion-graphics film explaining {{PRODUCT}}. HyperFrames + GSAP, no voiceover, no footage. Style: paper-light canvas, marker notes that draw on, real physics, huge kinetic type, hard light/dark switches, a new idea every 1.5–2 s, a sound on every hit. COPY: read {{POSITIONING_DOCS}} first. {{ONE_LINER}} For {{AUDIENCE}}. {{WHAT_IT_DOES}} Name what the product learns, never the abstraction. RULES - No chrome (scrubber, timecode, fps, headers). No animator jargon on screen ("squash", "stagger", "easing"...). Every word speaks to the buyer. - No invented results: no %, multipliers, customer names or figures. - Never use: {{BANNED_WORDS}}. - Logo: real mark {{LOGO_FILE}} + "{{PRODUCT}}" in {{WORDMARK_FONT}}; never a boxed logo file. CRAFT - Colours {{COLOR_CANVAS}} / {{COLOR_INK}} / {{COLOR_ACCENT_1}} / {{COLOR_ACCENT_2}}; notes in the accents; dark mode = charcoal matching the palette. - Fonts {{BRAND_FONTS}}; Anton for kinetic type; Caveat handwriting via stroke-dashoffset. - Real easing, squash/stretch, stagger, overlap, onion skin, smear, follow-through. Check the HyperFrames registry first. Set every from-state at t=0 (seek-safe); never cover an exit. One primary move per transition; no generic push/slide/rotate-swing. - Music in sections: drums drop on the dark switch and while the ball is airborne, slam back on the type and the logo. SFX: pops, pen scribbles, whooshes, logo sub-hit. CC0 or generated only; log sources. Master -14 LUFS, -2 dBTP, re-measured after AAC encode."
The prompt
Paper-canvas launch film templateI WAS QUOTED $3000 FOR THIS!!!
So I asked Opus 5.5 (medium) to create a launch video using Motion Graphics for us.
here's the prompt that one-shots it:
"Create a 15s motion-graphics film explaining {{PRODUCT}}. HyperFrames + GSAP, no voiceover, no footage.
Style: paper-light canvas, marker notes that draw on, real physics, huge kinetic type,
hard light/dark switches, a new idea every 1.5–2 s, a sound on every hit.
COPY: read {{POSITIONING_DOCS}} first. {{ONE_LINER}} For {{AUDIENCE}}. {{WHAT_IT_DOES}}
Name what the product learns, never the abstraction.
RULES
- No chrome (scrubber, timecode, fps, headers). No animator jargon on screen
("squash", "stagger", "easing"...). Every word speaks to the buyer.
- No invented results: no %, multipliers, customer names or figures.
- Never use: {{BANNED_WORDS}}.
- Logo: real mark {{LOGO_FILE}} + "{{PRODUCT}}" in {{WORDMARK_FONT}}; never a boxed logo file.
CRAFT
- Colours {{COLOR_CANVAS}} / {{COLOR_INK}} / {{COLOR_ACCENT_1}} / {{COLOR_ACCENT_2}}; notes in the
accents; dark mode = charcoal matching the palette.
- Fonts {{BRAND_FONTS}}; Anton for kinetic type; Caveat handwriting via stroke-dashoffset.
- Real easing, squash/stretch, stagger, overlap, onion skin, smear, follow-through. Check the
HyperFrames registry first. Set every from-state at t=0 (seek-safe); never cover an exit.
One primary move per transition; no generic push/slide/rotate-swing.
- Music in sections: drums drop on the dark switch and while the ball is airborne, slam back
on the type and the logo. SFX: pops, pen scribbles, whooshes, logo sub-hit. CC0 or generated
only; log sources. Master -14 LUFS, -2 dBTP, re-measured after AAC encode."Make one like this
1 · Copy the prompt
Use the prompt above as your starting point, then change the subject and the style.
2 · Direct it like an editor
Ask for one self-contained HTML file on a fixed 1920×1080 stage, link this video as the reference, and send two or three rounds of specific notes.
3 · Render it to MP4
Screen-record a short piece, or capture it frame by frame for exact timing. How →
How it was made
The creator didn’t name their tools. Most videos like this are HTML, canvas or SVG animation written by Claude and screen-recorded or rendered to MP4. How that works →
Look
Views as of collection. Video, post and prompt © their creator.
Create with Zryth