The Concept

I wanted to build a personal website that stands out — something that feels like booting previous generation console game rather than scrolling through a typical static portfolio.

The site features a persistent 3D model of myself that reacts to navigation, with GTA-inspired UI panels and typography so that it sort of feels like a character selection screen.

Tech Stack

• Next.js 15 with App Router for the framework
• React Three Fiber + Drei for 3D rendering
• Tailwind CSS v4 with a custom color palette
• Zustand for managing 3D scene state across pages

How It Works

The 3D model persists in a Canvas that lives in the root layout. Each page updates the Zustand store with its desired model position, camera angle, and animation — the scene interpolates smoothly between them.

Process

I am pretty adept at 3D modeling when it comes to Fusion 360 or SketchUp, but had no idea where to get started for creating a character model. Through a little bit of trial and error, I figured out a simple way to leverage AI for this task.

1. I took a series of photos of myself in an A-frame pose.
2. Asked Gemini to create an image of PS1-era video game character based on these images.
3. Fed the resulting image into Meshy.ai to create a 3D model from it.
4. From Meshy, I was able to easily rig the model, add some simple animations, and get a .glb file for use on this site.