A good landing page used to be a big project: brief a designer, wait for a build, review, revise, QA. Now we run one Claude Code skill, point it at a brief, and get a real, on-brand, staged page in under 10 minutes. It goes live only after a human signs off. Here is exactly how the pipeline works.
MJBy Micah Johnson · Biggest Goal6 min readClaude Code · Claude Design · Webflow
A good landing page used to be a big project. You would brief a designer, wait for mockups, hand it to a developer, wait for the build, then review, revise, and QA before anything went live. Weeks of work, and a real chunk of budget, for one page. We do it differently now: when we need a new page, we build the landing page with a Claude skill, and it is staged and ready to review in under 10 minutes.
This is my favorite kind of AI story, because it is not about a flashy new model. It is about taking one process we do over and over, getting it right once, and turning it into something we can run on demand.
The old way was a project. Now it is a command.
When we need a new landing page, we run a single Claude Code skill, point it at a document that describes the page we want, and get back a real, on-brand, staged page ready for us to review. Nothing is a mockup, and nothing is live. It goes live only after a human signs off.
✕ The old way
Weeks, and a real chunk of budget
Brief a designer, wait for mockups
Hand it to a developer, wait for the build
Review, revise, and QA before launch
All of that, for one page
✓ The way we do it now
One skill, a staged page, minutes
Run one skill, point it at a brief
Get back a real, on-brand, staged page
A human reviews, approves, then publishes
Live only after sign-off
Same outcome, a real landing page, on a fraction of the time and budget.
The whole thing runs on a stupidly simple stack. Not a dozen tools stitched together. Two.
<10 min
From concept to a published page
~5 min
Per review-and-tweak iteration
2
Tools in the entire pipeline
The four parts, each doing one job
The stack is short because each piece has a clear role. Claude Design gives us the look, Claude Code does the building, the skill makes it repeatable, and the Webflow CLI puts it live.
Claude DesignGives us the look
Claude CodeDoes the building
SkillsMakes it repeatable
Webflow CLIPuts it live
A quick tour. Claude Design is Anthropic's prompt-to-design tool; its most useful trick for us is reading our real website and assets and producing a design system from them, so everything it makes looks like us rather than a generic template. Claude Code is Anthropic's coding agent: it writes and edits real code inside our actual project files rather than just describing what to do. A skill is a small folder with a plain-English instructions file at its center, so once it exists Claude can run the saved steps every time. And the Webflow CLI lets code do, from the terminal, what you would normally click around the dashboard for, including the crucial bit: deploying to a staging environment is separate from publishing, so a page can be fully built and staged without ever touching the public site.
One command, one page
When we need a new landing page, we run the skill, literally /landing-page, and point it at a document that contains the context for the page. Claude Code reads that context, builds the page from our design system and page template, and deploys it to staging through the Webflow CLI. We get a real, working, staged page back, not a mockup.
Step 1
Point it at a brief
Step 2
The skill builds it
Step 3
Staged, not live
Step 4
A human approves
Each review-and-tweak pass takes about five minutes. Want a different hero layout? Just ask.
Then a human reviews it. We tweak wording, adjust a section, fix anything that is off. Each iteration takes about five minutes, which still adds up to far less than the old way. When we are happy, we ask Claude to publish.
Nothing goes live without a person reviewing and approving it. The review gate is a feature, not a limitation.
Turn a process into a skill
The real win is not one landing page. It is a process you can run on demand.
The teams pulling ahead stopped re-explaining the same task over and over and started turning their best processes into repeatable assets. Our free Cowork Masterclass walks you through setting AI up to do exactly that, starting with the first process worth systematizing.
Free · Self-paced · 26 short lessons
The setup is the real work
The magic is not that AI "makes a webpage." It is that we did the hard work once and standardized it. This four-step investment is the entire point, and it is the part most people skip. Everything after it is fast because this part was slow and deliberate.
1
Build a design system in Claude Design
Colors, type, spacing, components, the whole brand language, set up once so every page starts from the same on-brand foundation instead of a blank canvas.
2
Export it as a handoff for Claude Code
Claude Design produces the design files plus instructions and passes them to Code, so Code continues from our real design rather than guessing from a screenshot.
3
Build one landing-page type, end to end
We did not accept whatever came out. We built one real page with Code, refining the structure, the sections, and the way it deploys through Webflow, until it was genuinely good.
4
Capture that finished process as a skill
Once the page and the steps to ship it were dialed in, we asked Code to capture the whole thing as a reusable skill, so the approved version becomes the default version.
For a small variation on a page, a different layout or a new section, we just ask Claude Code to make the change. It is a conversation, not a project. For a genuinely new kind of page, we go back to the start: design it properly, work through it with Code until it is right, then capture that as its own skill. Over time you build a small library of proven, repeatable page types.
How to avoid generic slop
The quality of the page is set by the quality of the context you give it. Ask for "a landing page for a masterclass" and you get exactly what that prompt deserves: a generic, lifeless page that could belong to anyone. The skill is not a magic button. It is a very good operator that still needs to be told what it is building and why.
✕ One lazy sentence
Generic, lifeless slop
"Build me a landing page for a masterclass"
A page that could belong to anyone
The tool did nothing wrong
You handed it almost nothing to work with
✓ A real brief
Sharp and specific
Who the page is for, and what they struggle with
The offer, the outcomes, and the proof
The objections to answer, and the exact call to action
The more real context, the sharper the page
Get the brief right and it is excellent. Feed it one lazy sentence and it builds you something useless.
This works for far more than landing pages
By all means set up a Webflow account and follow this to get pages built in minutes. But read between the lines and there is a pattern that applies to almost any workflow in your operations.
Step 1
Take a valuable process
Step 2
Standardize it
Step 3
Capture it as a skill
Get the good version right once, then let anyone run it on demand.
Landing pages are just one example. The same shape works for a recurring report, a proposal draft, a client onboarding packet, or a weekly analysis. The teams pulling ahead are the ones who stopped re-explaining the same task over and over and started turning their best processes into repeatable assets.
A person is always in the loop. AI does the build and staging; a human reviews and approves; then it goes live.
The setup is the work, and the payoff is entirely downstream of it. Do it once, do it deliberately, and the good version becomes the version you get every time.
How do you build a landing page with a Claude skill?
You run a single Claude Code skill, ours is called /landing-page, and point it at a document describing the page you want. Claude Code reads that context, builds the page from your design system and page template, and deploys it to a staging environment through the Webflow CLI. You review the staged page, tweak anything that is off, and publish only after a human approves.
What tools do you need to build landing pages this way?
Just two: Claude Code, Anthropic's coding agent, and Webflow, where the page is staged and published through the Webflow CLI. We design the original page type in Claude Design first, but the repeatable pipeline itself runs on Claude Code and Webflow.
Is the landing page live as soon as the skill runs?
No. The skill deploys to a staging environment that is separate from the public site, so nothing goes live automatically. A person reviews the staged page, adjusts wording or layout, and only then asks Claude to publish. The review gate is a deliberate feature, not a limitation.
How do you keep AI-generated landing pages from looking generic?
The quality of the page is set by the quality of the brief you point the skill at. A strong brief covers who the page is for, what they struggle with, the offer and what is included, the specific outcomes and proof, the objections to answer, and the exact call to action. Feed the skill one lazy sentence and it builds generic slop; give it real context and it builds something sharp and specific.
Free Masterclass · $0
Turn your best process into a repeatable skill.
Landing pages are just one example. If your team does something valuable again and again and you are thinking "we should systematize that," that is the conversation. The free Cowork Masterclass shows you how to set AI up to run your best processes on demand.
Free · No credit card · Built by Biggest Goal
Tools referenced
Claude Code, Anthropic's coding agent that writes and edits real code in your project files, via Anthropic · Claude Code. Agent Skills, the plain-English instruction folders Claude follows on demand, via Anthropic · Introducing Agent Skills. The Webflow CLI and staging-then-publish deploy model via Webflow Developers. Claude Design is Anthropic's prompt-to-design tool, currently in research preview.
You're registered · $0
You're in. Check your email for your access link.
Your spot in the Claude Cowork Masterclass is confirmed. It's completely free, and there's no upsell to watch the videos.
1Check your inbox for an email from Biggest Goal with your access link.
2Open lesson one and set up your first folder. Most people get set up in a weekend.
3Bring a Claude account and about an hour. That's all you need to start.