Lab notes
This experiment started as a question: how little geometry can still feel like a place? Not a game level—a vignette. One house, a few stones in the grass, fog swallowing the horizon, and a sun that looks too large to be safe. The goal was to chase atmosphere in the browser with Three.js, without hiding behind post-processing crutches.
Everything here is intentional friction. The ground is uneven on purpose. The door is the only friendly color in the frame. If the scene reads as “lonely” before “technical,” the build did its job.
Scene as a storyboard
Before writing shaders, we blocked the shot like a film still. The camera height, the house offset from center, and the gravestone-like blocks are composition choices—they guide the eye toward the door, then let the fog pull it back into nothing. Three.js makes it tempting to add more meshes; this piece was an exercise in stopping early.
The house is essentially a kit: planes and boxes with bevels implied by lighting, not geometry. That keeps draw calls and UV pain manageable in a side project you actually want to ship.
Materials that carry weather
Bricks read as bricks because of roughness variation and a normal map that catches the rim of the sunset—not because the mesh is complex. The roof and mud share the same idea: break up specular with noise, keep albedo restrained, and let one strong light do the sculpting.
The wet ground picks up a faint sky tint so it feels connected to the fog instead of floating under the house. Small touches like that matter more than a fourth prop in the background.
Light, fog, and the horror of empty space
The lamp above the door is a tight point light: warm, falloff-heavy, and barely reaching the path. It sells “someone might be home” without animation. The sun is a separate conversation—wider, colder on the shadows, pushing teal into the mid-ground so the orange reads as pressure, not comfort.
Fog is doing narrative work here. It hides the edge of the world, kills infinite distance, and forgives a simpler terrain. Whether you use linear fog or exponential fog, the trick is the same: tune color to match your sky and ground so the fade feels like weather, not a gray slab.
Shadows and the web runtime
Shadow maps are expensive, so the scene keeps casters to a short list: the house mass, a few rocks, the door frame. Everything else either doesn’t cast or shares the same resolution budget. The renderer is tuned for steady frame time on ordinary laptops—this is a lab piece, not a demo that only runs on a discrete GPU at home.
Resize handling, pixel ratio caps, and a single directional key light for the “sun” keep debugging predictable when you iterate at night and forget which light you moved last.
Why it lives on GitHub Pages
Static hosting keeps the experiment honest: no backend, no auth, just a bundle and a canvas. That matches how we think about R&D—something you can link to, fork, and break apart. The live build is the receipt; the scene is the write-up.
If you open the demo, rotate the view slowly. The house is not the subject—the gap between the light and the fog is. That gap is what we were really building.