Quick summary
Scroll-Film Studio builds scroll-film websites: pages where the hero is not a section but the whole experience — one continuous cinematic shot that plays as the visitor scrolls and dissolves into the content below. It is a process rather than a scaffold. There are no template pages to copy: the skill runs a short interview, pitches two or three named concepts, art-directs the chosen one, and then designs and writes the page from scratch for that brand.
The film itself can be made two ways. Lane A choreographs pure code — pinned scenes, parallax, clip-path reveals — and costs nothing. Lane B generates real footage with any image-to-video engine that accepts a start image, chaining each clip from the literal last frame of the previous one and verifying every junction with a structural-similarity gate, so the finished film reads as a single unbroken camera move.
Who this skill is for
This is for anyone who wants the one-continuous-shot scroll site without hiring a motion studio to build it.
- Brands and studios that want a cinematic launch moment — a product, a place, a story — told as one scrolling shot
- Builders with an AI video account who want their credits to produce a finished site rather than loose clips
- Developers who want the scroll-scrub technique — canvas engine, frame windowing, seam gating — as a method they can rerun
What problem this skill solves
One-shot scroll films are the most imitated effect on the web and the least often pulled off. Three failures account for almost every attempt, and the skill is built around preventing them.
- Generated video clips never line up: chain two shots naively and the subject doubles, drifts or teleports at the seam
- Scrubbing a raw video element stutters everywhere and refuses to seek at all on most phones
- Even with working footage, an improvised page has no pacing — the film races past its own story beats
What you get with this skill
The download is the entire method, not a demo to reverse-engineer.
- The full build process — interview, concept pitch, art direction, build, verification — as one runnable skill
- The shot-chaining contract for Lane B: start-frame extraction, junction prompts, and the structural-similarity gate that catches bad seams
- The canvas scrub engine pattern — pre-extracted frames, a sliding window, a lerped playhead — with a jank-test harness to prove it
- The deploy step: a lean static publish with nothing but the page and its frames
Steps overview
| Step | What happens |
|---|---|
| Interview | Learn the brand before designing anything |
| Concept and art direction | Pitch named directions, then commit to one |
| Generate and chain | Build the film shot by shot (Lane B) |
| Assemble and verify | Turn footage into a page that scrubs smoothly |
| Deploy | Ship the film as a website |
Design & branding system
The skill treats design as its own job, not a side effect of the technique.
- Every build gets its own palette, type pairing and copy voice from the interview — there is no house template being reskinned
- Story beats are placed against the actual footage, so captions and chapter markers land where the film breathes
- Interface layers — HUDs, chapter rails, progress cues — are designed to sit on top of film without fighting it
- Lane A builds get the same art direction discipline; motion choreography is designed to the brand, not copied from a demo reel
Output & performance budget
The output is a static page whose weight is decided before generation starts.
- Frame counts and sizes are chosen against a fixed page-weight budget rather than discovered at the end
- The scrub engine streams frames through a sliding window, so memory stays flat on long films
- A jank-test harness enforces a per-frame budget before the build is allowed to ship
- No framework and no build step: the deliverable is a folder of static files
How this skill pays off
This exists because one continuous shot holds attention like nothing else on a scrolling page — and because the method is repeatable once the failure modes are engineered away.
- The visitor’s own scroll is the play button, so engagement is the default rather than a click you hope for
- Lane B turns an AI video subscription into finished websites instead of a folder of disconnected clips
- The output is yours outright — static files, no platform, nothing to renew
Other information about this skill
A few things worth knowing before you download it.
- Lane A needs nothing but Claude Code. Lane B needs your own image-to-video account — any engine that accepts a start image follows the same chain contract
- Film length is a budget decision: longer journeys mean more clips, more credits and more frames, and the skill makes that trade explicit before generating
- FIRST LIGHT, the reference build, shipped with every junction gate passing — it is the honest example of what the pipeline produces, embedded above
- The skill runs in your own session: your brand, your footage and your credits never touch anyone else’s account
Output examples
Real builds from this skill, captured from the live sites — not mock-ups.
