Back to ProjectsGridline Energy

00
100
Live Site

Project Overview

A vanilla reconstruction of an energy-infrastructure site: 2,782 sequence frames scrubbed by scroll, an image worker, two WebGL surfaces built on three.js r180 with Draco and KTX2 decoding, GSAP 3.13 and Lenis for the motion layer, and per-route stylesheets generated from the captured bytes. The home page converged at 99.85% pixel match with zero height delta across nine sections.
  • PROJECT_TYPEEnergy Company Site
  • ENTRY_YEAR2026
  • TARGET_PLATFORMWeb
  • PRIMARY_ROLEFront-end Reconstruction
DEPLOYED_TECHNOLOGIES
htmlcssjavaScript
gsaplenisthree Js
htmlcssjavaScriptgsaplenisthree Js
COLOR_PALETTE

A vanilla reconstruction of an energy-infrastructure site: 2,782 sequence frames scrubbed by scroll, an image worker, two WebGL surfaces built on three.js r180 with Draco and KTX2 decoding, GSAP 3.13 and Lenis for the motion layer, and per-route stylesheets generated from the captured bytes. The home page converged at 99.85% pixel match with zero height delta across nine sections.

[ PAGE_INDEX ]
  • 01 // The Rebuild
  • 02 // Interface Gallery
  • 03 // Technical Execution

Port the 3D scene, not a poster of it

The glTF models, the Basis and Draco decoders and the scene wiring were ported for real, so the hero renders live geometry rather than a raster ceiling of the original.

A hidden-content audit

A pixel score cannot see light text missing on a black ground, so a document walk fires every observer and reports anything that never becomes visible — the page shipped only after that list matched the design intent.
Gridline Energy responsive viewGridline Energy responsive viewGridline Energy responsive view
  • Residential Estate Site
  • Front-end Reconstruction

Brookhaven Estate

A wellness estate with a virtual scroller, a 65-pattern parallax engine, a reveal system and a 44-flat client-side catalogue — all rebuilt from the bundle.

Brookhaven Estate preview

A vanilla reconstruction of an energy-infrastructure site: 2,782 sequence frames scrubbed by scroll, an image worker, two WebGL surfaces built on three.js r180 with Draco and KTX2 decoding, GSAP 3.13 and Lenis for the motion layer, and per-route stylesheets generated from the captured bytes. The home page converged at 99.85% pixel match with zero height delta across nine sections.

Project
Gridline Energy
Type
Energy Company Site
Role
Front-end Reconstruction

Wanna Say Hello?