2026 · Product and engineering
Cinematic Engine
Cinematic Engine is the template I use to produce custom cinematic websites in days instead of weeks, with the animation and 3D core separated from whatever changes per client.
Stack
- Next.js
- GSAP
- Lenis
- React Three Fiber
- Tailwind
The problem
Cinematic sites take a lot of work, and almost none of it is reusable when each project is written from scratch. At the same time, turning everything into a configurable theme usually kills exactly what made the site special. I needed a line separating what is stable from what is authored.
The approach
A strict split between engine and skin, with the engine importing nothing from the config folder. Three customization systems: CSS-variable theming, where swapping one brand file reskins the entire site including the WebGL scene's lighting; a declarative section registry, where a page is a list of type plus variant plus order; and a library of pluggable 3D heroes.
What happened
The first client shipped from the template, and the experience produced the most valuable lesson already: an older fork doesn't get the new scenes, and a missing variant failed silently instead of shouting. The engine gained tolerance for that, and every client fork is now versioned before any sync.
Project facts
Engine imports nothing from config — the boundary is verifiable
CSS-variable theming: one file reskins site and 3D scene together
Pages assembled from a declarative section registry
Pluggable 3D heroes: monolith, particles and product
Tell me what you want to build.
A 30-minute conversation about the problem usually settles more than three email threads about technology. If it isn't for me, I'll say so right away.
andre@andrebordignon.dev · Brasília, Brasil