2026-04-23

Building justinreda.com with Claude Code

A collaborative design process

I owned justinreda.com for years and did nothing with it. Every time I thought about building a portfolio I got stuck on the same problem: the shape of the thing was less interesting to me than the engineering underneath, but you can’t have one without the other. A portfolio without a clear shape is just a pile of links.

This week I tried something different. I handed Claude Code the brief, my resume, my LinkedIn, and the path to my personal projects, and asked it to interview me. What came back — as a committed spec, a task-level implementation plan, and this site — is a pretty honest representation of how I like to work with AI coding agents. It’s worth writing down.

The brief

I told Claude:

  • I own justinreda.com, haven’t done anything with it.
  • I want to showcase five pieces of recent work: Aurora Core (the design system), Aurora Pad, Aurora Explorer, Chaos Control, and AI-ACP.
  • It should follow the Aurora Core design language — the site itself is a showcase of the system.
  • Host it on Vercel.
  • Ask me questions if you have any.

That last sentence matters. A lot of “AI coding” is actually AI guessing. The agents that produce good work ask you things before they write code, and they don’t ask dumb questions — they ask the questions that change the design.

The brainstorm

The first thing Claude did was not generate any code. It loaded a brainstorming skill — a structured process for turning a fuzzy idea into a shippable spec — and then asked me one question at a time. Each question was multiple-choice when that was possible, with a recommendation and the reasoning behind it. The answers decided real architectural choices:

  • Stack: SvelteKit + adapter-vercel, prerendered. I started by asking “is Astro fine on the free plan?” Claude confirmed, then followed up with the tradeoffs for each option. I ended up picking SvelteKit because it matches Aurora Pad, Aurora Explorer, and Chaos Control — keeping one stack across my world.
  • Structure: hybrid landing + project detail pages. Not a single scroll, not a sprawling site — a rich landing with detail routes for people who want to dig in.
  • Theme: system-preference default with a persistent toggle. The site itself should show off Aurora Core’s dark-and-light parity.
  • Contact: email + socials. No form. Portfolio-level volume doesn’t justify form infrastructure.
  • Content model: Markdown with typed frontmatter, validated at build time with Zod. Edits are commits.

Then I asked for a Now widget, a writing stub for future posts, and for the first post to be this one — an introduction that shows the process. Claude added those to the design.

The spec

Before writing any code, Claude drafted a design document: architecture decisions, the information architecture for the landing page, the template for each project detail page, the visual language constraints inherited from Aurora Core, the media strategy, and a scope section that made explicit what was not going to ship in v1. That file lives in the repo at docs/superpowers/specs/2026-04-23-personal-website-design.md. I reviewed it, asked for a couple of additions (a Justfile and a local Docker setup on port 42069), and approved it.

The plan

The spec got turned into a bite-sized implementation plan — another committed markdown document, living at docs/superpowers/plans/2026-04-23-personal-website.md. Every task has specific file paths, code in every step, and a commit message at the end. This plan is what gets executed.

What I like about this workflow

  • The thinking is in-repo, not in a chat window. If I come back to this project in a year, the design and plan are next to the code.
  • The agent makes recommendations, not guesses. Every “I recommend X because Y” is a place I can disagree and redirect.
  • The human stays in control of the shape. Code generation happens after the shape is decided, not before.

What I’d do differently

Honestly, not much. The main thing I want to improve is screenshot and demo-video capture — AI-friendly automation for portfolio media is a solved problem for web screenshots and a mostly-unsolved problem for native desktop apps. That’s on the follow-up list.

What’s next

This site is v1. In the queue:

  • Marketing-style demo videos for each project.
  • AI-ACP’s public hosting launch, which will update the AI-ACP detail page.
  • Whatever new work ends up here — this is a living portfolio, not a frozen one.

If you want to see the repo that built this post, the spec, the plan, and the site itself, it’s all in nitsujader/justinreda.com on GitHub.