A place to pause.
A space to explore.

The visual direction follows the materials of the retreat: pale stone, warm timber and a deep green palette. Generous type and a clear invitation to explore keep the architecture in the foreground.

The cinematic chapters use independent AI concept images. The 3D walkthrough is a separate, authored interpretation, with its own geometry and lighting. The project makes that distinction explicit.

Three.js renders a continuous 3D space in the browser. Blender supplies the editable architecture, furniture placement and Cycles-baked diffuse lighting. PBR materials provide surface roughness and normal detail. Diffuse lighting is baked into a separate UV layer, while sun shadows and selected local reflections remain real-time. Other reflections use a static, box-projected approximation; this is not a ray-traced renderer.

The lobby and connected-room GLB models use Meshopt compression. The 3D assets load only when the visitor chooses the experience; the main site works independently. Mobile texture variants keep the same geometry and UV channels, with selected PBR maps reduced to 1024 pixels. The near-field rug uses geometry detail only where it can be seen. A quality selector and adaptive drawing resolution balance clarity and frame rate.

• Three.js
• Blender / Cycles
• glTF / GLB
• PBR materials
• Baked lighting
• Meshopt
• Responsive HTML & CSS

The arrival court, entrance, lounge, corridor, suite, bathroom and terrace share a walkable route. Visitors move with WASD or arrow keys and drag to look. Touch screens have a movement joystick and a separate look area.

Walls and furniture block movement using a ground-constrained collision footprint at a fixed eye height. This is continuous navigation, without jumping or movable furniture. A live map shows your position and offers optional room shortcuts. Exit returns to the same place on the hotel page. A first-entry guide, retry controls and a separate photo experience support visitors who need another way to explore.

The main challenge was keeping a detailed environment responsive, particularly at higher pixel densities. Redundant interior point-light shadow passes were removed where baked lighting already supplied the static shading. Shader preparation and texture uploads were split into stages to reduce the first-draw stall; the visitor sees preparation progress rather than an apparently frozen view.

Re-entry is tested separately from a first load. The scene is suspended on exit, reused briefly, then disposed after 90 seconds. Runtime input handlers are cleared with the scene. A delayed-load test exposed a re-entry race; the dialog now opens independently of model preparation. Required-model failures and WebGL context loss have a visible retry path. Shader preparation counts active time separately from background waiting; adaptive frame-rate sampling restarts when the page regains focus. An insecure-origin Safari failure was traced to content hashing requiring Web Crypto; a tested SHA-256 fallback now handles HTTP without changing texture deduplication. Build-scoped counters separate request queueing, transfer, hashing and image decoding without sending telemetry. Mobile layouts and touch handlers were checked in browser emulation. On one physical iPhone, manual Safari checks confirmed simultaneous touch movement and looking, repeated entry, Map navigation, rotation and background resume. This is a scoped device check, not a guarantee across iPhones or a formal frame-time benchmark. Android Chrome device verification remains pending.