The Yard
The scroll-scrub hero used across our industrial and product work - a frame sequence or video scrubbed precisely by scroll position, so the product assembles, rotates or ignites exactly as fast as the visitor moves. The technique behind the Danske Gas and coffee builds.
What is included: both rigs (frame-sequence canvas and currentTime scrub) with guidance on when each wins, the preload and decode strategy that keeps scrubbing smooth on mid-range phones, overlay type timing, and the reduced-motion path.
Customize it: one clip or sequence export, start/end copy, and the scrub length. The prompt covers exporting frames when you only have an MP4.
The prompt
Build a scroll-scrub hero where the product footage advances exactly as fast as the visitor scrolls. Give me both rigs ...
Unlock this prompt with Standard or Lifetime.
Unlock all prompts - $299 lifetime →How to use it
- Copy the prompt and paste it into Claude, Cursor or any AI coding tool - current models give the best results.
- Replace the marked tokens (colors, copy, media file names) before you run it.
- Run it, open the result in a browser, then iterate in small steps - one change per message.
Customize it
- Palette and type live in the token block at the top of the prompt - change those first, nothing else.
- Keep the motion values as written on the first pass; tune them only after you have seen the default.
- Swap media last, matching the aspect ratios the prompt names.
