Claude Video

Kinetic text teaser for a notch-dwelling browser app

Jake MoranVERIFIED
@jake11moran

6.7K views · 38 likes · 25 saves · 1 reposts · Posted Sep 24, 2026 · 0:27 · Motion graphics

OUR NOTEA slow, cinematic hype teaser for a menu-bar browser app: kinetic type reads 'in the AI era, the hard part is...' over a blurred wallpaper, then pushes through recreated Mac app windows into the product.

THE CREATOR'S POST
excited to try this! thought your teaser could use a little TLC made this with @HyperFrames_ and opus 5.5 and one rambled prompt via whispr i'll paste below

THE PROMPT

Detailed shot-by-shot motion brief
Using HyperFrames, make a hype teaser for the product in this post - [link]. Landscape, around 27 seconds. Match the product UI, wallpaper and copy from the post's video 

Motion should feel slow and polished - one continuous camera over one Mac desktop, no hard cuts. Camera pushes, pulls and pans run like 1.5 to 3 seconds on gentle ease-in-out curves, nothing snappy - aim for half the speed you'd default to. Add motion blur on fast moves and a light film grain finish. Use an oversized macOS cursor. No audio. All on-screen copy lowercase like the post.

1. Open on a big centered line - "in the AI era, the hard part is" - entering word by word from the right with an orange colorama text wipe over it (the `colorama-wipe` registry component). Hold it about a second, then scale it down into place above a spinning list.
2. The list rotates through 30 hard things about working in the AI era - spending tokens wisely, picking the right model, managing context windows, etc - each with a real app icon. Go fast, it's not meant to be read, then land slowly on "managing your desktop". 0.2s after it lands a question mark pops on after it.
3. Pull the camera back to reveal the Mac desktop as windows pile in on top of each other, arriving from behind the camera - Claude, ChatGPT, Grok, Linear, Chrome, Spotify, Slack and Claude Code in a terminal. Build these as accurate recreations of the real apps with real icons. 
4. Push back in so the windows fly past the camera, back to text - "don't make your browser / one of them".
5. Pan up to a really tight framing of just the notch and the top of the wallpaper. A cursor comes up and hovers - the notch morphs into a pill with the name "NotchBrowser", then opens into the browser panel exactly like in the video. 
6. Click through the tabs like the video does, then click the collapse chevron so the panel retracts into the notch.
7. End on a checklist of the post's claims with rings and ticks drawing on

MAKE ONE LIKE THIS

Three steps, using what the creators in this index used.
  1. 1 · Copy the prompt

    Use the prompt above as your starting point, then change the subject and the style.

    HOW OTHERS WROTE THEIRS →
  2. 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 for pacing and style.
    • Send two or three rounds of specific notes.
    PROMPT TEMPLATE →
  3. 3 · Render it to MP4

    A short piece like this can be screen-recorded, or captured frame by frame for exact timing.

    TURN AN HTML ANIMATION INTO AN MP4 →
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
kinetic-typeui-mockupcinematicproduct-ad
QUOTED POST
govi @kirtandopamine

introducing NotchBrowser 👊 a browser that lives in your  mac's notch, built on webkit. → tiny 1.7 mb (chrome & dia: 1.4 gb) → native → ergonomic → no extra window in the way (launching soon)

399.0K VIEWSOriginal ↗

Indexed Sep 28, 2026, 8:28 AM · Views as of indexing. Video and post © their creator.