Alex Derocq · Launch Video Breakdown: Hook, Pacing & Motion Design
SportNotch is live on Product Hunt today! 🎾 I’d love your support to help me reach the top 🥹🙏🏼 It brings live Roland-Garros scores straight into your Mac notch. Football is coming soon too, just in time for the World Cup 😍 https://t.co/c1NLSlcAz3 https://t.co/wjtZsiKrqj
Scene-by-scene timeline & spoken transcript
The Hook
Mac Desktop Reveal
“(No spoken dialogue — Silent video with ambient visual focus.)”
- On screen
- Finder File Edit View Go Window Help Sat 30 May 10:08 Battlenet
- Camera
- Static wide shot of a Mac desktop with a scenic wallpaper.
- Motion
- Instant cut to desktop view.
Product Reveal
SportNotch App Launch
“(No spoken dialogue — Silent video with ambient visual focus.)”
- On screen
- Paris-SG vs Arsenal Finale Half time PSG 0-1 ARS Paris-SG Half time Arsenal K. Havertz 6'
- Camera
- Zoom-in and pan to focus on the SportNotch application window.
- Motion
- Smooth zoom and pan, revealing the app interface.
Feature Teaser
Scoreboard Interaction
“(No spoken dialogue — Silent video with ambient visual focus.)”
- On screen
- Paris-SG vs Arsenal Finale Half time PSG 0-1 ARS Paris-SG Half time Arsenal K. Havertz 6'
- Camera
- Static close-up on the SportNotch app, cursor hovers over the score.
- Motion
- Cursor hover animation, indicating interactivity.
Feature Teaser
Lineup Details Expansion
“(No spoken dialogue — Silent video with ambient visual focus.)”
- On screen
- Paris-SG vs Arsenal Finale Half time PSG 0-1 ARS Paris-SG Half time Arsenal K. Havertz 6' Lineups PSG ARS 39 M. Safonov 29 K. Havertz 2 A. Hakimi 19 L. Trossard 5 Marquinhos 8 M. Ødegaard 51 W. Pacho 7 B. Saka 25 N. Mendes 49 M. Lewis-Skelly 17 Vitinha 41 D. Rice 87 J. Neves 5 P. Hincapié 8 F. Ruiz 6 Gabriel Magalhães 14 D. Doué 2 W. Saliba 7 K. Kvaratskhelia 3 C. Mosquera 10 O. Dembélé 1 D. Raya
- Camera
- Static close-up on the SportNotch app, content scrolls to reveal more details.
- Motion
- Smooth vertical scroll animation, revealing hidden content.
Motion design primitives
Synthesizable in Remotion · key components of the mac-app-demo-reveal template.
DesktopAppReveal
A wide desktop view quickly transitions to a focused, zoomed-in perspective of a specific application window.
+ Code construction recipe
Use `interpolate` for camera position and zoom level. Start with a global view, then smoothly transition to a `scale` and `translate` transform targeting the app window's coordinates. Apply an `ease-in-out` timing function for a natural feel.
InteractiveCursorHighlight
A mouse cursor hovers over an interactive element, causing a subtle visual change or highlight on the element.
+ Code construction recipe
Implement a `spring` animation for the cursor's position. On hover, trigger a `useState` change to apply a `background-color` or `box-shadow` transition to the target element, possibly with a slight `scale` transform.
ContentScrollReveal
Within an application window, content smoothly scrolls vertically to reveal additional information or details.
+ Code construction recipe
Utilize `interpolate` for the `translateY` property of the content container. Control the scroll position based on a `scrollOffset` value, ensuring a smooth `ease-out` transition for the scrolling motion.
Style DNA & aesthetic system
Visual aesthetic
Typography
Motion
Special effects
Pacing & rhythm
Conceptual story rhythm
- 1
Desktop Context
Purpose. Establishes the environment where the app lives, grounding it in a familiar user experience.
Execution. A wide shot of a Mac desktop, showing the operating system's native interface.
- 2
App Introduction
Purpose. Immediately introduces the product and its primary function within its native environment.
Execution. A quick zoom and pan to the SportNotch app window, showcasing its main interface.
- 3
Core Feature Demo
Purpose. Demonstrates the app's key interactive element and its immediate value.
Execution. Cursor interaction with the live score, highlighting its real-time update capability.
- 4
Detail Exploration
Purpose. Showcases the depth of information available within the app, hinting at further utility.
Execution. Scrolling through the lineup details, revealing comprehensive data.
Remix in Animatiq Studio
Master remix prompt · agent-ready
Sample remix
Objective
Demonstrate a new Mac-based task management application called 'FlowState'.How the recipe adapts
The video would open with a Mac desktop, then zoom into the FlowState app. A cursor would hover over a task item, showing a quick edit option. Then, the task list would scroll to reveal upcoming deadlines and project categories, all with the same smooth, silent UI interaction style.Remix blueprint · mac-app-demo-reveal
Scene durations (4 scenes, 5.8s)
Key Remotion components
Related Consumer & Apps Product Launches
Explore all Consumer & Apps launches →
Grand Theft Auto VI: An Extended Look premieres on Netflix Thursday, August 27.
Polymarket Perps is live with up to 20x leverage on crypto, stocks, commodities, and more. Long BTC, predict the Fed, or short the S&P reaction.
Pump.fun launches GO, a marketplace for posting and completing paid bounties for any task.