How I Built This Portfolio

Define the Strategy

Set the goal, audience, and success criteria before touching any tool.

Build the Content Inventory

Audit everything available before deciding what to include.

Create the Narrative Structure

Design the story arc — from Now back to Origin.

Design the Information Architecture

Map every page and simplify navigation to what carries weight.

Define Design Principles

Write the rules that make decisions easier and faster.

Explore Moodboard and Visual Direction

Find the visual language before building the system.

Build the Visual System

Tokens, typography, spacing — systematic before Figma.

Create Wireframes

Structure every screen as ASCII before polishing anything.

Write and Refine the Copy

Every word of every section, written before UI design begins.

Design the High-Fidelity UI

Translate the system and copy into real screens.

Prototype the Interaction

Specify every animation — trigger, duration, easing, purpose.

Test the Experience

Five questions, three testers minimum, synthesis before action.

Build the Website

Next.js + Python. Every component matched to the spec.

Document the Process

Turn the process itself into a case study. This page.