Back to ProjectsThe Basalt Collective

00
100
Live Site

Project Overview

The original runs a bespoke in-house animation framework and hand-written WebGL1 with no GSAP, Lenis or three.js: its modules never paint, they turn scroll position, viewport intersection and pointer position into CSS custom properties and state classes. The rebuild ports those mechanisms — split, lazy, progress, parallax, sequence, in-view, header colour — into one hand-written file, with thirteen shaders recovered verbatim, across six routes.
View Showcase
  • PROJECT_TYPEDesign Collective Site
  • ENTRY_YEAR2026
  • TARGET_PLATFORMWeb
  • PRIMARY_ROLEFront-end Reconstruction
DEPLOYED_TECHNOLOGIES
htmlcssjavaScript
webGLglsl
htmlcssjavaScriptwebGLglsl
COLOR_PALETTE

The original runs a bespoke in-house animation framework and hand-written WebGL1 with no GSAP, Lenis or three.js: its modules never paint, they turn scroll position, viewport intersection and pointer position into CSS custom properties and state classes. The rebuild ports those mechanisms — split, lazy, progress, parallax, sequence, in-view, header colour — into one hand-written file, with thirteen shaders recovered verbatim, across six routes.

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

Why vanilla

When the target's framework does no painting of its own, a framework rebuild would add machinery the design does not use. Mechanisms were ported instead of restyled.

Generated from the capture

The stylesheet is generated from the captured raw sheets and the six routes from each captured document, so the rebuild is regenerable and the diff against the reference stays honest.
The Basalt Collective responsive viewThe Basalt Collective responsive viewThe Basalt Collective responsive view
  • Product Catalogue Site
  • Front-end Reconstruction

Cambium

A Nuxt 4 catalogue site whose canvases run as OffscreenCanvas in two web workers — the architecture kept rather than faked on the main thread.

Cambium preview

The original runs a bespoke in-house animation framework and hand-written WebGL1 with no GSAP, Lenis or three.js: its modules never paint, they turn scroll position, viewport intersection and pointer position into CSS custom properties and state classes. The rebuild ports those mechanisms — split, lazy, progress, parallax, sequence, in-view, header colour — into one hand-written file, with thirteen shaders recovered verbatim, across six routes.

Project
The Basalt Collective
Type
Design Collective Site
Role
Front-end Reconstruction

Wanna Say Hello?

hello@erkamdemirci.comWhatsApp · +90 539 877 9339
Get a quotePrivacy & data protection