Online store
Real estate development website
Campaign landing page
Immersive website
Restaurant website
Dental clinic website
Case study
Ody Sey Van. A website you watch like a film.
A camper van conversion workshop working on VW Transporter and Fiat Ducato. Instead of a photo gallery, scrolling plays the journey from bare metal to a van above the clouds.
See the live websiteScroll down. Below is the same scene: 900 frames and a five-layer parallax.
Every project starts with an empty space.
We look at the vehicle, listen to how you travel, and only then draw the layout.
Insulation and wiring.
Sound deadening, thermal insulation and electrics laid out to last for years.
Made-to-measure furniture.
Wooden worktops and leather handles. Every front fitted to the millimetre.
Ready for the road.
Sunrise above the clouds, no need to look for a campsite or a socket.
Starting point
A camper conversion takes months of work and dozens of stages you can’t see in a photo of the finished vehicle. A regular gallery didn’t convey what matters most in this work: the craft and the journey from bare metal to a home on wheels.
Goal
A website people remember that also does its job: fast on mobile, well rated by Google and leading to one conversation about a specific van.
A cinematic effect, and almost all 100s in Lighthouse.
Measured on the production version. The largest element loads in 2.0 s on mobile and 0.5 s on desktop, and the layout doesn’t shift while loading (CLS 0).
Why this website is fast even though it looks like a film.
Frames instead of a 3D scene
A film split into individual WebP frames and drawn on a canvas. The scroll position picks the frame: scroll down to play, up to rewind. The quality of real footage without a heavy 3D engine.
Two sets of frames
1600×900 for desktop, and the middle 70% of the frame at a lower resolution for phones. The set switches when the screen rotates, with no black bars or jumps.
Loading from coarse to full
First the opening frame as a regular image, then every 32nd, 16th and 8th frame, up to the full density of 900 frames. Where someone slows down to look, frames load first.
A 15° panel and parallax
An angled panel with the benefits slides over the film and reveals the interior. The last frame turns into an identical image made of 5 layers that move apart at different speeds.
No framework
Plain HTML, CSS and JavaScript. The only library is Lenis for smooth scrolling. Fonts are self-hosted, with no connection to Google Fonts, which helps with GDPR and speed.
Form and consent
A form with validation, a honeypot and Cloudflare Turnstile. A consent banner with Google Consent Mode v2 and an anonymous consent log.
78 builds in a gallery with categories and videos.
The client adds photos and videos himself, in a simple editor that opens with one click.
