Claude Code + Seedance 2.0 = $10K Websites (Kling + Sora Are Dead)
A full-pipeline tutorial: generate AI product videos with Seedance 2.0, build a luxury watch site in Claude Code, and deploy it live -- no coding required.
Posted
1 months ago
Duration
Format
Tutorial
educational
Views
12.8K
496 likes
Big Idea
The argument in one line.
Seedance 2.0 is the first AI video model that accurately follows motion prompts at production quality, and pairing it with Claude Code collapses a full agency workflow into a single afternoon for anyone -- no code, no design background required.
Who This Is For
Read if. Skip if.
READ IF YOU ARE…
You sell physical products and want cinematic motion graphics without a production budget or freelancer.
You have been curious about Claude Code but the word 'code' has kept you from trying it.
You are evaluating AI video generators (Sora, Kling, Veo 3, Seedance) and want a concrete side-by-side before subscribing.
You want a complete pipeline from AI-generated asset to live deployed website demonstrated in a single sitting.
SKIP IF…
You already have a production site and just need copywriting or SEO improvements.
You want a deep dive on Higgsfield advanced controls -- this is a beginner-to-intermediate overview.
TL;DR
The full version, fast.
Seedance 2.0 outperforms every competing AI video model on prompt accuracy and motion quality -- proven by a four-way comparison (Sora, Veo 3.1, Kling, Seedance) on the same input. The tutorial then covers the full build: generate a looping luxury product video in Higgsfield, scaffold a website in Claude Code using a free CLAUDE.md blueprint, upload a Dribbble screenshot as a design reference, refine with two targeted prompts, push to GitHub, and deploy live on Vercel in under two minutes. The entire workflow requires zero coding knowledge.
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.
Pattern interrupt -- showcase of watch explosion videos, car spins, and the New Spice AI ad. States the core promise: beautiful sites in ten minutes.
00:49 – 03:04
02 · Four-way model comparison
Sora vs Veo 3.1 vs Kling vs Seedance 2.0 on the same car-spinning prompt. Seedance wins on prompt adherence, smoothness, and no artifacts.
03:04 – 06:23
03 · Generating the product video in Higgsfield
Walks through Higgsfield UI, uses Claude to write the prompt, generates watch explosion video two ways -- text-only and with a Gemini reference image.
06:23 – 08:43
04 · Claude Code crash course and project setup
Downloads Cursor or VS Code, installs Claude Code extension, creates the project folder, explains and installs the CLAUDE.md blueprint and front-end design plugin.
08:43 – 12:55
05 · Building and refining the watch website
First prompt builds the video-background site. Dribbble screenshot used as design reference. Two refinement prompts fix text overlay and add gradient transition.
12:55 – 15:34
06 · Deploying live via GitHub and Vercel
Push all files to a private GitHub repo via Claude Code, connect to Vercel, deploy the site live. Custom domain options covered.
Atomic Insights
Lines worth screenshotting.
Seedance 2.0 is the only AI video model tested that correctly completes a 360-degree rotation without shaking, pixelation, or stopping mid-prompt.
Sora produces what amounts to an animated photo -- slight movement over a still image, not real motion generation.
Kling introduces aggressive shaking artifacts that make it unusable for product shots regardless of visual quality.
Using Claude to write your Higgsfield prompt produces more structured, detailed results than typing directly into the UI.
The CLAUDE.md file in a Claude Code project functions like an employee SOP -- it determines the quality ceiling of everything Claude builds in that session.
Uploading a Dribbble screenshot and saying 'design the rest of the site around this' is a faster design brief than any written description.
A white-to-transparent gradient overlay between the hero and body sections removes the single most common tell on AI-built websites -- the harsh background color seam.
GitHub is just Google Drive for code -- Claude Code handles all the push commands; you never need to touch a terminal.
Vercel deploys a video-background static site in under two minutes for free -- the only remaining cost is the optional custom domain.
A 15-second Higgsfield clip is long enough for a looping hero background; plan the motion to be cyclable, not narrative.
Generating a reference image in Gemini first gives more control over product appearance, but a text-only prompt can match it in quality.
Every AI video tool comparison should use prompt adherence -- not visual prettiness -- as the primary scoring dimension.
Takeaway
Seedance 2.0 changes what a solo builder can ship.
WHAT TO LEARN
The real unlock is not the AI video model -- it is the full pipeline from generated asset to live, polished website that previously required a team.
02Four-way model comparison
Sora renders what looks like an animated photo -- no actual motion, just a still with slight movement baked in.
Veo 3.1 produces decent output but fails the prompt: it does not complete a full 360-degree rotation and pixelates at zoom.
Kling introduces aggressive shaking artifacts that make it unusable for polished product shots.
Seedance 2.0 completes the full prompt accurately -- smooth 360-degree rotation, no pixelation, no shaking -- so prompt adherence is the deciding metric, not visual prettiness alone.
03Generating assets in Higgsfield
Use Claude to write your Higgsfield prompt rather than typing freehand -- it consistently produces more detailed, structured prompts.
Generating a reference image first in Gemini and feeding it into Higgsfield gives more control over product appearance; text-only prompts can match it in quality.
Higgsfield clips max out at 15 seconds -- plan motion to be cyclable rather than narrative for hero backgrounds.
04Claude Code setup and site build
The CLAUDE.md file acts as a standing operating procedure that shapes every Claude response; without it, output is generic.
Uploading a Dribbble screenshot and saying 'design the rest of the site around this' is faster than any written design brief.
A white-to-transparent gradient overlay between hero and body removes the most common tell on AI-built sites -- the harsh color seam.
05Deploying live via GitHub and Vercel
GitHub is just file sync for code -- Claude Code handles all push commands; no terminal knowledge required.
Vercel deploys a video-background static site in under two minutes for free; only a custom domain costs extra.
Glossary
Terms worth knowing.
Higgsfield
A web platform that provides access to Seedance 2.0 and other AI video generation models, starting at $15 per month.
Seedance 2.0
An AI video generation model accessible via Higgsfield that converts text prompts and reference images into smooth motion video clips.
CLAUDE.md
A plain-text instruction file placed at the root of a Claude Code project that tells Claude how to behave -- equivalent to a standard operating procedure given to a new employee.
Above the fold
The portion of a webpage visible immediately on load without scrolling -- the highest-attention real estate on any site.
Local host
A development server running on your own computer that previews a website in a browser without making it accessible on the public internet.
Veo 3.1
Google DeepMind's AI video generation model, a competitor to Sora and Seedance.
Kling
Kuaishou's AI video generation model, a competitor in the same market as Sora and Seedance 2.0.
“These websites put BMW, Notion, and SpaceX to shame.”
Immediate credibility claim with recognizable brand names -- tight, no setup needed.→ TikTok hook↗ Tweet quote
06:28
“You do not need to know a single line of code whatsoever to build this out.”
Addresses the primary objection for the target audience directly.→ IG reel cold open↗ Tweet quote
07:37
“The CLAUDE.md is an instruction manual on how Claude Code should behave -- just like when you hire an employee and give them standard operating procedures.”
Clean analogy that makes a technical concept immediately legible.→ 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
00:00So I am losing my freaking mind over here because I've built out some of the most beautiful websites I've ever seen in my entire life in literally, like, ten minutes using Seedence two point o and Cloud Code, and we're gonna be talking about how you can do the exact same thing in this particular video. But the interesting thing is is that these websites put BMW, Notion, and SpaceX to shame.
00:20Honestly, what you could build in ten minutes looks way freaking better than these multibillion dollar websites. And the competitor to Seedence two point o, which is Sora, they just went out of business two weeks ago, but even if they didn't, they would have been absolutely freaking killed by this new video AI model. A couple other use cases here, we can build beautiful graphics for ecommerce products.
00:40We can also have beautiful cover photos for our website. In this example, we got a watch that's exploding all the pieces out and then it's pausing for a second, and then all the parts are emerging back together to form the product again on an infinite loop.
00:53And we can also do the same thing with a car. Funny enough, this car was actually generated using AI, using Claude, and then I fed that into, um, into the Scenes two point o, and it built this beautiful graphic that's rotating 360 degrees in an infinite loop.
01:07Now look at this man. Now back at me. Now look at this man again.
01:10Now back at me. Now some of you might recognize this person as a legendary old spice man, and this person has been so influential on me that I've decided to give up my career on YouTube and go into a completely new direction where I'm gonna be selling deodorant through the new business, new Spice. No.
01:29ad video that I created using Senence two point o. You gotta check this out. Hello, gentlemen.
01:34Look at your woman. Now back to me. Sadly, she isn't me.
01:37But if she switched to Newspice for women, she could smell like she's me. Look down. Back up.
01:41Where are you? You're on a yacht with a woman your woman could smell like. Anything is possible.
01:44When your woman smells like Newspice and not a generic Tuesday.
01:47I'm on a dolphin. I'm on a dolphin and the music, impeccable timing. It just makes me smile.
01:52I've watched this, like, 30 times. Still cracks me up every single time. So we're gonna be building out absolutely beautiful websites in this video using CNNs two and Claude Code.
02:01Let's get into it. The first thing is is that there's four major players in the AI large language model market for generating videos. Let's compare all four of these together starting with the same prompt and the same input image.
02:16So all I did was I asked it to have the car spin in an infinite loop. And if you look at Sora here, it literally looks like an animated photo. If you look at v o 3.1, it looks good, but it doesn't actually accomplish the prompt request, which is spinning three sixty degrees.
02:33It kinda stops, and it also looks a bit pixelated when you zoom in here. I'm gonna mute the volume there because it's a bit aggressive. And then we got cling over here.
02:41Okay? And cling reminds me of somebody that just took, like, 17 shots of espresso and then jumped in to take this video. Like, it's just shaking like crazy right now.
02:50I don't know if you can see that, but it's quite aggressive. And then we got sedans over here, which did a perfect job. It rotated three sixty degrees, and it looks flawless.
02:59In order to get started here, we're gonna head over to the site Higgs Field on Google and create an account. Now their pricing starts at $15.
03:07Obviously, the higher up you go, the more usage you get, and you do get access to sedans on all of these plans. And once inside Higgs Field, we'll head over to the video part and then choose Sedence two point o.
03:20Now, there's a couple different settings here. We can add in images as reference points if we want to create certain designs like a car, for example, and we can also add in a prompt over here. We can choose how long we want the video to be, so it can be a maximum of fifteen seconds.
03:37You can also choose the quality as well. Cool. So what we're gonna do is we are going to mirror this website right over here.
03:46I really like the design, so we're gonna create a website selling watches with a similar graphic. Now in order to do this, instead of just yellowing the prompt here, I'm actually gonna go over to Claude, and I'm gonna ask it to create a mega prompt for me to feed into Higgs field.
04:02Can you please create a prompt for me to pass into Higgs field to create a nice AI video? The video is going to be a beautiful, luxurious $10,000 watch on a white background.
04:15The watch is going to explode into a bunch of different pieces, then stop for a second or two, and then merge all the pieces back into the watch. Cool.
04:26So the prompt is done, and we can copy this back in and literally just send it like that. I'm gonna change this to ten seconds here, and then we're gonna generate the video. So that's one option about going about this, but there's another option as well where we can generate first a reference image.
04:44So if we head over to gemini.google.com, we're gonna use Nano Banana to build us a beautiful image of a watch. Can you please create a beautiful watch for me on a white background?
04:55I want the watch to look like it's a luxurious $10,000 item, and it needs to be vertical. So we've got the prompts.
05:03Let's go ahead, copy that, come back into Higgs field here, and replace this one. The reason I'm creating a brand new prompt is because I don't want to tell Higgs field what the watch should look like. I just want the motion effects of it exploding and then coming back together again.
05:17We're gonna generate this again. Alright. So both graphics have been officially created.
05:22Let's go ahead and watch these. And that was a pun, not intended even though that came across as a dad joke, but, uh, that is also my type of humor. Okay.
05:30Wow. This first one looks absolutely freaking insane. And keep in mind, this is coming from a text prompt.
05:35We didn't add in a photo here. This is just a text prompt creating that. That absolutely blows me away.
05:42Imagine hiring a graphic designer and telling them to create something like that. First of all, don't even think they could, but if they were able to, it would cost you an arm and a leg. Like, you'd literally have to give them maybe your entire body.
05:53I don't know. And then the next graphic was created using that reference image. So let's watch this.
05:59Okay. That's sick as well. It just completely exploded there.
06:04Nice. Comes back together. Looks nice and clean on an infinite loop.
06:09Okay. Really, really cool. Honestly, that's that's quite hard to choose which one I like more, but I'm just gonna go with this first one, uh, because I think I like it like a smidge smidge better.
06:19So we're gonna download this, and we're gonna head over to the second part of the video where we're gonna build out a beautiful website using these graphics. And how we do that is using Claude Code.
06:29Now if you're brand new to Claude Code, the word code in Claude Code typically scares a lot of people off. You do not need to know a single line of code whatsoever to build this out. I'm gonna give you a ten second crash course on how this actually works.
06:43You need to download one of two applications, either anti gravity or Versus code, not both, just one. And both of them by the way are free.
06:51Okay? And this is a coding environment. Again, you don't need to know a single line of But Claude Code lives as an extension in here.
06:58So if you head over to the extension panel here, you can search Claude Code for Versus Code. It's the same name in both apps. You download this, you activate your account, and you're good to go.
07:07You're gonna be able to follow along. We need to create a project here, and every project you create in Claude code needs to start from within a folder. Okay?
07:16So we're gonna open up a folder on our computer, and I'm just going to call this Higgs field demo.
07:25Okay? Create that folder. It's completely empty.
07:27We're gonna load into our project, and we have to create one file, which is called the claud dot m d. All you need to know about this file here is it's an instruction manual on Claude code should behave, just like when you hire an employee and you give them standard operating procedures and training on how they should do the role.
07:44It's the same kind of stuff. Now the blueprints are gonna be down below for free in this video for you to grab. All you have to do is head over to my free school community, links down below.
07:52Go over to this video right here, and grab this file. K? You can copy it in, paste it in here, and that is all we need to be able to build out this entire website.
08:04Of course, we need the video as well, so I'm going to paste that in. So I have this file right here. I'm gonna drop it in the Claude code project, and then we can go ahead and send our first message to Claude right over here.
08:18Now, actually, before we do that, I'm gonna type in here slash plugins. We can click manage plugins, and I would definitely recommend downloading this front end design plugin.
08:29All this does, you just have to, like, install install it. It. It helps you build beautiful websites, um, very easily.
08:36So I'd recommend installing that. You may need to restart Claude code, and then it should work properly. And I'm just gonna send off our first message.
08:44Can you please build out a beautiful website for me? This is for my watch company where we sell watches online, and I dropped in here an m p four file.
08:53I want that to be a background video playing as that a user sees as soon as they land on the website. So the page is up, and we can view it at this link right over here. Just so you guys know, if you're brand new to Cloud Code, a local host environment is a development server.
09:09It's technically not accessible on the web for anyone to view it. It's just your computer rendering these static sites in a browser. So let's go ahead and take a look at this site here.
09:19It, uh, it looks really, really beautiful right away. I love this effect down here. Watch looks awesome.
09:24The text overlay, I don't really like. It's kinda like, uh, overlaying graphic, which is not good.
09:30And then the rest of the page could use some work for sure. Now speaking of the rest of the page, a quick little tip here is that we can head over to a website like Dribbble, and we can type in, uh, like, watch ecommerce website just to grab inspiration from other designers that have created something similar to what we wanna build.
09:48And so we can just find something that we like, and, uh, I'm gonna choose maybe, yeah, maybe something like this one right here.
09:58I'm going to save this image as a file on my computer, and then I'm going to head back to our site in Cloud Code.
10:09And we can just literally upload a image here by hitting the plus button, upload from our computer. I'm gonna grab that file.
10:17I'm gonna say, design the rest of the site around this graphic below the fold.
10:27I'm gonna send that off. When I say below the fold, that's just marketing terms for anything that you see immediately when you land on the page is above the fold, and anything below that is below the fold. The page has been redesigned.
10:39Let's take a look at the results. So we can see some reviews being added down here, and immediately, this looks probably 10 times better than what it did a couple seconds ago.
10:50And so even if we just compare this to that that, uh, image that we used as inspiration, it looks very, very similar, especially this part here and then this section right over here.
11:01So, yeah, looks fantastic. There's just two things that I want to change. Number one is I want the text to not overlap on the graphic here, and I wanna have a nice gradient so that this white actually just blends into the graphic here.
11:18It doesn't feel like such a sharp contrast. So let's go back to Claude and send off a message. Can we please create two changes on the site?
11:27Change number one is that I want the text overlay on top of the hero section to not overlap on the watch icon in the background. So we need it to go further to the left, and also, I don't like how harsh the white background is between the hero section and the white background.
11:46We have a gradient that overlaps both sections where it goes white to transparent, so that it feels very smooth rather than jagged.
11:57Cool. So it's all set. Let's take a look at the changes here.
11:59The first one, which is really cool, is this gradient here. And so this is what I was talking about where it doesn't feel like it's so harsh between the two. It goes instead of going from white directly to this gray, there's a gradient that kinda smooths it out.
12:13And, obviously, you can play around with this to get it to the exact width and height that you want. And the second change that we made is that this text is now oops. I'm trying to draw a straight line here, but I'm incapable of doing it on my computer.
12:24This is supposed to be perpendicular to the navigation bar up here, so we made that change. And it also made the, uh, the the h one or the heading smaller so it doesn't overlay on top of the graphic, of course, unless it explodes out.
12:40So, yeah, that looks great to me. I'm really happy with this site. The last thing that we have to do is we have to take this site and deploy it live so that anyone can access it, we can sell our goods and services.
12:51And how we're gonna do that is a two part approach. The first is we have to upload the code to a platform called GitHub. You can kinda think about this like Google Drive.
13:01Drive. You just upload all of your code from, uh, Cloud Code into GitHub.
13:08Okay? And then once it's here, then we're gonna use the code in GitHub to deploy it live through an application called. So how we're gonna do this is logging in to GitHub.
13:18If you haven't done so already, create account. We're gonna go to repositories, create a new one.
13:23I'm gonna title this watch. I'd highly recommend making sure this is private so other people can't access your GitHub repo here. And all we need to do is copy this code here.
13:34K? So I'm gonna copy this, head back into GitHub, and I'm going to say, please upload this entire project into GitHub for me.
13:47And I'm gonna paste that exact code here. And now it's going to take all of these files that we've just created for this project, and it's going to upload it right into GitHub.
13:59Cool. So it's pushed all 13 files over here. Let's refresh the page here.
14:05Everything's good to go. Our files have been copied from Cloud Code into GitHub.
14:12The next part is to head over to Versal, create an account if you haven't done so already, and we're gonna create a new project here. And you need to link GitHub and Vercel together so that you have access to that repository right here.
14:25It should load in by default once you connect them, and we're import this in. The only thing that we need to do is just make sure that the application selected is Next. Js, and then we're gonna go ahead and deploy this.
14:36Sweet. And so our website has been officially deployed, and we can continue to the dashboard and then take a look right over here by clicking on the domain.
14:45Awesome. So that's it. Now anyone can view this website.
14:48And if you guys wanna, of course, buy domain inside of Versal, you can head over to the domain section right over here and then purchase something here, or you could go ahead and load in a domain from an external website like GoDaddy or like Namecheap, for example. So that's it for this video, guys.
15:03Um, all of the resources are gonna be down below for free in my free school community. Highly recommend grabbing those. And also my pay community, there's tons of private courses in here going in-depth into Cloud Code, as well as two transformations.
15:17The first is how you can find, close, and fulfill your first AI automation client within thirty days or less, then rinse and repeat until you have an agency. And then the second transformation is for those of you who have existing businesses. I give you the exact blueprints that I use to scale to 7 figures and automate my whole business.
15:32All you have to do is copy paste and deploy them into your business. Um, and if you don't wanna have to do that, you can take a look at my agency where we can jump on a free thirty minute call and show you exactly how you can automate your business. Thanks, guys, for watching, and I'll see you in the next one.
The Hook
The bait, then the rug-pull.
Ten minutes. A luxury watch website that looks like it cost $10,000. No designer, no developer, no agency -- just Seedance 2.0 generating the hero video and Claude Code assembling the site around it. The title is not hype: Kling and Sora get a fair fight here, and they both lose.
Frameworks
Named ideas worth stealing.
00:49list
Four-model AI video comparison
Sora -- animated photo, no real motion
Veo 3.1 -- decent but prompt-incomplete and pixelated
Side-by-side benchmark of four leading AI video generators on the same input, scored by prompt adherence and visual quality.
Steal forany tutorial that needs to establish tool credibility before a recommendation
03:44model
Two-path asset generation in Higgsfield
Path A: text prompt only -- faster, surprisingly strong results
Path B: reference image (Gemini) + motion prompt -- more product appearance control
Either approach works in Higgsfield; the reference image path gives more control over product appearance while the text-only path is simpler.
Steal forproduct video workflows for any physical product
CTA Breakdown
How they asked for the click.
VERBAL ASK
14:48product
“All of the resources are gonna be down below for free in my free school community. And also my pay community -- there's tons of private courses going in-depth into Claude Code.”
Dual CTA: free blueprint in community (low-barrier entry) and paid community (monetization). Shows the paid community dashboard on screen. Effective sequencing: free value first, paid upsell second.