ProjectAlpine Refraction

Description

A single-page React app: a long scroll page with mountain photography. WebGL is wired through React Three Fiber—a single canvas for the whole document, with sections synced to the layout via r3f-scroll-rig. A lens follows the cursor and refracts whatever sits beneath it: images and text rendered in the scene. There is also parallax on photo pairs and a volumetric snow frame that jitters with scroll speed.

Stack

• React 19
• TypeScript
• Vite
• React Three Fiber
• Drei
• r3f-scroll-rig
• React Spring