back to the lab
A study in WebGL interaction and motion

Esfera Cromada: an object that transforms as you scroll

Three.jsGLSLGSAPLenis

2026

Esfera Cromada

A single object at the center of the screen that, as you scroll, changes nature — from liquid chrome to wireframe, to a particle cloud, to glass — and shape, from near-sphere to organic blob. All driven by scroll, sharing the same deformation.

What it explores

  • Mesh deformation via simplex noise in the vertex shader, with the normal recomputed so the reflection follows the surface.
  • State transition (chrome → lines → dots → glass) via a scroll-driven cross-fade.
  • Graphite reflection built from a dark environment assembled by hand; bloom only on the highlights.
  • Buttery scroll with Lenis, post-processing (bloom) and glass refraction over the text.

States

Chrome graphite reflection and subtle liquid deformation
Lines wireframe of the organic blob
Particles the structure explodes and reassembles
Glass refracts the text behind it
open experiment