Big Idea

The argument in one line.

Claude Fable 5 paired with the Higgsfield MCP collapses the $10k agency website workflow into a $1-2 prompt session, letting any solo builder generate cinematic, scroll-animated sites without touching a design tool.

Who This Is For

Read if. Skip if.

READ IF YOU ARE…

A freelancer or solo developer who wants to offer high-end website builds without outsourcing design or video production.
A Claude Code user who has not yet added MCP connectors and wants to see what AI media generation looks like in practice.
Anyone considering an AI agency who needs to understand the real cost-per-deliverable before quoting clients.
A builder who wants to clone or remix award-winning visual designs without manual Figma or After Effects work.

SKIP IF…

You are already using Higgsfield MCP daily and know the Fable 5 visual capabilities — this is an introductory walkthrough.
You need a deployment workflow — the tutorial ends at localhost and does not cover hosting or domain setup.

TL;DR

The full version, fast.

Claude Fable 5's improved visual reasoning, combined with the Higgsfield MCP which wraps Wan 2.0, Kling, and Nano Diffusion Pro, lets you generate cinematic 3D scroll-animated websites using only prompts. Install Claude Code on the paid plan, add Higgsfield as a custom MCP connector, download a scroll-cinematic skills ZIP from the creator's free community, and prompt Claude with a brand description or a screenshot of an existing site. Claude orchestrates image generation, video generation, frame-slicing, and HTML assembly autonomously. Each full iteration costs roughly $1-2 in Higgsfield tokens. The tutorial demoes a fictional car brand called Chroma One built live, then shows how to add a new section with a single follow-up prompt.

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.

Create a free account →

Chapters

Where the time goes.

00:00 – 00:53

01 · Hook — award-winning clones side-by-side

Opens mid-demo comparing AI-generated sites to real award-winning originals. Establishes the emotional premise before any tutorial content.

00:53 – 01:55

02 · The two-tool claim

States the thesis: Claude Fable 5 + Higgsfield MCP = agency-grade websites for $1-2. Positions Fable 5 as specifically better at visual comprehension.

01:55 – 02:25

03 · Phantom.land one-prompt clone

Shows a completed clone of phantom.land built from a single screenshot and prompt. The 3D sphere scroll effect is intact.

02:25 – 03:08

04 · Setup Step 1 — Claude Code + Fable 5 model

Get on the Claude paid plan, open Claude Code, select the Fable 5 (1M context) model. Opus 4 mentioned as fallback.

03:08 – 04:51

05 · Setup Step 2 — Higgsfield MCP connector

Walkthrough of adding Higgsfield as a custom remote MCP connector in Claude.ai. Copy the MCP URL, paste into Claude connectors, authenticate, set permissions to Always Allow.

04:51 – 06:50

06 · Setup Step 3 — Scroll-Cinematic skills ZIP

Download the skills ZIP from the creator's free community classroom. Drop the folder inside the Claude Code project. Claude reads the SKILL.md file and applies the scroll-cinematic workflow.

06:50 – 09:35

07 · Live build — Chroma One car brand

Sends a single scroll-cinematic prompt for a fictional car brand. Claude calls Higgsfield to generate hero image (Nano Diffusion Pro), two 3D clips (Wan 2.0), slices frames, builds multi-section HTML, launches on localhost 8094.

09:35 – 11:00

08 · Community and sponsor segment

Promotes a paid AI agency community with accountability, client acquisition training, and tech support. Host mentions two years of agency experience.

11:00 – 13:40

09 · Result review and one-prompt iteration

Reviews the Chroma One result live — spinning car, color shift, ONE CAR. INFINITE COLOR. headline. Adds a color-explosion second section with a single follow-up prompt. Reviews the updated output.

13:40 – 15:06

10 · Cost breakdown and wrap

Estimates $1-2 per full build cycle in Higgsfield tokens. Closes with standard subscribe CTA.

Atomic Insights

Lines worth screenshotting.

Claude Fable 5's 1M context window lets it read screenshots of existing websites and rebuild them with faithful visual fidelity from a single prompt.
The Higgsfield MCP wraps at least three separate AI video models (Wan 2.0, Kling, Nano Diffusion Pro) so Claude can call them without leaving Claude Code.
The scroll-cinematic skills file is a SKILL.md prompt that teaches Claude how to slice AI video into sequential frames and bind them to a CSS scroll position.
Each full website iteration — hero image, two AI videos, scroll animation, multi-section HTML — costs $1-2 in Higgsfield tokens, not per month.
Agencies currently charge $10k for websites with 3D scroll effects that this workflow produces in under 15 minutes of active prompting.
Fable 5 is specifically stronger than earlier Claude models at image and screenshot comprehension — when cloning, lead with a screenshot, not a text description.
You can iterate section-by-section with plain language: add a color explosion on the second page is a complete and sufficient instruction.
Award-winning site galleries like awwwards.com/sites are a free library of visual targets — screenshot any and you have an immediate high-quality design brief.
The workflow ends at localhost — deployment is a separate step the video does not cover, which matters before quoting a client timeline.
Higgsfield MCP requires its own account and authentication separate from Claude — factor that setup friction into your onboarding time.

Takeaway

Two tools have replaced the agency design stack for cinematic websites.

PROMPT-TO-SITE

Claude Fable 5's visual reasoning plus a video-generation MCP collapses a multi-tool, multi-day agency workflow into a single prompt session costing under $2.

Fable 5 is specifically stronger than earlier models at reading screenshots and understanding visual design intent — when cloning a site, lead with a screenshot rather than a text description of what you want.
The Higgsfield MCP eliminates the manual loop of switching between Claude, a video generator, and an image tool; Claude calls all three autonomously inside one session.
The scroll-cinematic skills file is a SKILL.md prompt that encodes the video-frame-slicing pattern — any similar instruction file can teach Claude a repeatable production workflow you do not have to re-explain each session.
Award-winning site galleries like awwwards.com are a free library of visual targets — screenshot any entry and you have an immediate high-quality design brief without writing a spec.
Each full build costs $1-2 in Higgsfield tokens, not per month — that changes the economics of client revision cycles: you can afford to throw away a version and regenerate.
The workflow delivers a localhost site; deployment to a live domain is a separate step the video does not cover, worth knowing before you quote a client a delivery date.

Glossary

Terms worth knowing.

Higgsfield MCP: A Model Context Protocol server that exposes AI image and video generation tools (Wan 2.0, Kling, Nano Diffusion Pro) directly inside Claude Code, so Claude can generate and manipulate media without the user switching applications.
Scroll-cinematic pattern: A technique where an AI-generated video is sliced into individual frames pinned to specific scroll positions on a webpage, creating the illusion of 3D animation as the user scrolls.
Wan 2.0: An AI video generation model available through the Higgsfield MCP, used to produce the cinematic 3D clips in this workflow.
Nano Diffusion Pro: An AI image generation model available through the Higgsfield MCP, used to produce the hero keyframe images for each website build.
SKILL.md: A plain-text instruction file placed in a Claude Code project folder that encodes a repeatable workflow; Claude reads it automatically and applies the instructions without the user re-explaining the process each session.
MCP (Model Context Protocol): A standard that lets Claude connect to external services as connectors, giving it access to tools like image generators, databases, or APIs within a single conversation.

Resources

Things they pointed at.

00:53toolHiggsfield MCP ↗

01:55linkphantom.land ↗

08:44linkawwwards.com ↗

09:30linkreadymag.com ↗

Quotables

Lines you could clip.

00:53

“I think we finally cracked the code for building incredibly beautiful websites, award winning websites with only two tools, Claude Fable five and the Hicksfield MCP.”

Bold declarative claim with two named tools — standalone and shareable→ TikTok hook↗ Tweet quote

01:35

“These are the type of websites that agencies charge thousands of dollars and now you can generate them for the cost of 1 or $2.”

Concrete dollar contrast — high relatability for freelancers and agency builders→ IG reel cold open↗ Tweet quote

14:14

“It's like 1 to $2 for every iteration of this because it's generating you an entire new website with different images and videos.”

Specific cost claim that lands the economics in one sentence→ newsletter pull-quote↗ 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.

00:00I mean, this looks cool so far but oh, wow. Look at that. That is incredible.

00:05That is impressive. I can't believe this is made with one prompt. This is mind blowing.

00:11Let's see the next one. Look at this one. Oh, wow.

00:14That's cool too. Oh, yeah. There you go.

00:16That blowing effect. Yeah. I mean, this is crazy.

00:20Honestly, the fact that this is an exact clone of another wow. Look at that. This water effect.

00:25That's really cool. And this is a clone. To be honest, it's better than this award winning website.

00:30I feel like this is way better or at least the look and feel of it. Oh, this one's nice too. Look at that.

00:36It's got this three d sphere. Wow. That is impressive.

00:41So this is the one with cloth that we built, the look, the local host and this is the original website. I mean, that's about as close as it could get. Right?

00:51Look at this. That's really cool. So I think we finally cracked the code for building incredibly beautiful websites, award winning websites with only two tools, Claude Fable five and the Hicksfield MCP.

01:04Honestly, I've been testing this nonstop since yesterday since Fable came out and with the combination of MCP to give you all an access to all of the models that are capable of generating images and incredible videos, you no longer have to use multiple tools and do any manual work.

01:21All you're doing is using Claude Fable five inside Claude code and the Hicksfield MCP to generate anything. I'm talking about any type of website. You can literally clone a website, a world winning website, or you can generate something original from your own imagination.

01:37At this point, honestly, the only thing stopping you is just what's in your mind. That's it. And these are the type of websites that agencies charge thousands of dollars and now you can generate them for the cost of 1 or $2.

01:49And you can see right here, this is just one prompt. I gave it a screenshot, one prompt. There you go.

01:53It generated this entire sphere weird looking website that's a clone of this other website called phantom.land.

02:02Right? Which is the same exact thing. It's got this really cool kind of sphere scrolling thing going on.

02:08So, all I did was just basically gave Claude Fable five and told it to just generate this thing and with one prompt and a screenshot they generated for me. And I can update this with the Hicksfield MCP to add more images because these are just kind of like placeholders. So that's why I went ahead and created multiple other websites with videos and kind of the scroll animation with different frames all again using prompting.

02:31That's it. So I'm gonna show you all of this step by step regardless of your background even if you're a complete beginner, you'll be able to follow me along. Alright.

02:37Let's get started. So, first things first, I'm just gonna go to my clot code here, so make sure you have clot code, you're on the paid plan. Again, I'm on the Fable five model, the 1,000,000 contacts.

02:47This is definitely better as far as kind of understanding the design and reading screenshot and images a lot better, but obviously like I said, Opus 4.8 is also very impressive.

02:57So, if you don't have that, that's fine use the Opus 4.8 for now. So, once you're inside your clot code, the step two is going to be installing the Hixfield MCP because like I said, if you want to create those three d scrolling effects and those incredible images and videos because those are actually generated videos and you need like Cdance two point o, Nano Banana Pro or Cling AI and all of this.

03:20But instead of doing it manually with the Hixfield MCP, again, like I said, you can just use prompting which is a lot more convenient in my opinion. So to add the Hixfield MCP, you're gonna come down to the bottom right here, click on the plus button, you're gonna go to connectors, you're gonna go to manage connectors, you're gonna come to the top obviously mine's already there but I'm gonna show you how to do this.

03:40You're gonna click on the plus button, you're gonna click on add custom connector. So right here you can name it something, so just name it whatever Higgs six field. Now remote MCP server URL.

03:51So in order to get this, you're gonna click on a link in description and it's gonna bring you right here. So this is, uh, the Higgs field MCP custom URL that you're gonna grab.

04:00So right here, make sure you're on the MCP and on Claude And you're gonna come right here in the bottom and just copy this. So once you copy this, you're gonna go back to Claude and you're gonna paste it in this remote URL and you're gonna click on add.

04:13And this will automatically add that and it'll take you to Hicksfield.

04:17Obviously, you need to make sure you have an account set up with Hicksfield and it'll authenticate and once you authenticate, you're gonna come back and it's gonna look like and it's gonna say connected. Obviously, mine says a server with this URL already exists since I've already connected it, so that's why it's not gonna allow me to do it again.

04:30But when you come back, it should look something like this. Right? It should say Hicks Field and you have all these two permissions.

04:36Right? So you can just say always allow so that way it doesn't keep asking you over and over again and then make sure that you have it connected because obviously right now it shows the disconnect because it's already connected.

04:46So, if yours is not connected, make sure you click on connect here. Okay. So, once you do that, you're gonna come back here and you're gonna go back to the plus button here, just hover over connectors and make sure that your Higgs field MCP right here, there you go, it's toggled on.

05:01Okay. So, now, you have the tools installed. Now, another important thing to do is I've also created kind of a skills folder for you guys so that way you could it has all of the instructions for the design.

05:12Again, this is optional but this is very important if you want to have the ability to have this scrolling three d effect.

05:20So, if you want to have because this breaks it down, breaks the video down when the HixView generates video with the model like Cdance two point o or Cling, it breaks down the video into multiple frames so that will as you can see, I'm scrolling right now. Right? So as the person comes to the website and they scroll, they have this effect that's coming in there.

05:38So these skills are important if you want to have it generated, generate this type of scrolling animation. But obviously, you can play around with your, you know, if you have your own ideas, you can go ahead and do that.

05:50So, in order to download the zip file, you're gonna head over to my this is a free community again, you don't have to pay anything. You're gonna go to the classroom section.

05:59Again, you can put the click on the link in description. It's gonna bring you right here and all you have to do is just go to the classroom section, YouTube resources, Claude code and at the bottom I've put award winning websites with Claude.

06:12So, you're gonna come right here and you can click on this zip file and you're gonna download this file. Right. Once you download it, it's gonna look something like this called scroll, uh, cinematic zip.

06:22If you just double click on that, it's gonna download this thing. So then you're gonna take this folder and put it inside your cloth coat folder and tell it to use. It's very simple.

06:31And, if you, you know, if you get confused there, just go ahead and copy and paste, um, the skill dot m d file and tell clot code to make sure that it applies all the instructions. Alright.

06:42So, once you have those two things installed, now what you're gonna do is just basically type a prompt similar to this. So let me just go ahead and and paste this. Alright.

06:50So I said use the scroll cinematic skills, right, and that's what we just downloaded from the skills files to build a three d scroll scroll website for, again, this is where it's a placeholder, I said whatever it is. Right? Generate a high end cinematic hero plus two three d clips with the Hicksfield MCP at ten eighty p, slice them into scroll frames and build a polished brand multi section site that matches its vibe then launch it on localhost.

07:15So this is where now you can basically use your imagination for you know to come up with websites. So let's say, uh, for a new car brand.

07:25Right?

07:28With incredible colors or something like that.

07:41Right? Something simple. And this is where you can now play around with the problem later on if you choose to, if you don't like something.

07:47So I'm gonna just press enter just to see where where this goes so that way I can show you the process and then you can feel free to do whatever whatever you're doing.

07:54Right? So, I just said use this crawl cinematic skills to build. So, now it has access to that.

07:58Right? So, it said running skill scroll cinematic. So, this is all inside the zip file that you downloaded.

08:03It's just basically a set of instructions that we're giving a clot code using the Fable five to be able to, uh, grab all of those details and give us a website that's similar to something like this. Right? Or or if you again, if you want to copy an existing website, all you have to do is just kind of take a screenshot and give it a prompt and say, hey, generate this particular website or something similar to it with these effects using the Hicks field MCP to generate the images and videos.

08:30Right? So play around with that and that's how you can find out, know, the details and make it make it perfect to your own liking.

08:39And obviously, you can go somewhere to like a website like this awards.com. Right? So if you just go to let me just go to awards.com/sites.

08:55So these are all of the award winning sites that are that are out there. So you can just go ahead and let's say you're in a particular niche.

09:04So if you're in architecture, right, you can just basically click on that and find all of these award winning websites that are done by actual design agencies that charge thousands of dollars.

09:16And you can essentially just give them a take a screenshot of this. So you can go inside. Let's say, let's take a look at this one.

09:23Right? Go to website and give it also you can just copy the link to the website itself.

09:32To be honest, this is not that impressive. I don't know why. But sometimes these award winning websites are for not necessarily the colors and everything but it might be for some kind of a functionality.

09:43So let me actually go back to make sure. So there you go. So now, uh, it's generating a new car brand for us.

09:49So you can see it's using the Higgs field MCP to create, uh, generate the image using Nano Banana Pro and it's going to use the Higgs field MCP again to use the to generate the videos using Cdance two point o which is right now the best model in the market. So as you can as you can see, all of this is kind of hands off. You just give it a prompt and it's gonna go ahead and do everything on its own and then after it's done, you can kind of go back and forth with it.

10:13So let's go ahead and let this thing finish while this thing processes. Oh, and by the way, if you're interested in learning how to monetize these, I also have a paid community where we teach you exactly how to build and sell, uh, clot code projects to actual businesses. I mean, is where we teach you the build part and then also how to reach out to clients, how to find your clients, how to sell because that's the important part.

10:34Right? Selling is a big part of, uh, any, uh, business. So this is where we teach you as far as, uh, from the AI agencies perspective.

10:42And if you're, uh, interested in starting your AI agency, this is where we also have a day to day accountability program. We show you exactly how to start your AI agency. And again, this is based on my own experience.

10:52I've had a agency for the past two years now, so everything you see is based on real life experience. And, of course, uh, any tech support and like minded people from all over the world are there to help you out, myself and my team members all everybody's there.

11:06So check out the community if you're interested. Link is gonna be in the description as well. So let's go ahead and see what's going on here.

11:10Alright. Cool. So it looks like it got done.

11:12Let's take a look at the first version. That's pretty nice. Right?

11:16You can see that's kind of actually, I'm gonna go to the local host 8494. That's probably gonna be easier. Alright.

11:24So there you go. We're in the local host 8094. So it's kind of got this really cool landing page and as I'm scrolling, you can see it created this incredibly beautiful car.

11:34So it kinda does the spin and it gives you this, the the font on top of it. Right?

11:41Like, very cool. So the second version is the second section saying every other car was painted once at a factory forever. Chroma should gives you different models.

11:50Right? And then the bottom has the same animation. So let's say you wanted to add more to this.

11:56Right? So this is where you can say, hey, on the second page, I want to have kind of that color explosion similar to, uh, this right here.

12:04Right? So we can just go back to clock code and say, so I just can you add a color explosion three d scrolling video on the second page right after the landing page to have the wow effect? Use the Higgs field MCP to generate the images and videos with the best AI models.

12:28Okay. So now again, same thing. So now it's gonna go ahead and add that, uh, second section there.

12:34And this is like I said, how you can go back and forth and change, uh, any of these sections of the website stuff. The color exposure scrub section right after hero, generating a new key frame first, the car frozen inside a burst of liquid iridescent paint.

12:49So that's what it's gonna do. Now it's gonna go ahead and generate the widget using the hex field MCP. So now, it's gonna use Nano Banana Pro to generate that image and then afterwards the video is gonna go ahead and complete that.

13:00So let's go ahead and give us a couple of minutes. Alright. Cool.

13:02So it got done. So it looks like it generated this other one with these colors that were coming out.

13:08So now, this is the first section. The second section is this. There you go.

13:12So now it's got this really cool oh, wow. Look at this. It's got this really cool color unleashed just like we mentioned that exploding color there.

13:20So if we go to refresh the page here, now we should have that applied. So that's the front.

13:26There you go. That's the second section. Very nice.

13:29Look at how well done that is. I like the colors kind of coming out of the car and it has the text overlay there.

13:37Right? So as you can see as you, uh, kinda scroll, it goes back and forth and adds those color explosion explosion.

13:44So that's how you can add like more sections to this and you can keep going back and forth. So let's say, if you don't like this, then you can just mention. I mean, I I I gave it a very simple prompt.

13:54Right? But if you wanted something specific, then you can tell it exactly that, hey, generate this, uh, new explosion video of a b c d or whatever you wanna tell it to do and it will automatically update that. And like I said, you don't have to do any manual work of, you know, going to Google or Gemini or Cdance or Cling and doing everything manually and coming and fixing it together.

14:15This takes care of all of this. Obviously, it does cost you. Right?

14:18Because anytime you're doing everything automatic, um, then it costs you money. But the good thing is it's not that much.

14:24It's like 1 to $2 for every like, you know, iteration of this because it's generating you an entire new website with different images and videos. At least that's what I was looking at when I was looking at the Higgs field MCP generation tokens that it used approximately goes around 1 to $2 for each generation there.

14:41So check it out. Uh, you know, again, like I said, Fable five is incredible at recognizing images of existing websites and, uh, with the combination of the Hexfield MCP.

14:51Now you can literally clone websites or like I said, generate your own from your own vision. Hopefully, you found this video helpful. Let me know what you guys think.

14:58Thanks for watching. Make sure you like and subscribe, and I'll see you on the next one.

The Hook

The bait, then the rug-pull.

Before a single instruction is explained, the screen is already showing the results: AI-cloned award-winning websites sitting next to their originals, nearly indistinguishable. The hook works because it skips the setup and opens mid-demo, forcing the viewer to ask how rather than whether.

Frameworks

Named ideas worth stealing.

00:53model

Two-Tool Stack

Claude Fable 5 (inside Claude Code) handles orchestration, understanding, and code generation. Higgsfield MCP handles all media generation (images, videos). Nothing else required for the design/media phase.

Steal forAny client project requiring cinematic web presence — position as cost-efficient alternative to a design agency

04:51concept

Scroll-Cinematic Pattern

AI-generated video is extracted into N sequential frames, each pinned to a CSS scroll position. As the user scrolls, frames play in sequence, simulating 3D animation.

Steal forHero sections on product or portfolio sites

01:55concept

One-Prompt Clone Workflow

Screenshot an award-winning site, give it to Claude with a prompt to clone or take inspiration from it using Higgsfield for media. Iterate via follow-up prompts.

Steal forClient work where you want a premium visual bar without starting from scratch

CTA Breakdown