Most portfolio sites are a page you scroll. This one also comes with two places you can walk around in. If you have a few spare minutes and a curious streak, this post is your guided tour: what the two 3D experiences are, how they were built, and how to get around once you're inside.
The home office
The first stop is my home office, hosted at SceneXP (opens in a new tab). It's a small, cozy scene: me at the desk writing code, a cat napping nearby, and a whiteboard on the wall listing the goals for SceneXP itself. It is the room where SceneXP was made, rebuilt in 3D, and it is the quickest way to get a feel for what one of these scenes is like.
The original gallery
The second stop is the gallery, the walkable version of this very site and the project that started all of this. Every section of the site hangs on the walls as a framed piece. Walk up to one and click it, and the page opens. The front door really opens too. Out on the street there is a cafe with a barista, a bookstore, a hot dog cart, and a few surprises worth finding.
The gallery keeps its own clock. The sun crosses the sky, the light shifts, and after dark the street gets a little strange. There is a light switch by the door that dims the whole room, a telescope that tracks a comet across the night sky, and a rolling whiteboard covered in hand-drawn engineering sketches. None of the art is a stock image. Every texture is drawn in code.
If you fancy a treasure hunt, the ✓ button in the top-right corner opens a checklist of nine things to discover, from meeting the gallery host to finding the tiny robot across the street. Find them all and your time lands on the gallery leaderboard.
How they were built
Both experiences run on Three.js (opens in a new tab) and plain JavaScript modules. There is no framework and no bundler, just HTML, CSS, and JS served as static files from NGINX, with a small Grunt task to minify things for production. The scenes render in WebGL, and the gallery also supports WebXR, so it works in a VR headset if you happen to have one.
The part I find genuinely exciting is how they were made. I didn't write most of this code. Claude Code did, one conversation at a time, with me steering: describing the room I wanted, walking through the result, and sending it back with notes until it felt right. I handled the product decisions, the Git commits, the testing, the QA, and the deployments. Claude handled the math, the Three.js API, and the thousands of lines of geometry that turn a description like "a cozy office with a napping cat" into something you can stand inside.
Along the way the reusable pieces were pulled into a shared library of parts: walls, doors, furniture, lighting, street scenery, people, checklists, and the movement controls. Each new scene now starts from that kit instead of from a blank file, which means an idea can go from a conversation to a working 3D world in hours rather than weeks. Performance got the same attention. Pixel density is capped on Retina screens, shadow maps refresh on a throttle instead of every frame, and visitors who prefer reduced motion get a still scene with the day and night cycle paused.
How to get around
Each experience has a help card when you arrive, but here is the short version so you can dive right in.
On a desktop or laptop, with a keyboard and mouse:
- Move with W A S D or the arrow keys. Hold Shift to move faster.
- Look around by moving the mouse. Click the scene once to capture the cursor, and press Esc whenever you want it back.
- Interact by walking up to a framed piece, a person, or a prop and clicking it.
On a phone or tablet, with the on-screen joysticks:
- Walk with the left joystick. Touch it and drag in the direction you want to go. The further you push, the faster you move.
- Look with the right joystick. Drag it to turn your head, and it springs back to center when you let go.
- Interact by tapping whatever is in front of you. Both joysticks work at the same time, so you can walk and look at once.
A game controller works too. The left stick walks, the right stick looks, and that includes Quest controllers when the headset is browsing in 2D mode.
A couple of extras help on any device. The ☰ Menu button in the top-right lists every section as a plain link, so you can jump straight to a page without walking. The gear icon opens settings where you can adjust movement and look sensitivity. And if 3D just isn't your thing, the classic 2D site you are reading right now has the same content, no walking required.
A word about SceneXP
SceneXP (opens in a new tab) is the home for these custom 3D experiences. Custom scenes for a business, a person, or a memory, running right in the browser with nothing to install. A tire shop with its real service bays, a Zumba class you can join, a bike trail a father loved, a pirate mini golf course from a family vacation. Each one gets its own world, its own characters and conversations, its own treasure hunt, and a social preview image that looks great when shared. There are games and experiments too: call the plays in X's and O's, grow a Fractal Garden through the seasons, watch the surf rise in High Water, or fly an orbital ship in Earth Defense. The home office scene above lives there, and so does every experience built since. The original gallery is the one exception, and it stays right here on devSteve.com where it began.
If you would like a scene of your own, for your storefront, your team, or someone you love, I would be delighted to hear from you. And if you're hiring someone who can build this way, let's talk.