Interactive Product Reconstruction

A motion-heavy product experience had to be rebuilt from the ground up, using only the live product’s behavior as the reference. No original implementation, no design files — just measured behavior.

The interaction architecture, responsive behavior, motion system and reusable page templates — smooth scrolling synchronized with the animation clock, route transitions, a custom pointer, touch-first mobile patterns and data-driven case-study, service and article pages.

Desktop interactions were rethought for touch rather than scaled down: native scrolling on touch devices, tap-to-expand cards instead of scroll-driven ones, a gesture-safe carousel that preserves vertical scrolling, and no custom cursor where there is no pointer.

A section-geometry diff exposed 254rem of cumulative page-length drift on one template and brought it down to about 5.7rem. Frame-by-frame motion comparison found that GSAP ignores CSS-style cubic-bezier() strings, and that the reference holds a released carousel for roughly 50ms before snapping. A 40-check interaction suite, full route regression at desktop and mobile widths, and repeated-navigation tests (one smooth-scroll instance, no leaked ScrollTriggers) run against production builds.

Releases use a blue/green process: the new build starts on a separate loopback port, passes health checks, Caddy switches over with a graceful reload, the public domain is verified, and only then is the old release retired. During validation, 3,865 continuous public requests returned 0 failures.

AI-assisted implementation, with architecture, technical direction, debugging and QA led by Cassio.