Building a $10,000 website is no longer about design skill — it is about knowing the six structural layers of premium sites and giving Claude a scene-based brief for each one.
Who This Is For
Read if. Skip if.
READ IF YOU ARE…
You freelance building websites and want to compress multi-day production to a single afternoon.
You sell a product and want agency-quality web design without the agency price tag.
You already use Claude Code and want to extend it into front-end web production.
You understand basic prompting but want a systematic framework for what separates premium from generic.
SKIP IF…
You need deployment, hosting, or CMS integration — the video covers building and rendering only.
You want deep CSS or JavaScript mechanics — this is a brief-and-iterate workflow, not a code explainer.
TL;DR
The full version, fast.
A premium site has six layers: core messaging, scroll style, color palette, copy, photo/video assets, and a final assembly pass. Each layer gets its own precision Claude prompt. The color palette is derived from a scene the user inhabits rather than brand adjectives — Claude extracts lighting and mood automatically. Luxury copy rules are concrete: short headlines, hyper-specific claims, no em dashes. A custom /build site plugin using UltraCode spawns three parallel drafts, scores them against design principles, and delivers the winner from a single product image and description.
Free for members
Chat with this breakdown — free.
Sign in and you get 23 free chat messages on us — ask for the hook, quote a framework, find the exact transcript moment, generate a markdown action plan. Bring your own key when you want unlimited.
Four-question interview prompt; Audi R8 chosen as demo product; basic scaffold site built.
02:47 – 03:52
05 · fal.ai setup
API key setup for AI image and video generation via fal.ai.
03:52 – 04:44
06 · Scroll style prompt
Model selection in Claude Code; scroll style chosen via scene-based prompt.
04:44 – 05:31
07 · AI color palette generation
Palette derived from scene sentence: a buyer drives his R8 at dusk on a canyon road.
05:31 – 06:30
08 · Writing site copy
Luxury copy rules applied: short headlines, specific claims, no em dashes.
06:30 – 07:30
09 · Generating AI images and video
Camera-directed asset generation via fal.ai; five assets total with matching lighting.
07:30 – 08:28
10 · Final site pass
Assembly prompt verifies all sections, images, and colors cohere.
08:28 – 09:16
11 · Custom plugin intro
/build site plugin introduced; context cleared, UltraCode activated.
09:16 – 10:14
12 · UltraCode and dynamic workflows
Three parallel drafts spawned; self-scoring against design principles.
10:14 – 11:24
13 · Full site from one prompt
Air Jordan site completed from product image plus description. CTA to community link.
Atomic Insights
Lines worth screenshotting.
A premium site says exactly one thing — the core messaging prompt enforces this by asking for the single thing a visitor should remember after leaving.
Derive the color palette from a scene the user inhabits, not from brand adjectives — Claude extracts lighting depth and mood from the scene and translates it into hex values and font weight.
Luxury copy follows concrete rules: headlines stay short, captions run three to five words, and claims must be hyper-specific rather than superlative.
The full site runs on five assets with identical lighting and color palette — visual consistency between assets creates the premium feel, not the quality of any single image.
Direct AI-generated video like a cinematographer by specifying lighting, proximity, movement, and mood rather than just describing the subject.
UltraCode dynamic workflows spawn three parallel drafts and score them against design principles before presenting a winner.
Scroll style is not decoration — it is the first thing a customer feels and determines emotional response before any copy is read.
The six-piece framework applies to any product: messaging, motion, color, copy, assets, spine — the prompts stay the same, only the inputs change.
A single spine pass at the end catches coherence failures that individual section passes miss: elements correct in isolation but wrong together.
Connecting fal.ai as an MCP tool lets Claude generate and insert AI video into the site without leaving the terminal session.
Takeaway
Six layers separate a $10,000 site from a generic one.
WHAT TO LEARN
Premium web design has always been structured — Claude Fable makes the structure executable with one precision prompt per layer.
A premium site says exactly one thing: the core messaging prompt enforces this by asking for the single thing a visitor should remember after leaving.
Derive the color palette from a scene the user inhabits, not from brand adjectives — Claude extracts lighting depth and mood from the scene and translates it into a color system.
Luxury copy follows concrete rules: headlines stay short, captions run three to five words, and claims must be hyper-specific rather than superlative.
The full site runs on five assets with identical lighting and color palette — visual consistency between assets creates the premium feel, not the quality of any single image.
Direct AI-generated video like a cinematographer by specifying lighting, proximity, movement, and mood rather than just describing the subject.
UltraCode dynamic workflows spawn three parallel drafts and score them against design principles before presenting a winner — use this when quality matters more than iteration speed.
A final spine pass catches coherence failures that individual section passes miss: elements that were correct in isolation but wrong together.
Glossary
Terms worth knowing.
Claude Fable
Anthropic's most capable model as of mid-2026, described as a mythos-class model designed for complex multi-step tasks requiring coordination across structure, copy, and asset generation.
UltraCode
A high-effort mode in Claude Code that activates dynamic workflows — Claude automatically spawns sub-agents to work in parallel and a second set of agents to verify and score the output.
Dynamic workflows
A Claude Code feature where Claude orchestrates multiple sub-agents to complete tasks in parallel and then judges results against criteria, enabling self-checked output.
fal.ai
A pay-per-credit AI image and video generation platform that can be connected to Claude Code via API key to generate visual assets inside a session.
The spine
The sixth and final prompt pass in the six-piece framework — a coherence check that verifies all sections, images, colors, and copy work together as a unified page.
Core messaging
The first layer of the framework: a four-question interview that locks in what the product is, who it is for, what one thing they should remember, and what render tools are available.
“Expensive sites are quiet. Headlines stay short.”
Rule of thumb, tweet-ready→ IG reel cold open↗ Tweet quote
08:00
“The whole site runs on five assets. Two videos, three images. Same lighting, same color palette.”
Concrete constraint that reframes production thinking→ newsletter pull-quote↗ Tweet quote
00:00
“I built seven premium $10,000 websites in an afternoon from a single prompt.”
Pure hook, no setup needed→ TikTok hook↗ Tweet quote
The Script
Word for word.
Read-along
Don't just watch it. Burn it in.
See every word as it's spoken — crank it to 2× and still catch all of it. The same dual-channel trick behind Amazon's Kindle + Audible.
17px
metaphorstory
00:00I built seven premium $10,000 websites in an afternoon from a single prompt, all thanks to Anthropic's latest model Fable. They have scroll stopping header animations, beautiful three d renders, photorealistic videos and images, and copywriting and design that actually make customers want to buy.
00:18This is the type of site that agencies charge 5 figures for. If we haven't met yet, my name is Duncan Rogoff. I'm a former art director at brands Apple, PlayStation, and Nissan, and I now run one of the top communities for learning quad code and building income.
00:31In this video, we're going to cover the six pieces that go into any $10,000 website and every prompt so you can build this from scratch. And at the end, I'll show you how to get access to a custom plugin that allows you to build an entire website from one product image and a single sentence. So focus in, close all your open tabs, and let's build.
00:49If you haven't heard yet, the latest model from Quad just released and it's called Fable. It is considered a mythos class model and the capabilities exceed that of any model that Anthropic has created before. I'm not gonna cover the benchmarks today, but they are basically blowing everything else out of the water.
01:04Fable excels at complex tasks with multiple steps, which is why it's so powerful for creating an entire website from a single prompt. Structure, copywriting, images, videos, scroll animations, you name it, everything from one prompt. But first, I think it's important for you to understand the pieces of a high converting website.
01:21So today we're actually going to build an entire website piece by piece so you can see what goes into it. If you wanna get access to all the prompts we use today including the custom plugin, I'll leave a link in the description. So these are the six pieces that go into any $10,000 website.
01:36The core messaging, the scroll style, the color palette, the copy, the photo and video, and the spine. The first thing you need to start with is the core messaging which drives the direction of the entire site. From there, we'll decide how our page moves and animates.
01:49We'll come up with a color palette depending on the product. We'll write all of the headlines and all of the proof statements, and we'll even use AI to generate videos and images. And then at the end, we will wire everything together so everything snaps into place.
02:00So I'm gonna do this side by side today. I'm just gonna fire up Claude in my terminal window by typing Claude. If you're not already using Fable and you wanna get access to the latest model, all you have to do is type in model and make sure that you have selected Fable.
02:13Today, we're gonna be building out the pieces using the default settings, but at the end when we wanna build out our entire site from a single prompt, we'll switch this over UltraCode so we can use dynamic workflows with Fable. This will spawn up an army of sub agents to create the site for us in a matter of minutes. So the first thing you need to understand about your product is the core messaging.
02:31What is the message? A premium site will just say one thing. This will reduce overwhelm and confusion and will speak directly to the person that actually wants to buy your product.
02:41So today, I thought it would be really fun to use a truly luxury product, the Audi r eight, as our product today. So I've saved this image of the car and all I'm going to do is upload this into the site and then I'm going to copy and paste this prompt. All the prompt says is here's my product and then attach the photo.
02:58Interview me with exactly four questions one at a time. What is the product or brand in one line? Who is it for and what should they feel?
03:06What is the one thing they should remember? And do I have an AI render tool connected for footage or should we use stock video and images? So the system actually knows how we want to render our assets and we'll cover that in a minute.
03:17And then from there, the system is just going to create a very simple version of the site that we're going to build on. So copy this, come over here, and I'm gonna paste this in. So question one, what is the product or brand name in one line?
03:28I'm just gonna say Audi r a. Question two, who is this site for and what should they feel when they land on it? This site is for premium luxury car buyers and thrill seekers, and they should feel a sense of excitement and speed when they come to the site.
03:41Question three, what is the one thing they should remember after leaving the site? They should remember that this is their dream car and it could be in their driveway this week. So question number four, just ask me if I already have an AI render tool.
03:52We could use something like the Higgs Field MCP. We could use a site like Falle AI. It's really up to you.
03:57So for this video today, I'm just gonna use Falle AI because it's really easy to set up and it's really easy to know how much you're paying. It doesn't cost you anything to get started, you just pay for the credits that you're using. So just come to fal.ai and create an account.
04:09And the only thing that you're gonna need is you're gonna need to come in here and go to API keys. Then from there, you're just gonna click add a key. You can basically just say website builder.
04:18Create your key, then come back into Quad and just saying I'm using Fowl AI and then paste your key in here and Quad will know what to do with it. So Quad just built this very basic site for us and I know this is ugly, but that's kind of the whole point. But we just wanna know that the system works.
04:32You can see Audi r eight, the dream isn't parked in a poster. It's in your driveway this week. Built for people who chase the feeling, not the spec sheet.
04:39So we're just getting started. So the next thing we need to determine is how the header image scrolls. Is it going to be just a looping video?
04:46Is it going to scroll to play? Is it gonna be some sort of exploded view like we saw with the watch? The way the header animates, it's the first thing your customer sees on the page and immediately determines how they're gonna feel about your product.
04:56So look at the product and thesis, pick one scroll style and defend the choice in a single line. So I'm just going to copy this and paste this over here into our chat. So we can see along with the header motion, this prompt is laying out the scaffolding of the site.
05:10The hero section, the thesis section, the feature blocks, a gallery, and a CTA at the end where somebody could buy. So we came back to the site now and you can see we already have the structure of a much nicer site. We have the header, we have the big title here, and now we're starting to build in placeholders for where all our images and videos are gonna be.
05:27But we can upgrade this and make this so much better and of course way more on brand. So the next piece which is arguably one of the most important pieces is the color palette. We actually want the color of the site to reflect the product.
05:39But there's a pretty cool way to do this. The way to do this is to not just describe like the brand. It's not just like a sports car.
05:47One sentence, who is using this product where and in what light? Choose darker light from that scene, then build the color palette. So I'm going to copy this, gonna paste this in, and from here it's going to apply the color palette to our site.
05:58It's going to add any fonts that are relevant for us, and then it's gonna update the site for us. So the page that we're looking at here came from the sentence, a smith pulling steel from the fire after dark. And so if you scroll through it, like obviously that's the vibe here.
06:11And so now we started to upgrade the color palette of the site to actually fit the vibes that we're looking for. And this is the sentence that Claude chose, a buyer takes his new r eight out alone at dusk on an empty canyon road just after sunset. Then it built our entire color palette for us, and it went ahead and applied it to the site.
06:28But a site is nothing without the copy. People are going to be reading first and foremost, and it needs to make them feel something. Type of product it is really determines the copywriting and the messaging.
06:38Expensive sites are quiet, headlines stay short, captions run three to five words with maybe a couple of accented words. Claims get really, really specific. Something like two thirds less acid beats smooth and delicious every time.
06:52So now we're gonna have Claude Fable write the full site copy and update our website for us. It needs short headlines, specific beats, no restated headlines, no em dashes anywhere ever, of course, the detailed rows and the CTA line. So let's paste this prompt in, and Claude is gonna make our updates for us.
07:09I would argue that this piece is the most important piece of the site, but the next piece is really going to be the thing that catches your audience's eye. And so now we started to upgrade the copy and the messaging. Production of the r eight ended in 2024, So every r eight that will ever exist already does, and one of them can be in your driveway by Friday.
07:27Now we talk up the power of the engine, 8,700 RPM. Drive it to the office on Monday, then take the long way home through the canyon and arrive grinning. So the whole idea is to make the customer feel something, to feel an attachment to your product, and to prove its worth.
07:40But this is really where the magic happens in the images and videos, and these need to be right. You need to be able to direct the camera to get the exact feel that you want. Again, with these premium sites, less is more.
07:51The whole site runs on five assets, two videos, and three images. Same lighting, same color palette, close-up slide shots, you name it. So not only will this generate all of the prompts for the images and video, it actually instructs the system to generate them using FAL AI.
08:06So I'm going to copy this and paste this in here, and I'll come back when the images and videos are done. So in just a couple of minutes, this finished and we can see we have this beautiful header video with this light sweep. The car looks incredible and pretty much matches our reference image exactly.
08:19If we come down here, we have another image of the car. We have a beautiful video pass. This nice close-up detail of this brushed metal, it looks incredible.
08:28And there's one last piece just to verify that everything works well together. It's the final pass to rebuild everything to make sure all of the sections are right, all of the images and videos are right, all of the colors and everything is accurate, and it's just going to update the site for us. So I'm going to copy this prompt here, paste this in, and it's just going to do one final pass, and then I will show you how you can use Fable five and dynamic workflows to build an entire website from one single product image and a couple of details.
08:56Our site just finished. We added a couple of new images in here and things like that, and then this beautiful animated text on the bottom. But how can you generate an entire site like this with as little effort as possible?
09:06I built a custom plugin to allow you to do just that. So what I'm going to do is I'm going to type in clear to clear all of the context out of our Cloud session so we can start fresh. The first thing I'm going to do is I'm gonna switch the effort all the way up to UltraCode.
09:21This is so we can use dynamic workflows, which is one of Cloud's other latest features. Basically, the way this works is that Claude is automatically going to spawn up a team of sub agents to complete your tasks and then another team of agents to check the work that's being done. So now you're getting the highest quality output every single time, and Claude is in charge of all of it.
09:40So all I need to do now is I thought it'd be fun to do something like Air Jordans, which everyone recognizes. I'm just gonna come in. I'm gonna save this image of Air Jordans.
09:49And if I come down here, we can see view product details. I'm just going to copy all of these product details. And so now all I need to do inside of Claude is type in slash build site, come in here, upload the product photo, and paste in those product details, and Claude is going to get to work for us.
10:05If it has any questions, it is going to give us those interview questions that we got in the beginning, but that's really all it needs. So we can see it's building the Air Jordan site. I've already given it the product, the copy, and the image, so it's going to skip the interview.
10:18So we can see here it says the pipeline is clear. It's going to draft up the site, and then it's actually going to score the site against any of the design laws and things like that. So it's going to self check its work.
10:28So I'm just going to go ahead and say yes, run it, let's spin up some sub agents, and let's start cooking. We can see here using UltraCode, it's already spinning up three different sub agents. So if I open this up, we can see we have three different versions of our site.
10:41So it's going to actually use Fable five to create all three drafts, and then down here, once those are done, it's actually going to judge them to check its work. The site finished and it is absolutely beautiful with this break apart render up at the top. These incredibly photorealistic images all rendered.
10:57Look at the detail on the shoe. All of the close ups and texture and this beautiful light sweep. The thing looks incredible.
11:04All of the structures in place, all of the copy, and all we gave it was an image and a couple of details about the product. If you wanna get access to the prompts that we used today and this plugin so you can build entire websites from a single sentence, just check the link in the description. If you wanna see how I use Claude code to build an entire AgenTic OS, just check out this video right here.
Seven agency-grade websites. One afternoon. One prompt. Duncan Rogoff — former art director at Apple, PlayStation, and Nissan — opens with the claim and immediately backs it up with the framework: six structural layers every $10,000 website shares, and a set of Claude Fable 5 prompts that build each one from scratch.
Frameworks
Named ideas worth stealing.
01:21list
The Six Pieces of a $10,000 Website
Core messaging
Scroll style
Color palette
Copy
Photo and video
The spine
A sequential build framework where each layer gets its own precision prompt. Palette is scene-derived, copy follows luxury brevity rules, and assets are directed like a cinematographer.
Steal forAny product landing page or sales site
CTA Breakdown
How they asked for the click.
VERBAL ASK
10:56link
“If you wanna get access to the prompts that we used today and this plugin so you can build entire websites from a single sentence, just check the link in the description.”
Soft sell at the end after the payoff demo has already done the convincing. Community link ($9 Skool) is the only ask — clean and non-pressured.
A live demo of seven chained Claude Code skills that handle gap analysis, ideation, hooks, titles, thumbnails, repurposing, and performance tracking — for under $1 per cycle.
A 12-minute tutorial showing how Claude Code, Manim, and Higgsfield can replicate 3Blue1Brown-style math animations with the key prompt locked behind a $9/month community.
00:10
00:18
00:27
00:38
00:49
01:04
01:07
01:15
01:21
01:28
01:37
01:45
02:01
02:17
02:23
02:31
02:41
02:49
03:00
03:17
03:28
03:38
03:47
03:52
04:03
04:25
04:31
04:39
04:54
05:07
05:16
05:31
05:41
05:52
06:08
06:17
06:27
06:31
06:45
06:52
07:09
07:16
07:27
07:34
07:43
07:56
08:05
08:10
08:19
08:32
08:48
09:07
09:09
09:14
09:20
09:40
09:45
09:53
10:01
10:09
10:18
10:33
10:44
10:53
11:02
11:17
12:27
10:13
20:15
12:22
18:30
12:57