The Snow Globe — Pick It Up, Shake, 5,000 Verlet-Integrated Snowflakes
A wooden tabletop. A glass snow globe sits on it. Pick it up, shake, and 5,000 snowflakes swirl inside as a tiny lit village glows through the dome. Real refraction, real verlet physics, real magic.
What this is
A snow globe sitting on a wooden tabletop. Inside: a procedural winter village with gabled houses, a church with a gold cross, smoking chimneys, a frozen pond, evergreen forest. 5,000 snowflakes simulated via verlet integration with proper sphere-boundary collision. The glass dome uses three.js MeshPhysicalMaterial with full transmission and refraction. Click and drag to lift. Spacebar shakes. T speeds time. The 60-second day/night cycle smoothly turns warm light to cold blue and lights up the streetlamps at dusk.
Why this is mind-blowing
Real glass refraction is supposed to be hard. PBR materials in modern three.js make it a one-liner. 5,000 particles with collision is supposed to be a perf concern. Instanced rendering plus verlet integration makes it free. The whole magical artifact runs at 60 fps in a browser tab from one paragraph of prompt.
Build an interactive 3D snow globe in Three.js. The globe contains a
procedural village — gabled houses, a church spire, smoking chimneys,
a frozen pond, a small evergreen forest. 5,000 snowflakes simulated via
a verlet-integrated particle system inside the globe sphere with
sphere-boundary collision. Real refraction shader on the glass dome
(MeshPhysicalMaterial with transmission: 1, ior: 1.5). Click and drag
to pick up; shaking triggers a snow burst. Tiny streetlamps glow at
night. 60-second day/night cycle inside.
Paste this into Claude, Cursor, or Copilot. Change one thing that matters to you.
What I learned shipping it
- MeshPhysicalMaterial with transmission: 1 + ior: 1.5 + thickness in three.js gets you a glass dome that actually refracts the village behind it. PBR has eaten optical glass simulation.
- Verlet integration (position + previous position, no explicit velocity) makes constraint satisfaction trivial — the spherical boundary collision is two lines.
- PMREM-generated procedural sky environment maps the dome's specular highlights so it sparkles at all viewing angles. No baked HDRI needed.