Claude Opus 5.5 paired with the Higgsfield MCP can turn one detailed prompt into a fully built, cinematic 3D scroll website with generated imagery in a few minutes, but the output still needs a human, or a second AI reviewer, to catch missing product clarity.
Who This Is For
Read if. Skip if.
READ IF YOU ARE…
You already use Claude Code and want to add AI-generated 3D scroll-animation sites to what you can prototype for clients or your own products.
You're curious how an MCP server plugs a third-party image/video generation tool into Claude Code's workflow.
You want a free, copy-paste prompt template to test cinematic product-launch-style landing pages before committing to a build.
SKIP IF…
You want a from-scratch coding walkthrough — this is prompt-in, watch-it-build, not a tour of the generated code.
You're not willing to sign up for a third-party MCP tool or join a Skool community to get the prompt pack this video is built around.
TL;DR
The full version, fast.
The creator shows Claude Opus 5.5 inside Claude Code building two full cinematic 3D scroll websites, a bass speaker brand and a croissant bakery, from single long-form prompts. The workflow requires connecting the Higgsfield MCP so Claude can generate the product images and videos it stitches into the scroll animation, then pasting a prewritten prompt from a free community prompt pack. While the croissant site renders, the creator's personal AI assistant Jarvis reviews the first website and flags that the landing page never explains what the product actually is, an editorial note about design polish outrunning clarity that applies to any AI-generated landing page.
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.
Cold open scrolling through the finished CYMA One bass speaker site: color-explosion animations, an X-ray/thermal view of the product, synced sound.
00:31 – 01:06
02 · Claude Opus 5.5 Overview
Creator states Opus 5.5 just dropped and calls it the best model yet for 3D scroll websites, then offers a free prompt pack with cost guides and per-industry examples.
01:06 – 03:12
03 · 3D Website Demo
Full walkthrough of the CYMA One bass speaker site built earlier with one prompt: mouse-reactive color fireworks, scroll-triggered color explosions, theme switching, an exploded-parts diagram, and $1,290 pricing.
03:12 – 04:14
04 · Build From Scratch
Switches to the Claude Code desktop app, confirms Opus 5.5 is set to max, and explains the model needs to coordinate with outside tools to generate images and video.
04:14 – 06:13
05 · Connect Higgsfield MCP
Signs up for Higgsfield, copies its MCP connector URL, adds it as a custom connector inside Claude Code, and authorizes the connection.
06:13 – 07:32
06 · Free Prompt Pack
Joins the free AI Workshop Lite Skool community, navigates to the Classroom's YouTube Resources folder, and locates the prompt pack referenced throughout the video.
07:32 – 08:48
07 · Build the Croissant Website
Copies the LAMINA prompt (a fictional bakery launching a croissant like a flagship phone), pastes it into Claude Code, and explains what the prompt specifies: 4K imagery, exact design direction, and an instruction to use the Higgsfield MCP for every asset.
08:48 – 12:55
08 · Jarvis + Cost Breakdown
While the site generates, a tangent into Opus 5.5's cost efficiency and a live demo of the creator's personal AI assistant Jarvis, which is shown Jarvis's own screen-share critique of the earlier CYMA One website's clarity and CTA.
12:55 – 15:36
09 · Croissant Website Reveal
The finished Croissant Pro site is opened on localhost: scroll-triggered layer breakdown (81 layers), an X-ray/thermal view, a 360-degree turn-and-inspect view, and per-croissant pricing tiers.
15:36 – 16:30
10 · Wrap Up & Resources
Closing pitch: links to the free prompt pack and Higgsfield MCP, plus a paid community offer to get a personal Jarvis-style AI assistant.
Atomic Insights
Lines worth screenshotting.
A single long-form prompt, correctly structured, can direct Claude Opus 5.5 to both generate a website's imagery and assemble it into a scroll-triggered animation.
The generation pipeline needs a connected MCP tool (Higgsfield in this case) before Claude Code can create the images and videos a cinematic site requires; Claude alone can't generate that media.
A polished, expensive-looking landing page can still fail at the most basic job of a landing page: telling the visitor what the product is.
Asking a second AI to critique a generated website's copy caught a real gap, that a $1,290 listing gave no plain-language description of the product, before a human reviewer did.
Community-sourced prompt packs turn a one-off successful prompt into a repeatable template across other industries, rather than a single lucky result.
Scroll-triggered 3D product reveals (exploded views, X-ray layers, 360-degree spins) are now generatable as a website feature, not just a video effect.
The generation process for a full cinematic multi-section site with custom media takes several minutes of unattended agent work, not instant output.
Takeaway
A generated site can look expensive and still fail to say what it sells.
WHAT TO LEARN
Wiring an image/video generation tool into an AI coding agent can produce a fully built cinematic scroll site from one prompt, but the design layer still needs a clarity check a generator alone won't run.
02Claude Opus 5.5 Overview
The creator frames Opus 5.5 as a step up specifically for 3D scroll-animation website generation, distinct from general coding capability.
A prompt pack turns a one-off successful prompt into a repeatable, industry-specific template, rather than a single lucky result you can't reproduce.
033D Website Demo
A cinematic scroll site was built from a single, long, detailed prompt covering resolution, imagery, design direction, and layout.
A scroll-triggered exploded-parts or X-ray view can now be generated as a website feature, not just built as a one-off video effect.
04Build From Scratch
An AI coding agent can't generate its own images or video; it needs a connected external tool (here, an MCP server) to produce that media.
05Connect Higgsfield MCP
Connecting a new tool to an AI coding agent is a one-time setup: get a connector URL from the tool, add it as a custom connector, and authorize the account.
06Free Prompt Pack
Free prompt packs and templates are commonly distributed through gated communities rather than direct downloads, trading an email or a join for the content.
07Build the Croissant Website
The generation step for a multi-section site with custom media runs unattended for several minutes, not instantly.
08Jarvis + Cost Breakdown
A generated landing page can look premium (color, motion, 3D detail) while still omitting the one line that tells a visitor what the product actually is.
Asking a second AI reviewer to critique a generated design for clarity, not just aesthetics, caught a real gap a human skim missed.
The fix for a vibes-only landing page is one plain sentence under the tagline stating what the product is and why it costs what it costs.
09Croissant Website Reveal
A finished AI-generated prototype site is treated as something to hand a prospective client directly, with customization discussed afterward, rather than a private draft.
Glossary
Terms worth knowing.
MCP (Model Context Protocol)
A connector standard that lets an AI model like Claude reach out to external tools and services, such as image or video generators, as part of completing a task.
Higgsfield
A third-party platform bundling image and video generation models plus tools like FFmpeg, connected to Claude Code here via an MCP server to generate the website's visual assets.
Prompt pack
A prewritten collection of long-form prompts, organized by industry, distributed through a community so members can copy, paste, and run them without writing their own from scratch.
“The problem is that nothing above the fold says what it actually is. So visitors are being asked for $1,290 for a speaker, sculpture, or very expensive paint mixer on vibes alone.”
sharp AI critique of style-over-clarity design, applies far beyond this one site→ TikTok hook↗ Tweet quote
14:15
“I manage his email, calendar, phone calls and deals, and gently explain to him that the thumbnail does not need a seventh arrow.”
self-deprecating punchline delivered by the creator's own AI assistant→ IG reel cold open↗ Tweet quote
13:58
“Raw dough goes in, something better comes out.”
tight tagline lifted straight from the generated site's own copy→ 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.
17px
metaphoranalogy
let's scroll oh wow that's incredible i love that color explosion that is sick oh that is nice look at that it has a sound actually as i scroll it kind of zooms in on the croissant i like it oh that's cool look at that all right oh that is nice 71 air raw dough goes in something better comes out oh nice so this is inside the bakery very cool X -ray vision, no crumbs.
It has a thermal one, nice. So Opus 5 .5 just dropped and it is by far the most incredible model when it comes to creating 3D scroll animation website. So in this video, I'm going to show you step by step how to create these amazing websites.
But on top of that, I'm going to give you this prompt pack completely for free. So that way you can just follow along. And again, this includes everything, including the cost guide and most importantly, prompt examples that you can copy and paste.
I have prompt examples here for every single industry you could think of. So all you have to do is just follow me along. you can just copy and paste these prompts into your own Opus 5 .5 and it'll generate incredible website like these.
So before we jump into the website creation and then all the setup and everything, I want to quickly go over this website that I created with Opus 5 .5 because it's absolutely incredible. I'm going to give you a full demo and then we're going to jump into the step -by -step guide. Again, feel free to skip this if you don't want to see it.
But this is what I created literally with one prompt. So this is a website for this bass speaker product called SEMA, right? So this is the landing page right here.
As you come into the website, it's called SEMA 1. See the bass. And then in the bottom, as I scroll, and by the way, just before we scroll, you can see as As I move my mouse around, it has these nice little color firework things.
And if I click, you have the nice little color fireworks, which is such a cool little touch. And again, I didn't tell Opus 5 .5 to create this. It kind of came up with it with just a general prompt that I did.
But anyways, so let's go ahead and scroll through. So as I scroll, you'll see, and by the way, it has a sound as well. So if I turn on the sound, so that way you can hear it too.
look at that so as i scroll it has these beautiful color explosions and then around it it showcases the different features that this bass player or bass speaker has right so it says walk around a single beat we stop time at the top of the drop and as i scroll again it showcases kind of the color uh floating around and then also i have the ability to change the colors here so i can choose the original neon sunset ocean right mono so it's very cool that it gives you different options and then of course i can scroll and go inside the color oh i should actually go back and make this original because i like the original all right so if i go down so look at this as you scroll it kind of zooms into the color and it says every color is a frequency which is so beautiful here and as i scroll down now it kind of showcases the different layers of this bass player or this bass speaker so it has like the microchip in the bottom and it has all the features and then the colors and everything i mean absolutely remarkable and then it has uh the different color options that you can buy for 12 .90 right so really cool website design for that looks like an actual product so these are the type of websites that you will be able to create with this all right so let's go ahead and now uh create one from start to finish using that prompt back so i'm gonna do this so let me turn off this sound here
I'm going to do this inside my cloud code here. So if you don't have the desktop app installed for cloud, make sure you install that because this is the easiest way to create these things and to save all of the files in your local computer there. All right, so once you install the desktop app and make sure you sign in into your account, of course, and then on the bottom right here, as you can see, I'm using Opus 5 .5.
I'm using it at max. Honestly, at max, it works really well as far as understanding your prompts. really well and then also coordinating with different tools and the assets to generate the images and the videos and everything else that we need so speaking of that in order to generate because obviously as you can see these are This type of website requires images and videos and a tool that breaks down the videos into frames.
So that way it applies it to this website and puts everything together. And in order to do that, we're going to actually give Claude an MCP tool called Hixfield because that's where we need to reach out to these different models like image models and video models. So go ahead and click on the link in the description.
It's going to bring you right here. Now, for those of you who are not familiar with Hixfield, Higgs field has all of the top video and image models and on top of that it has a lot of other tools like FFmpeg Like sound design and everything else that we need to generate the website from within Claude code or Opus 5 .5 So that's why like I said, you're gonna need a tool like this So once you click on a link a description, obviously you have to sign up for an account He's gonna bring you directly right here.
So to connect takes field to Claude code or to Claude. It's very simple make sure again, you click on the MCP here, and you have selected Claude here, then you can connect, click on connect X field is going to open up a new page where it shows you exactly what to do, right.
So you're going to go ahead and add a custom connector and just copy and paste it. So let's go ahead and copy the URL here. And then we're going to head over to our desktop app, click on the plus button here, go to connectors, go to browse connectors.
and here we're going to click on add and add a custom connector okay so we're going to paste this mcp url and then you can just name it hicks field okay and then click on continue. So now this is going to connect yours, obviously mine, it says a connector with this URL already exists in your organization.
So that's why it's saying, I'm not gonna allow you to duplicate, but you're just gonna afterwards, ask you to go ahead and sign in to your Hicksfield account. So you can see it's going to look something like this, right? So it's going to say connect, once you connect it, it's going to open up a new tab where it's going to ask you to allow Hicksfield to be used from inside your cloud and then That's pretty much it, you're all done.
And if you go back to your cloud code now. Hover over connectors. You should have your Hicks field now toggled and installed So that's all we need to do as far as the tools the tool setup itself So now as far as the website creation, so let's go ahead and take a look at our prompt pack here So this is the prompt act so I'm gonna scroll down by the way to gain access to this prompt pack again It's gonna include all of the pricing and everything else you need all of the information So in order to gain access to this so all you have to do is just again I'm gonna put the link in the description again.
It's gonna It's going to be because there's multiple links in the description. It's called Free Community, Free Prompt Pack.
Okay, so click on that. It's going to bring you to this AI Workshop Lite community. Again, this is absolutely completely free.
You're going to click on Join, and then you're going to go to the community once you join and head over to the Classroom section. Go to YouTube Resources, and then in the Cloud Code and Codex page folder, you'll scroll down to the bottom, and you'll have access to that prompt pack. And obviously, I have a bunch of other stuff in there for you guys.
completely for free, like Jarvis and everything else that you need. And of course, there's like 1000 63 ,000 people at this point in the community. So lots of free resources there.
Okay, so once you grab that, so now let's go back to our cloud code here. So let me open the page again. So you can now Scroll through and choose like any of these examples, right?
So the one that we just that I just showed you is called SEMA see the base So this is the prompt example for that So all you have to do is just copy and paste that but we're gonna create a new one So I'm gonna actually do this first one called lamina a croissant launched like a phone, right? So I'm just gonna go ahead and copy this this entire prompt go back to Claude and then all I'm gonna do is just paste it here Okay, so we're just gonna enter and then I'm gonna explain what this is.
All right, so there you go. It says, build me an award -winning cinematic 3D scroll website for Lamina, a fictional artisan bakery that launches its croissant the way a tech giant launches a flagship phone. Croissant Pro, our most layered croissant ever.
So you can see it's like a really long prompt, but essentially it's saying to have a 4K resolution, high quality images, and also describes exactly the design. of the website for this croissant right and then on top of that most importantly it's saying for all of these assets that you need use the hicks field mcp to generate it and then put everything together and launch it on a local host or on a private server on your own computer so that way at the end you can see all of that so now obviously this is going to take a couple of minutes because we're we're giving it a lot of instructions and it's going to you know take its time to generate the assets put everything together and then show us the website so as you can see right here so it's going it's gonna, you know, think and then afterwards, use the Higgs field MCP to generate the website.
Now, while this is generating, so obviously, Opus 5 .1, as I mentioned, is by far the best model and for a good reason, because not only is it the combination of the smartness of Fable 5 .1, but on top of that, it's actually very cost effective, right? So for instance, I've been using this inside my AI assistant Jarvis, as you can see right here.
So it's using Opus 5 .5 the opus 5 .5 brain and it has been i've been seeing a lot of improvements not only in the agentic usage the tool use and everything but on top of that it's the cost itself is definitely very efficient.
So as you can see, my AI assistant Jarvis has access to all the tools that I need because he's a true assistant. So he has the ability to utilize different tools when I give him a task. And then on top of that, like I said, just the efficiency of how good it is is absolutely remarkable.
But if you guys are not familiar with Jarvis, so Jarvis is my personal assistant. And what you're seeing right now spinning, this is my AI second brain, all of the files and folders in my computer right here. and he has access to all of it so i can just ask him to do whatever i want so let me give a quick demo hey jarvis my youtube audience is watching you right now give a quick introduction to everybody good day everyone i'm jarvis mr trabzada's ai butler i manage his email calendar phone calls and deals and gently explain to him that the thumbnail does not need a seventh arrow Yep, exactly.
Jarvis is very funny. He has a sense of humor. Again, he has access to a bunch of different things.
I can also share my screen with him and lots of other functionalities. Let's actually see what's going on here. Oh, there you go.
So our website is being built. As you can see, it's using GPT image 2 .5 to generate the images. So it generated this beautiful croissant and it's going to go ahead and keep moving forward and generate everything.
So let's go ahead and give this a few minutes while we get back to Jarvis so we can ask his opinion on what he thinks about it. website someone actually share my the screen that I created with them I can see your screen now sir ask me to look anytime Jarvis I'm sharing my website that I just generated what do you think about this website do you like it any criticism any opinions It's rather good.
The paint on a subwoofer render is striking. See the bass is a clever line. And the orange to pink one gives the black page some life.
The problem is that nothing above the fold says what it actually is. So visitors are being asked for $1 ,290 for a speaker, sculpture, or very expensive paint mixer on vibes alone. I'd add one plain line under the tagline explaining the product and why it's worth the price and make scroll to drop it larger since it's currently whispering at the audience in eight point gray.
oh okay Jarvis thanks yeah that's a good point actually yeah so like Jarvis mentioned uh it's telling it hey like the landing page itself is not clear to what the product itself is right because it just says see the base instead of describing where this is a you know base speaker or subwoofer or whatever it is so saying that make sure that you include the low line very good point Jarvis thank you My pleasure, sir.
Something like a 12 -inch subwoofer that paints your music in real time would do nicely and stops people assuming $1 ,290 buys them a very serious paint tray. But it's not a paint tray, Jarvis. It is an actual bass speaker.
Quite right, sir. My mistake. It's an actual subwoofer, and the paint is simply showing what 32 hertz would look like if bass had a wardrobe.
Try a subwoofer so deep you can see it, which explains the product and keeps the see the base idea without promising anyone a speaker that redecorates the living room. Yeah, that's a good point. Anyway, sorry, that's enough of Jarvis.
Yeah, so Jarvis had a good point. So obviously when you're creating these websites, if it's for clients and stuff like that, you want to make sure that not only are you, you know, looking at the design aspect of it, but on top of that, you want to make sure that the CTAs and call to actions and everything else is pretty obvious.
So that way it's an actual functional website rather than something that just looks pretty. Anyways, so all right, let's give this a few more minutes and then we can come back and take a look at it when this is finished. All right, so after a good few minutes, so it looks like it got done.
It says Croissant Pro. So as you can see, it has a preview. And then so you can see it used Hixfield to generate the videos, images, and all different assets.
And then afterwards, it launched everything on our local host 506. Let's go ahead and open this. All right, so this is the landing page.
So it says Croissant Pro, our most layered croissant ever. Lamina Bakehouse presents. So this is actually for a bakery, right?
So right away, it looks very good. Look at this. As I scroll, it kind of zooms in on the croissant.
Very cool. 81 layers, 21 sheets. That is beautiful already.
A croissant engineer for like a flagship. I like it. Ooh, that's cool.
Look at that. That is nice. It kind of breaks apart as I scroll.
That's very cool. And that kind of flakes fly all over the place. That's very nice.
All right. All right, cool. So it shows the cutting in different layers.
Very nice. 0 .8 millimeters caramel shell, 0 .3 millimeters per layer. It is actually like a product launch, right?
71 % air. That's very nice. Now it says, now step inside the honeycomb architecture.
All right. Ooh, that is nice. Look at that.
That is very cool. 71 % air, light enough to float, rich enough to matter. I like it.
It's very detailed. You can see kind of the layers from the inside, just like you're inside the croissant. Raw dough goes in, something better comes out.
Ooh, nice. So this is inside the bakery. Very cool.
Look at how cool that is. I like how precise and... As you scroll, it shows exactly the different layers and the thing expanding and becoming an actual croissant.
That looks delicious. X -ray vision, no crumbs. Oh, cool.
Look, you can move the X -ray around and it has a thermal one. Nice. Very nice.
All right, cool. Or, I mean, if you put the mouse outside, it automatically just kind of goes through and shows the different layers of the croissant. Very cool.
Turn it over, go on. Very nice. And which one is right for you?
It has different... prices for each croissant honestly if i'm a bakery like i would buy a website like this right like this is very well done so that's that's those are the type of websites that you can create i mean this is absolutely remarkable that this was generated from a single prompt and like i said there's lots of different examples here so whatever industry you're in take a look at it like play around uh and again if you're building it for client this would be something that you can build uh and just send it to them for free right and then uh you can hop on ask them to hop on a call if they want to do some kind of customization and everything.
Very impressive. And like I said, it is cheaper compared to the previous models just because of how efficient Opus 5 .5 is. Anyways, well, hopefully you guys found this helpful.
Like I said, all of the links are going to be in the description, including the free prompt pack. And then also, if you guys are interested in grabbing a Jarvis of your own, that's also going to be a link in the description. That's going to be in the paid community.
So that's inside the paid AI workshop community where you can just grab Jarvis and all the other AI assistants and AI employees. Just download the zip file, upload it to your own computer, and you'll be able to have an AI assistant like Jarvis for yourself. Anyways, hopefully you guys found this helpful.
Again, If you have any questions, put them in the comments below. I'll try to get back to you guys as soon as I can.
If not, make sure you like and subscribe because like I said, I've got a lot more content coming up that you don't want to miss. Thanks for watching and I'll see you on the next one.
The Hook
The bait, then the rug-pull.
The video opens mid-scroll on a bass speaker's product page: paint-colored splashes exploding into frame, a thermal X-ray view, sound synced to the animation. Only after establishing that this was built from one prompt does the video back up to show how.
Frameworks
Named ideas worth stealing.
04:14list
Prompt-to-cinematic-site build process
Install and sign in to the Claude Code desktop app, set to Opus 5.5
Connect an MCP tool (Higgsfield) that can generate images/video
Get a prewritten long-form prompt from the free community prompt pack
Paste the prompt into Claude Code and let the agent generate assets and assemble the site
Review the result yourself, or have a second AI (Jarvis) critique it for clarity
Launch the finished site on a local host to demo it
The repeatable sequence the video walks through twice, once already-built (CYMA One) and once live (Croissant Pro).
Steal fora fast prototype-to-client-demo workflow for any AI-generated landing page
CTA Breakdown
How they asked for the click.
VERBAL ASK
06:34link
“join the free AI Workshop Lite community to grab the prompt pack”
Soft-gated behind a free community join rather than an email form, then repeated harder at the very end with a paid upsell to a personal Jarvis assistant.
Add Modern Creator as a preferred source and Google shows you more of our breakdowns in Search, Top Stories, and AI Overviews. It only changes what you see, and you can undo it in your Google settings anytime.
Add to Preferred SourcesOpens your Google source preferences with us pre-loaded. Tick the box and you're done.
A screen-recorded walkthrough of turning one long prompt — or one saved skill file — into a fully rendered Vox-style paper-collage explainer, script through voiceover, using Claude Code and the Higgsfield MCP.
A brand-voice file, two MCP connectors, and one prompt turn Claude Code into a social-media team that researches, writes, designs, and posts on autopilot.
A side-by-side dashboard test of Claude Opus 5.5 alone versus Opus 5.5 paired with Jev, a fast decision-only model, on the same 12 customer support requests.
A full walkthrough of wiring OpenAI's GPT-6 Astra to a Higgsfield MCP and a Blotato MCP so the agent researches, designs, writes, and publishes a social carousel on its own.
A creator rebuilds his voice-controlled AI assistant on Claude Fable 5.1 and shows it browsing a 3D map of his notes, drafting an invoice from memory, and placing a real phone call to a tire shop.