HomeAboutProjectsContact
Back to projects
In progress2026 – ongoing

This Portfolio Website

The most meta project here: the site you're reading right now. I directed the build; Claude Code wrote the code. What I did was everything else: the design direction, the information architecture, the content, the voice, and a standing rule that nothing on this site gets exaggerated.

Pages shipped

9

4 core + 5 case studies

Animation systems

7

Reveals, counters, parallax + more

Code written by

Claude Code

I direct the build

My role

Director

Design, content, decisions

Overview

I needed a portfolio that does two jobs: show what I've built, and demonstrate how I build: by directing AI agents instead of writing code myself. The site became its own best case study.

It started as an open-source Next.js template: dark theme, single scrolling page, developer-focused. Almost none of that survived. It's now a light, multi-page marketing site with custom case studies, a branching contact form, and a design system built around one accent color. Every change was made the same way: I described what I wanted, reviewed what the agent produced on localhost, and approved or corrected it.

How it actually works

The build runs across multiple working sessions with Claude Code, and the workflow looks like this:

  1. I describe the goal: "convert this to a multi-page site," "the contact form should branch by visitor type," "tone down that animation"
  2. The agent writes the code: components, pages, styling, animations
  3. I review the result in the browser and react to it like a marketer, not an engineer: does this read right, does it feel right, is it true
  4. I correct anything that's off, and the corrections that matter become standing rules the agent follows in every future session
  5. Work gets committed to GitHub at the end of each verified batch, with handoff documentation so the next session picks up exactly where the last one ended

The continuity system is the part most people don't see: a session handoff document and a persistent memory file that carry decisions, rules, and progress between sessions. The agent changes; the standards don't.

My role

Same division of labor as my other AI-augmented projects: I'm the director and editor, the AI is the builder. Specifically:

  • I set the design direction: white background, one blue accent, light theme only, and a rule for animations: tasteful and restrained, never showing off.
  • I made the architecture calls: multi-page instead of one long scroll, case studies as full pages instead of cards, a conversational contact form that branches by who the visitor is.
  • I authored and corrected all content: every case study fact, number, and claim came from me, and several got rewritten when the AI's draft overclaimed what I did.
  • I set a standing honesty rule: no invented details, no private client information, no credit for work I didn't do. When a draft said I wrote Python I didn't write, the fix wasn't just that page; it became a rule for the whole site.
  • I quality-checked everything on localhost before each commit: copy, layout, animation feel, mobile behavior.

Approach

Start from a template, keep almost nothing

The template provided structure and a component library. The identity (light theme, multi-page layout, all content, the contact flow, the case study format) was rebuilt to spec. A template is scaffolding, not a personality.

Honesty as a design constraint

AI drafts flatter you by default. The most important editing work on this site was subtraction: removing claims I couldn't back, softening numbers I couldn't verify, and labeling in-progress work as in progress. A portfolio that overclaims fails the first reference check.

Build the continuity system, not just the site

Long projects with AI agents fail when context disappears between sessions. The handoff doc and memory rules mean every session starts with the same standards, the same reason my proposal automation system documents rules instead of maintaining code.

Polish in deliberate passes

Content first, then design, then motion, then metadata. The animation pass alone was seven separate systems (scroll reveals, count-up stats, hover lifts, a tools marquee, drifting hero blobs, page transitions, and parallax) added incrementally and judged one at a time, so the site never tipped from polished into noisy.

Stack & tools

Read this list with the right mental model: I chose these tools and direct them; Claude Code operates them.

Next.js (App Router)TypeScript (AI-written)Tailwind CSSFramer MotionClaude Code (builder)GitHubVercel (planned)

Outcomes

  • A complete 9-page site (home, about, projects, contact, and five full case studies) built by directing Claude Code rather than hand-coding it.
  • A real design system: one accent color, consistent card and section patterns, and seven animation systems that share the same timing language.
  • Search and social ready: per-page metadata, a generated social-share card, and link previews built for LinkedIn, iMessage, and Slack.
  • A repeatable production process: the describe → build → review → correct → commit loop now runs fast enough that a feature like the tools marquee ships in minutes, not days.
  • This page exists, which means the process documented itself.

What this project taught me

  • Directing is a real skill, and it's the scarce one. The AI can produce unlimited output. Knowing what to ask for, what to reject, and when to stop is where the quality comes from.
  • Taste doesn't transfer automatically. Every AI draft needed editing toward my voice and my standards. The site got better every time I pushed back.
  • The corrections compound. Because corrections become standing rules, the agent makes fewer of the same mistakes each session. The system gets better even though each session starts fresh.
  • This is the job now. The same loop that built this site (document the standards, direct the agent, verify the output) is how I build everything, from proposals to training systems.