Capability Demo Rebuilt from scratch

The technique worked.
The story was wrong.

Scroll drives a camera instead of triggering animations: it flies into a scene, back out, across, and into the next one with no cuts. We built that twice. The first version was technically sound and about nothing in particular, so we threw the subject away and kept the engine. This page is why, and how it is actually made.

Industry
Renovation & Custom Build
Project Type
Capability Demo · Rebuild
Services Shown
Motion · Art Direction · Performance
Status
Demo · Not a real client

It is meant to be scrolled, not described. Open "Ashgrove" and scroll slowly — the camera moves at exactly the rate you do, forwards or backwards, and the joins between chapters are the part to watch for.

Fly through it ↗
Honest framing: "Ashgrove" is a fictional contractor we invented to demonstrate the technique. It is not a real client and no result is claimed. The four scene images are AI-generated stills, disclosed as such — what is ours is the camera work, the seam method and the engine that plays it. Nothing on the demo can be booked and the contact details on it are invented.
01 - Why Version One Was Scrapped

A camera flying through an abstraction.

The first build told the Asteris story: someone searches, lands on a fast site, the phone rings, a job gets booked. Rendered as a flat isometric world in cyan and purple on a near-black background. It worked. You could scroll it and the camera flew.

It was also the same three colours and the same anonymous gloss our own auto-detailing teardown had already condemned — and worse, the subject had no physical sequence. "Search" does not come before "site" in space, only in a diagram. We were using a technique whose entire purpose is to move through something, on a story with nowhere to move. That is why flat diagrams were reachable in the first place: nothing about the content resisted them.

02 - Picking A Subject That Is Actually Sequential

A room, in the order it gets built.

Renovation is inherently ordered, and every trade knows the order: bare space, then structure, then the services buried in the walls, then the finish. Four chapters that genuinely follow one another, in one physical room, so the camera has a real reason to travel.

The palette was committed to before any art was made — plaster, oak, slate, moss. Warm and specific, chosen because the previous version's failure was a colour scheme that could have sold anything.

03 - How The Camera Actually Moves

The seams match by construction.

The hard part of a scroll-flown page is not the flying, it is the joins. Each chapter has a "dive" clip, and between chapters a connector has to leave exactly where the last dive ended and arrive exactly where the next one begins. Eyeball that and you get a visible pop at every transition.

So we did not generate the connectors independently and hope. Every camera move is derived from the stills with ffmpeg, and each connector's endpoints are the neighbouring dives' actual rendered frames — not the frames we intended, the ones that really came out. Matching is a property of how the clips are made rather than something checked afterwards.

That decision also means no AI video model was used, and nothing was paid per clip. We had a pay-per-call video pipeline standing by and did not need it. The engine plays back seven clips scrubbed against scroll position: four dives, three connectors.

04 - What It Costs To Serve

Cinematic is not an excuse to be heavy.

05 - What This Is Actually For

Only worth it when there is a sequence.

This suits a business whose value is in a process the customer never sees: a builder, a restorer, a fabricator, anyone whose finished product hides the work that justified the price. Scrolling through the stages makes the invisible part the argument.

It is the wrong choice for most sites, and version one is the proof. If the story is not physically sequential, this technique adds weight and takes away clarity — a plumber who needs to be phoned at 11pm is better served by a fast page with a big phone number. We would rather say that up front than sell motion to someone who needs a booking form.

Scroll Cinematic Seamless Chain Art Direction Zero Dependencies Reduced-Motion Safe Mobile Clip Set

Got a process worth watching?

If your work happens in stages and the finished job hides most of it, this is the format that shows it. Tell us what you build and we will say honestly whether it suits you — and recommend something simpler if it does not.

Start Your Project