Scroll animation website templates
Pages where the film plays as the visitor scrolls: a camper van unfolding, a boot being lacquered, a load travelling from the yard to the door. The film is pinned, the scroll drives it forwards and back, and the headlines land on the calm moments. Each one is a kit with its live demo, the prompt for your AI builder, the frames and a licence.
A scroll film is a sequence of frames rather than a video element, so it scrubs smoothly in both directions and never buffers. The frames are exported at desktop and phone sizes, the first chapter's frames are loaded first and the rest follow, and a poster covers the first paint.
Copy sits in beats: each headline has a start and an end point in the film, so the strongest line sits where the picture is still. The structure is in spec.json, and the kit-adapt skill changes the words and the timing without touching the frames.
To use one: download the kit, open it in your AI builder and paste the prompt written for it. The agent reads the spec, the reference files and the frames, and builds the page.
What every kit includes
Every kit is a live demo you can open, with the prompt to rebuild it in ChatGPT, Claude Code, Cursor, Lovable or Replit, the assets it uses, a working site to start from and a licence. Change the words, pictures and colours to your business, or have us build it for you.
Is a scroll film the same as parallax?
No. Parallax moves layers at different speeds. A scroll film plays a sequence of frames, so the camera, the light and the subject move as one shot, and the visitor controls the speed.
Where do the frames come from?
From the kit. The Motion Sites guide also shows how to make your own frames and clips with ChatGPT and Google Flow, and how to join them so the cuts disappear.
Does it work with reduced motion?
Yes. The interaction map in every kit gives the substitute: the poster and the copy, with no film, when the visitor prefers reduced motion.
How heavy is a scroll film?
Every kit page shows its measured figures: the time to the largest paint and the size of its scripts. The first chapter's frames load first and the rest follow as the visitor scrolls.