The Lab · capability demonstration
Below is WebGL surface displacement, CSS 3D depth, scroll-pinned choreography, drag physics, live data and a command palette. Move your cursor across the panel — that distortion is running on your GPU.
↓ hover the panel
01 · Perspective wall
Pure CSS 3D transforms — no WebGL, no Three.js. Columns travel in opposite directions on a rotated plane.
02 · Z-axis dolly
Parallax moves things in Y. This moves the camera through stacked planes in Z — foreground scales past you as you scroll.
03 · Sticky stack
The page holds while the deck advances. Gated to desktop — pinning on a phone is how you lose a visitor.
A roofing company paying a monthly platform fee for a site that could not capture a lead properly. Rebuilt static, migrated live DNS without downtime, and wired the forms into the CRM their sales team already lived in.
Sprout RoofingA full WordPress and WooCommerce build for a research-supply company operating under strict labelling constraints — where a single careless sentence of marketing copy is a compliance problem, not a typo.
PeptidePharmA mortgage site where published rates carry regulatory weight. Built to pull live market data automatically — and, more importantly, to fail closed and hide the figures rather than ever show an out-of-date number.
Loan Lab LendingA refillery with a real storefront and no interest in becoming a web team. Built the site, then handed it over with runbooks written for people who have a shop to run.
Lemon & Leaf Refillery04 · Live data
Counters, columns, arcs, trend lines and a feed that pushes rows in and FLIPs the rest down. This is what a client reporting panel is made of.
05 · Direct manipulation
An endless wrapping field with momentum decay. A layout paradigm, not a decoration — drag anywhere inside the frame.
06 · Command palette
Fuzzy search over every link on the site, arrow-key navigation, highlighted matches. The detail that makes a site read as software rather than a brochure.
Ctrl+K on Windows
And now the point
Every effect above exists in our library and every one of them works. We put roughly four of them on a client site.
That isn't caution. When the shipped CSS of Hermès, Gucci, Balenciaga, Saint Laurent and Prada was read directly, none of them used WebGL, none used GSAP, and none used custom cursors. Gucci runs a single easing curve across the entire site. Their largest motion budget goes to load choreography, then hover crossfades. Decorative reveals come last.
The expensive-feeling websites are not the busy ones. They are the ones where one curve, one duration and one idea are applied with total consistency.
Anyone can turn all of this on. Knowing what to leave off is the part you're actually paying for.