Haunted House Scene

This project recreates a stylized haunted house environment as a fully procedural Three.js scene. The composition combines fog, animated ghost lights, textured architecture elements, and scattered graves to build a readable horror atmosphere with strong silhouette control. Scene construction is handled in code by assembling modular parts for the house body, roof, bushes, and grave groups. This approach makes composition tuning fast and allows atmospheric experiments without asset import dependencies.

Structural organization is defined through geometry groupings and repeatable placement rules instead of a single imported model. Grave distribution and empty space are tuned to balance depth perception with browser performance. The door, brick, and grass texture sets carry most of the scene's visual drama. Surface detail is chosen so it remains readable under fog and colored lights, preserving separation even in a dark environment. Beyond the primary surfaces, grass repeat settings and layered maps on the door material add depth in close views without inflating asset cost. The result keeps the procedural setup efficient while still feeling rich enough for inspection.

The final runtime operates as a native Three.js scene with fog, ambient light, moonlight-style directional lighting, a warm door light, and three animated ghost point lights. OrbitControls support inspection while the intended night mood is preserved. Once integrated into the portfolio runtime, ghost light orbits continue only when the scene is actually visible and useful. That approach keeps the preview expressive while avoiding unnecessary background rendering.