Interactive 3D Portfolio
This portfolio has a first-person 3D version, built from scratch with Three.js: you wake up in a living room, walk around, and use the TV to browse my projects. No game engine, no build step — just JavaScript. (On desktop, you're probably looking at it right now.)
About the Project
I wanted a portfolio that was itself a demo of what I do. So, on desktop, the site drops you into a 3D room in first person: you explore, interact with objects, and the TV acts as the "browser" that opens these very project pages. The content lives in one place — it's just presented inside the world.
How I Built It
Everything is custom JavaScript on top of Three.js, loaded from a CDN with zero build tools. The main systems I wrote:
- First-person controls — mouse-look via the Pointer Lock API, WASD movement, and simple AABB collision against the furniture.
- Raycasting interactions — a ray from the centre of the screen detects what you're looking at and shows context tooltips ([E] grab, [LMB] interact / sit / use).
- A small state machine drives the flow: waking up on the sofa, standing, exploring, sitting, and zooming into the TV.
- The TV as a browser — aiming at the TV with the remote zooms in and opens a menu that loads these project pages, so the 3D world and the classic site share the same content.
- Reactive objects — grabbable items, an openable book, a lamp you can switch on, paintings you can rotate, and other small touches that respond to the player.
It's the project I'm most proud of for what it shows beyond a single game: initiative, 3D and web fundamentals, and building reactive systems from scratch.