Claude Fable 5 Built a $10K Website in Minutes transcript

Kind of cool already, but oh wow, I like that. That is beautiful. Look at this. Honestly, I'm shocked that this is made with one prompt. [music] This is incredible. Okay, now let's look at the portfolio website. Okay, nice. That is cool. Man, this is very nice. Wow. So, Claude Fable 5 is back and it is absolutely incredible at building websites. I've been testing this non-stop since yesterday. So, in this video I'm going to show you step-by-step how to do this, but on top of that I'm going to give you this one prompt website pack that you can basically just copy-paste depending on whatever niche or whatever you want to build there.

You can build portfolio websites, you can build like e-commerce website, whatever you need. I'm going to give you guys this completely for free in the description of video, so that way you can just follow me along. We're going to be using this all inside our Claude code and we're going to connect this to a model like C Dance 2.0 and Nano Banana or GP2 image, so that way we can create everything within Claude code. I'm going to use the Hex Feed MCP, but if you guys want to use something else, feel free to do whatever you want.

But I'm going to show you all of this step-by-step, so all you have to do is just follow me along. So, obviously Fable 5 is back uh until July 7th and then after it's going to be kind of on a usage-based limit, so go ahead and explore this as much as possible. So, I'm inside my Claude code. If you don't have Claude code, just go ahead and install uh the Claude app desktop app, that's what I'm using, and then come to your Claude code brand new session.

Make sure you're at Fable 5 right there. It says included until July 7th. So, once you select that, I'm using uh the effort level at extra, so keep it between extra and max. Obviously, the more you go on the smarter side, the more it's going to use your tokens. So, kind of play around with different ones, but I think max extra is the one that works pretty well. So, in order to create these website that has these 3D scrolling effects, so like right here as you can see, I mean this is mind-blowing, right?

Like how it's able to do this. It's the accuracy is amazing. And by the way, this is just like a fiction fictitious watch brand. It just created from scratch. So, as you can see, this is basically scrolling through the different aspects of the video, the different frames. Therefore, it's very important for you to use a model that has a 4K image quality, right? And C-Dance 2.0 that we're going to use inside Higgsfield does that, right?

So, but but like I said, you can use Kling or some other model in there as well. That's completely up to you. But this scrolling effect that you're seeing here, this is technically a video that's separated in multiple frames and then also images as well. So, same thing with the portfolio website here, right? I uploaded my image and it's able to create all of this on its own. I didn't do anything else. I just gave it one prompt and was able to do that.

So, that's why if you're lazy like me, you want to be able to attach an MCP so that way it takes care of all of that itself. Of course, it's going to cost you a little bit of money, but, you know, that's kind of the the difference between kind of creating it with one-shot prompt or doing things multiple in a in multiple different tools. But I'm going to show you obviously through just creating this with one single prompt from Cloud Code.

So, the first thing we need to do is we need to add an MCP, our Higgsfield MCP, so that way we can use models like Kling or C-Dance 2.0 or VO 3.1. So, as you can see, I've already added it, but it's pretty simple to add. So, again, once you're in your Cloud Code, you're going to press this or click on this plus button. You're going to click on the connectors. You're going to head over to manage connectors and this is going to open up all of your connectors and MCPs.

So, the way to add this, you're going to click on the plus button and instead of if you click on browse connectors, it's going to show you all of the native ones that are here, but we're going to add a custom one. So, you're going to click on the plus button and click on add a custom connector. And here, you're going to name this, so you can just name it something like Higgs Field or whatever. And [clears throat] then for the remote MCP server URL, you're going to get this from the following link.

Go ahead, I'm going to put this link in the description. You can click on this, it's going to bring you right here. So, this is basically a way to connect Higgs Field uh to your Clood code. So, make sure you are in the MCP uh tab here, and then you're also clicking on the Clood. Obviously, if you click on the link in the description, it's going to bring you directly here, so you should be fine. So, after you do that, you're just going to come to the bottom right here, right?

It says, "Copy the Higgs Field URL." You're going to click on copy. This is going to copy it. And make sure you're logged in. Obviously, you have to create a Higgs Field account, cuz otherwise, you won't be authenticate. So, once you create your Higgs Field account, and since it's going to be using like these models, it you have to put a a couple of dollars in there. Once you do that, then afterwards, we're going to go back to our Clood code here and just paste this.

And then click on add. Obviously, it's not going to let me add because it says a server with this URL already exists, but at this point, you're going to be redirected to your Higgs Field to authenticate to make sure that you're allowing Clood to have access to uh your Higgs Higgs Field there. And once you do that, once you give it confirmation and give it access, it's going to look something like this. Higgs Field is going to show up here, and all of this is going to be uh gen or uh enabled for you.

So, right here, it says disconnect because I've already dis uh connected it. So, in order to confirm this, before you do anything, you're going to make sure you come back to the plus button, click on connectors, and make sure your Higgs Field is toggled on. You see right here, it's toggled on. Because we're going to be referencing this uh inside our Clood code, so we want to make sure that we're uh creating that or that that connection is already established, right?

So, once you do that, now you're ready to go, right? So, as far as uh the website that you're planning to build. So, you can actually go to a website like awards.com and see actually award-winning websites. And once you find something that you like, again, this depends on what you're trying to build. So, let's say you're building some kind of a portfolio website, you're building some kind of a product website, right?

Or something completely original out of your imagination, you can actually get some inspiration from here. So, let's say you want to build some kind of a I don't know what this is. Let's just click on it. Serotonin, right? I don't know what this is, but let's just check it. Click on visit site. This is going to bring you to this actual website. So, serotonin.com. I guess this is some kind of a fashion company or something.

There you go, where glam meets grunge, okay? Yeah, yeah. So, so it's like an e-commerce website, right? So, same thing like if you're creating an e-commerce website, you can just copy this and then you can take it to Claude code and say, "Hey, create something similar to this website." So, that's kind of one way to kind of clone a website, right? So, you can just give it a reference. So, this is a good site to check out um um for a or you can just Google, you know, award-winning site.

That also works as well. But anyway, so let's go ahead and create something original of our own. I'm not going to copy any of these award-winning websites or whatever. Cuz this was something that you see this is localhost. I actually created this directly inside my Claude. So, if I open this up, you can see right here, this is this one called Aurum and Nor Eclipse website, right? So, I just gave it this one prompt and I said, "Build me a one-page cinematic 3D scroll website for Aurum and Nor, a fictional Swiss luxury watch brand." And I said to use the Hexfield MCP to generate all of the dif- the different images and videos.

And as you can see right here, it went ahead and created it and it says it's live on localhost 4888, right? So, that's exactly how simple it is. And again, we're going to work on this step by step. So, let's go ahead and open a new Claude code again. So, make sure again your Hexfield is connected, right? Hexfield is connected. So, now I'm going to go ahead and grab a prompt from this prompt pack that you guys have access to.

So, let me go ahead and paste this big prompt. So, I'm just going to build something completely new. So, I said, "Build me an award-winning cinematic 3D scroll website for Abyssal, a fictional deep-sea expedition company that takes civilians eight civilians per year to the ocean floor aboard a submarine called the Erebus, right? Something completely fictional and uh from the imagination. And by the way, uh so let me go ahead and actually enter this and then we're going to talk about the rest.

And right here, as you can see, I said visuals generate everything with C dance 2.0 model on the Higgs field MCP, right? And I'm giving it all of the instructions here. So, I'm going to go ahead and enter. So, now it's going to make realize that the Higgs field MCP is attached and it's going to go ahead and build this thing out. So, as you see right here, visuals is described the surface. I'm giving it the sunlight zone.

So, all of these different uh instructions or giving I'm giving this to Fable 5 to make sure that it follows everything along. But like I said, all of this instruction is inside the prompt back. So, you guys can just based on whatever uh niche you're selecting, you can just copy this prompt and make some changes to it. And as you can see, right now it's starting to build everything. Says it's FFmpeg is ready. Says in the bottom there you go, use Higgs field to check balance, cinematic hero shots.

So, now it's generating image and everything else. So, let's just go ahead and give this a couple of minutes. Now, a quick reminder on Fable, just like I mentioned in the beginning, this is only available till July 7th on your plans on your cloud plans. So, go ahead and take advantage of that because after that it's going to get pretty expensive and move to usage. I've been building non-stop. So, I recently built my personal assistant and my second brain I updated with cloud Fable 5 and it's absolutely incredible.

Let me show you guys a quick demo here. Hey Jarvis, how you doing? >> Working on it, sir. Operational and quietly magnificent, sir. Yourself? >> Good, thanks. Uh by the way, so a new model came out. I'm about to switch your brain. What do you think? >> Arrival brain, sir? I shall try not to take it personally as you rummage for my replacement. >> No, as a matter of fact, right now you're using Opus 4.8 for your brain.

Go ahead and switch to Fable 5. >> One moment, sir. Good evening, sir. The new brain is installed, calibrated, and already mildly concerned about your calendar. >> [laughter] >> So, there you go. This is obviously my second brain, my operating system, and I recently added Jarvis with it, and I upgraded it with Fable 5, and it's been non-stop fun. If you're interested in checking this out, if you want your own operation system, or if you want your own personal assistant like Jarvis, check out the community link is going to be in the description where you can create your own.

I'll show you exactly what to do step by step. But anyways, let's go back to our build here. Okay, so looks like it got done. All right, so it says Abyssal is live at localhost:4890. So, let's go ahead and open this up. All right, cool. How deep will you go? So, that's the There you go, Abyssal. It's that uh based on So, I'm just crawling right now, right? Look at this. Oh, wow, that is cool. That is nice. So, like we mentioned, this underwater vehicle, right?

So, very nice. At 200 m, 99% of sunlight is gone. Nice. And on the right-hand side, I like that it has this little uh kind of scroll animation there as I scroll down. Nice. The jellyfish is a very nice touch right there. At 1,000 m, pressure is 100 times the surface. Okay, cool. Oh, nice. Look at this, the light turns on. >> So, these are different frames, obviously, but it's all the same uh video that's generated by our SeaDance through MCP to our Hicksfield MCP.

So, Aribus, that was the name of the vehicle, right? Based on the prompt. No sun has ever reached this water. Life makes its own light. Nice. Look at this beautiful. Oh, and it does showcase the different animals that uh have their own light, right? Because it says the sun doesn't reach here, but very cool. Fewer people have stood here than have walked on the moon. Very nice. That is really cool. So, you can see how incredible this is.

Aribas two pilot, and it gives you like a product demo, 96-hour life support. Um 4,000-m depth rating. Souls on board eight, because we said that the product should have or this vehicle should have eight people capacity, right? And it says eight seats, $250,000, departing March 2027. That's quite a bit of a uh expensive ticket, but anyway, so you can see how amazing this thing is uh as far as developing these 3D scrolling websites, right?

Through animation. And like I said, the reason why it's doing this is because it's capable of understanding um that it has access to a video generation model like C Dance 2.0 and image models like Nano Banana Pro or GP2 to image, right? All of that is inside our MCP, and therefore Fable 5 is able to generate the knowledge, is able to generate the expertise, and then it it reaches out to Higgs Field to generate those clips, and then kind of renders everything together, and puts it on uh cinematic website, right?

This And as you can see, it says localhost 4890. So, now you can imagine this is something that could be uh on a custom domain, right? So, if you're uh creating a portfolio website for instance like this one, you can certainly put this and have Claude Fable say, "Hey, go ahead and now post this or uh publish this into a particular custom domain." So, this is something that you can either do it for yourself, and like I mentioned, if you are an AI agency owner or somebody who's offering this as a service, this is an incredible opportunity for you to take advantage of this and sell these as services, right?

So, I mean, portfolio website is something that everybody needs, right? And now you can just upload one image of yourself. So, if I go to my Claude's, let me show you. So, this one's the cinematic website that I created. So, I said, "Build me an award-winning cinematic 3D scroll personal portfolio website for me." I put my name, studied the style of award site of the year, right? So, I give it a couple of references.

Huge bold typography cinematic scroll visuals. I said, "Generate everything with C Dance 2.0 model on the Higgs Field MCP." And then, you know, basically similar to what we mentioned in the other one as well. And then went ahead again, same thing, used Higgs Field to generate my images. All I did was just upload an image of myself and then it went ahead and created all of the videos and images that you're seeing right here, right?

And again, all of this is AI made. I didn't do anything manually. It was just one prompt and it was able to generate all of this. So, like I mentioned, go ahead and play around with the prompt back here, right? Take a look at this if you want to create your own portfolio personal portfolio website, you can just copy this. Oops, I didn't zoom in too much. You can just basically copy the portfolio one right here. There you go, it's right here, right?

So, all right, it was "Build me an award-winning cinematic 3D website." And this All you have to do is just replace this with your name, right? And it will create something similar to that. And obviously, you can always go back and forth with Claude and ask Fable to change something if you don't like anything. It's really good at editing an existing website or whatever it builds for you. So, if you're building anything related to like a product or something like this for fun, right?

You can certainly just kind of go back and forth and change everything. Anyways, well, hopefully you guys found it helpful. Again, if you any questions, put them in the comments below. I'll try to get back to you guys. If not, again, you have access to the prompts. And if you're interested in learning how to monetize these or if you're new to Claude and Claude code, check out the community. Link is going to be in the description.

Again, hopefully I'll see you guys there. If not, thanks for watching and I'll see you on the next one.