In my cross post of From Bench to Building I shared the career arc that got me here. This is the build story, for the people who want to know what it actually looked like.

The idea was a World Cup pick’em app. Friends, family, a leaderboard, a Golden Boot guess, a bracket. The kind of thing a mom or grandma who doesn’t follow soccer could pick up and actually enjoy.

Here’s how it went from a walk to a working website.

Step 1: Claude Design, to think in pictures

I didn’t start with code. I started with Claude Design, which lets you turn a rough idea into a clickable prototype without touching a codebase. My starting prompt was not polished:

“Ask me questions to make this fun and engaging on top of this idea. I really don’t have a sketched idea yet. I want friends and family to come see this as something which is fun and exciting...”

That was it. A ramble. And within minutes I had something I could click through, something that looked real enough to get excited about and specific enough to actually build.

Step 2: Claude Work, to pressure-test the plan

Before writing a line of code I took the prototype concept into Claude Work, which I now use every day as a thinking and planning workspace. My prompt was simple: “Pressure-test the plan.”

We iterated until I felt confident the concept was solid, and then I asked Cowork to write me the handoff prompt for Claude Code. That prompt is what I walked in with.

Step 3: Claude Code, to build the actual thing

Claude Code is where it gets real. It’s a chat interface for coding and it’s exactly as useful as you’d think for someone like me, someone who understands software but doesn’t write it.

Over several sessions it walked me through: Vercel setup for hosting (connected to GitHub, auto-deploys every push, free tier handles the scale I needed), Supabase for the database and authentication (magic link sign-in, row-level security so users only see their own picks, up to 50,000 monthly active users on free), TypeScript error resolution, mobile navigation, and a full deployment workflow.

What got built: a complete pick’em league with group stage picks, a two-phase knockout bracket, a Golden Boot podium, a match simulation tool, a live countdown to the opening match, an admin panel for the commissioner, and automatic leaderboard scoring. Forty-eight teams, country flags, FIFA rankings, all of it.

I didn’t understand every decision being made. I asked better questions when I got stuck. I worked through what broke instead of stepping away from it.

That was the whole method.

If you’re a non-technical builder sitting on an idea right now, this is the stack I’d point you toward. Design to prototype, Work to plan, Code to ship. None of it requires a CS degree. All of it requires patience and willingness to stay in the problem.

That part is still on you.

A pattern I am noticing in my work:

The Three-Layer Claude Stack (or 4 with Claude Designs now)

Each tool has a distinct job. They build on each other in sequence, and the handoff between them is the discipline.

Layer 1: Claude Chat -- Think and Frame

This is your thinking partner and prompt engineer. You come here to clarify the problem, pressure-test the approach, and generate the right prompt or brief before you touch anything else. You are not doing work here. You are designing the work.

The output of Chat is not an answer. It is a well-framed instruction set ready to hand off. Lots of meta prompting and iteration.

Layer 2: Claude Co-work -- Act and Produce

Co-work is the contractor. You bring it the brief that Chat helped you build, and it does things you either cannot do yourself or do not have time to do. File operations, research synthesis, document creation, structured outputs. This is where production happens.

The key distinction: you are not figuring things out here. That happened in Chat. Here you are executing against a clear frame. The quality of the Co-work output is a direct function of how well you did the framing upstream.

Layer 3: Claude Code -- Build and Automate

Code is where the work stops being a one-time output and becomes a repeatable system. Once Co-work has helped you produce something real, Code is where you turn it into infrastructure. A script. A pipeline. A deployable agent. Something that runs without you in the loop every time.

Chat helped you think through the architecture. Co-work helped you draft specs and schemas. Code built the thing that now runs autonomously.

The Loop in One Line

Chat frames the problem. Co-work does the work. Code automates the outcome.

Each layer compresses time in a different way. Chat compresses decision time. Co-work compresses production time. Code compresses recurring effort to near zero.

That is not just a workflow. That is an AI-native delivery pattern you can teach.