Inspiration

Moving to university means leaving behind home, routines, and the shelf of books that quietly said this is who I am. A bare student room is a poor replacement. Hobbies are often the first thing to go, and we realised that's a wellbeing problem: losing the things that make you you makes homesickness worse and downtime emptier.

Goodreads and StoryGraph are great at listing what you've read, but they're lists. We wanted to build a place: somewhere that feels like yours and that you actually want to spend time in.

What it does

The Midnight Stacks is a navigable 3D virtual cosy library. You walk through a room with a fireplace, a window seat and shelves filled with books. Click any book to open a panel and write a review, which is saved so your thoughts stay with the book. It's a comfort space for downtime, designed to feel personal rather than productive.

How we built it

Next.js and React for the app
React Three Fiber (Three.js) to render the room in the browser, with WASD movement, mouse look and collision bounds
glTF models and textures for the bookcases and fireplace
A config-driven layout that defines the room, shelf positions and generated books, so every shelf fills automatically
Local storage to save book reviews in the browser

Challenges we ran into

Making movement feel natural while keeping players inside the room and out of the furniture
Placing and aligning a large number of books on the shelves without overlaps, which led us to build a debug view that shows book placement boxes
Loading and rendering textured 3D models smoothly in the browser
Designing for comfort rather than pressure, so we left out streaks and scores

Accomplishments that we're proud of

A fully walkable 3D library with every shelf filled
Clicking any book opens a review panel, and reviews persist between visits
A cosy atmosphere, with a fireplace and window seat, that feels like a place you'd want to be

What we learned

How to build and navigate a 3D scene in the browser with React Three Fiber
Working with 3D assets: models, textures, and collision data
Designing around wellbeing is different from designing around productivity

What's next

ISBN barcode scanning and cover recognition, so you can rebuild the library you left at home in minutes
Real book data from a metadata API instead of sample titles
Low-guilt reading goals such as 10 minutes a day, with no streaks
Flatmate shelves for sharing and lending books
A campus tie-in to see who else at your uni is reading the same book