Project dossier

Mission Portfolio

An interactive portfolio that turns professional content into a navigable solar-system and habitat experience.

Problem

A conventional scrolling portfolio can communicate facts without demonstrating interaction design or creating a memorable sense of discovery.

Outcome

The site presents the same portfolio as a guided interactive mission with an explorable 3D entry point and detailed 2D interfaces.

Mission Portfolio architecture

Typed portfolio data feeds a fast recruiter path and an opt-in immersive experience through shared navigation state.

1. Route + content layer: Shareable pages, typed projects, contact actions, and metadata
2. Zustand mission state: Cancelable travel, dialogs, progress, sound, and tutorial coordination
3. Lazy experience layers: Three.js map, travel, surfaces, HAB desktop, and recruiter view
4. Quality + observability: Vitest, Playwright, recovery boundaries, and private aggregate events