Question
Introductive Narration
Choose your domain
Stats
Choosing level
Home page
Map
Map
Map

🚪 BasementNine

A 3D Psychological Horror Coding Escape Room & Adaptive CS Learning Platform

💡 Inspiration

Most online coding platforms and technical tutorials suffer from a common issue: they feel like standardized tests. Solving algorithmic puzzles in a sterile, static web browser often lacks narrative urgency, emotional immersion, and real stakes.

At the same time, psychological survival horror games (like P.T., Silent Hill, and The Ring) produce intense focus, elevated heart rates, and deep environmental awareness.

We asked ourselves a simple question:

What if debugging code was the only thing keeping you alive in a locked, subterranean research facility?

We set out to build BasementNine — transforming abstract computer science education into a high-stakes, 3D psychological survival thriller where cognitive composure and technical problem-solving are your only path to survival.

🎮 What It Does

In BasementNine, players awaken locked inside "Schrödinger's Abyss", an abandoned research laboratory decommissioned nine years ago. The central mainframe has become sentient and corrupted, locking down blast doors and testing intruders against fatal logic anomalies while a paranormal entity (Sadako) stalks them in the dark.

🌟 Core Highlights:

3D First-Person Incursion: Built entirely in WebGL with React Three Fiber and Rapier Physics, players explore realistic 3D environments, manage flashlight battery, inspect physical props (computers, server racks, locked safes), and avoid environmental hazards.
Intelligent AI Puzzle Engine: Powered by Google Gemini, the game dynamically generates unique coding and cybersecurity puzzles tailored to your chosen domain and live competency.
In-Game REPL Sandbox: Each terminal includes a built-in code editor and live JavaScript execution sandbox, allowing players to experiment, log variables, and verify logic before committing their sequence.
Independent Solo Solve Scoring: Rewards players who solve puzzles completely on their own without clues, recording stats directly to a live Supabase global leaderboard.
Procedural Sanity & Horror Audio: Submitting wrong code or lingering in the dark drains cognitive sanity ($0-100\%$), which procedurally accelerates the player's physical heartbeat audio from $72\text{ BPM}$ to $152\text{ BPM}$ alongside screen glitches, camera static, and subliminal apparitions.

🧮 Mathematical Models & Formulas

1. Procedural Cardiac BPM Modulation

The audio synthesizer scales the player's heartbeat frequency dynamically according to real-time sanity:

$$\text{BPM}(\text{Sanity}) = 72 + \left(\frac{100 - \text{Sanity}}{100}\right) \times 80$$ $$\text{BPM} \in [72,\; 152]$$

🛠️ How We Built It

3D Graphics & Physics: Built with Three.js, React Three Fiber (R3F), and @react-three/rapier. Player movement uses a physical capsule collider with pointer-lock mouse look, head-bobbing, and forward raycasting for object interaction.
Resilient Multi-Key AI Layer: We engineered an intelligent rotator (server/geminiKeyPool.js) managing a pool of up to 6 Gemini API keys. The engine intercepts 429 (Resource Exhausted) and billing errors, places exhausted keys on cooldown, and automatically retries with healthy keys in milliseconds.
Backend & API Proxy: Developed a Node.js microservice integrated directly into Vite dev middleware to handle AI generation, answer verification, and leaderboard aggregation.
Database & Authentication: Configured Supabase (PostgreSQL) with Row Level Security (RLS) to store operator profiles, hashed credentials, unassisted solo solve records, and AI question archives.
Procedural Sound Design: Built custom synthesizers using the browser's native Web Audio API to generate low-frequency cardiac thumps, radio static, and atmospheric tension without external audio assets.

🧗 Challenges We Faced

AI API Rate Limits & Failover: During intense gameplay, repeated puzzle generation frequently triggered 429 Quota Exhausted errors on free-tier Gemini keys. We solved this by architecting the 6-key failover pool with automatic cooldown tracking, ensuring players never experience interruptions.
WebGL Performance in React 19: Rendering complex 3D environments with dynamic shadow-casting SpotLights and 60 FPS physics loops required strict optimization. We tuned collider meshes, utilized instancing, and decoupled UI state updates from the Three.js render loop.
Designing a Fair Scoring Engine: We had to balance point values so that players couldn't exploit easy hints or guess blindly. Developing the mathematical multipliers and tying them to unassisted solves created a truly competitive leaderboard dynamic.
State Hydration & Cloud Sync: Merging local offline progress with cloud profiles upon user login without losing speedrun records or unlocked achievements required careful state hydration using Zustand.

🎓 What We Learned

Advanced 3D Web Development: Gained deep expertise in combining Rapier rigid-body physics with React state lifecycles and pointer-lock controls.
Resilient Distributed Systems: Implemented circuit-breaker and key-pooling architectures to handle third-party LLM rate limits gracefully.
Pedagogical Gamification: Discovered that adding immersive narrative stakes, audio feedback, and time pressure dramatically increases focus and retention when learning complex technical concepts.

🔮 What's Next for BasementNine

Multiplayer Cooperative Incursion: Multi-terminal puzzles requiring two operators to collaborate simultaneously across network sockets.
Multi-Language WebAssembly Compilers: Adding native execution support for Python, Rust, and C++ directly in the terminal sandbox.
WebXR / VR Support: Bringing full virtual reality immersion to Schrödinger's Abyss with motion controller interactions.