Design
Walls, Openings, Roof — the tools that draw and change the building. This door also arms editing; it starts OFF so a shared design opens looking finished.
WebGL2 · Three.js · ES modules
Builder is a full 3D house designer that happens to live in a browser tab. Three.js r183 on WebGL2, ES modules served via importmap — no bundler, no build step, no install. Eleven cinematic passes a frame, held under a hard 60 FPS gate.
The design IS the page: a rail of six doors — Design, Outside, Plan, Furnish, Light, Share — with the tools living inside as tabs. Everything floats; nothing takes width from the canvas. Open a door, and the tools you need are already there.
Walls, Openings, Roof — the tools that draw and change the building. This door also arms editing; it starts OFF so a shared design opens looking finished.
Terrain, Garden, Roads: sculpt the plot, plant with wind, lay terrain-hugging roads, choose the surrounding land.
Read the building: the plan, the rooms the wall graph computed, cross-section and layer views.
The 381-model catalogue and the materials — place with geometric legality checks, finish in 64 procedural swatches.
The Sun panel: a place, a date, an hour; play the day in 15 / 45 / 120 seconds; film looks graded on top.
Rooms, roles, permission areas, voice — and the ?design= link that opens the same house on someone else's screen.
Architecture
The app ships as ES modules, served directly and wired through an importmap. Three.js r183 loads straight into the tab; the page is the application. There is no build pipeline to break and nothing to download.
Modules resolve by name through an importmap — the browser does the linking, the server just serves files.
Three.js r183 targets WebGL2 — instancing, float textures and the shadow work all run on the modern path.
Open builder.castomo.com/editor/ and a house builds itself. ?fresh=1, ?empty=1, ?quality= and ?reveal=0|1 parameterise it.
Autosave to localStorage, designs stored server-side, *.webhome.json in and out, Ctrl+S whenever you like.
Feature · In the browser
Under a stress design — 1 foundation, 2 levels, 15 walls, 8 openings including triangles, 50 objects — the gate holds at 60 FPS, under 300 draw calls and 250 MB of heap. Measured on Apple M4: 286 draws, 60 fps, 28 MB at medium quality with the full 11-pass stack.
See it runThe cinematic stack is not a preset applied at export — it runs on every frame you look at: GTAO ambient occlusion, god rays, anamorphic streaks, HDR bloom, motion blur, hexagonal depth-of-field with autofocus, ACES tone mapping, a 3D LUT film grade, halation, vignette, grain, chromatic aberration and sharpening, and SMAA antialiasing — with screen-space reflections on glazing.
"A render engine used to be a render farm. Now it's a frame loop — and it keeps up."
— Builder, by designWhy it must be live
Baked-look showrooms photograph one moment and freeze it. A designer edits live geometry — move a wall, extend the roof, open a window, and every shadow, every bounce, every god ray must re-derive in the same second. Builder renders the real sun (Meeus low-precision series, about 0.01° of accuracy) against whatever the plan is right now. Nothing is pre-baked because nothing stays still: the light is computed per frame, so it stays honest when the design changes under it.
WebGL2, ES modules, eleven cinematic passes — and nothing to install.
Illustrations by GetIllustrations.com (Angle pack).