voltar para o lab
[ Estudo de interação e motion em WebGL ]

Esfera Cromada: um objeto que se transforma no scroll

Three.jsGLSLGSAPLenis

[ 2026 ]

Esfera Cromada

Um único objeto no centro da tela que, conforme a rolagem, muda de natureza — de cromo líquido a wireframe, a nuvem de partículas, a vidro — e de forma, de quase-esfera a blob orgânico. Tudo dirigido pelo scroll, compartilhando a mesma deformação.

O que explora

  • Deformação de malha por ruído simplex no vertex shader, com a normal recalculada para o reflexo acompanhar a superfície.
  • Transição de estado (cromo → linhas → pontos → vidro) por cross-fade dirigido pelo scroll.
  • Reflexo grafite a partir de um environment escuro montado à mão; bloom só nos brilhos.
  • Scroll amanteigado com Lenis, pós-processamento (bloom) e refração de vidro sobre o texto.

Estados

[ Cromo ] reflexo grafite e deformação líquida sutil
[ Linhas ] wireframe do blob orgânico
[ Partículas ] a estrutura explode e se remonta
[ Vidro ] refrata o texto por trás
[ abrir experimento → ]