He builds websites in one evening and sells them for $2–5K. Without writing a single line of code

The web development market isn't dead — the old economics of web development are. A custom site with 3D animation and product video used to cost a client $10–30K and a month of agency work. Now the same result comes together in a single evening with a stack of three tools. And clients are still happy to pay thousands — because they pay for the result, not for your hours.

Below is the full workflow, step by step. No theory, just the pipeline.

What you'll need

→ Claude Code — Anthropic's agentic coding tool, runs from the terminal. It writes all the code, tests the site in a browser by itself, and deploys by itself → Firecrawl — a service that scrapes any website and extracts its entire branding: colors, fonts, logos, tone → Nano Banana Pro — Google's image generator, for catalog-quality product renders → An AI video model — anything that can generate a transition between two frames (Kling, Veo, Runway) → GitHub + Vercel — free one-step deployment

Not a single step requires knowing how to code. What it requires is knowing how to manage an agent.

Step 1. Extract the client's brand DNA with Firecrawl

Before generating anything, you need to understand what the client's brand looks like. Manually, that's an hour of digging through DevTools. With Firecrawl — one minute.

Open Firecrawl, go to the Scrape tab

Paste the client's URL (the example in the video is anyvan.com, a moving company)

Enable the Branding format (plus Markdown for the content)

Hit Run

The output is a structured JSON with the entire brand identity:

→ Colors: primary, accent, background, text, links (in the example: primary #438600, accent #893574) → Typography: body and heading fonts (Lato), h1/h2/body sizes → Logo, favicon, OG image → Spacing: base unit, border radius → Even the brand's "personality": tone (Professional), energy level

This JSON is the fuel for every step that follows. The new site will look like it was built by the client's in-house team — not by a freelancer working from a template.

Why this matters for the money: the client isn't paying for "a nice website." They're paying for "a website that looks like US, but better." Nailing the branding on the first draft is what separates a $500 invoice from a $3,000 invoice.

Step 2. Open Claude Code and build a skill for asset generation

Skills in Claude Code are reusable capabilities: folders of instructions the agent loads on demand. Build one once — use it on every future client.

In the Claude Code terminal:

Then describe what you need in plain language:

In the video, the skill being created is scroll-stop-prompter — a prompt generator for 3D product renders designed for website hero sections. Claude Code then:

Creates the skill structure in ~/.claude/skills/ on its own

Proposes its own test cases (a laptop, a smoothie, different product types)

Runs "with-skill" and "baseline" tests in parallel

Shows you an eval report of what improved

This is the key point everyone misses: you're not building a website — you're building a website factory. Every skill shaves hours off the next project.

Step 3. Generate two images in Nano Banana Pro

The skill from Step 2 outputs ready-made prompts. For a striking scroll animation you need two frames of the same product:

→ Prompt A — Assembled shot: the product fully put together → Prompt B — Exploded shot: the same product taken apart

Here's the actual prompt from the video (tailored to the client's moving van):

Notice the level of detail: camera angle, background color as a hex code (pulled from the Firecrawl branding!), "Apple-style," a ban on text and logos. A prompt this precise gets written for you by the skill — that was the whole point of Step 2.

Drop both prompts into Nano Banana Pro and you get two catalog-quality images.

Step 4. Turn the two frames into a video transition

Now the two static images need to become a short video: the product smoothly "assembling" itself from parts.

Upload both frames into an AI video model (first frame → last frame)

Pick a duration (5–10 seconds is enough)

Generate the transition

The output is a WOW effect that on a normal project would mean commissioning a 3D studio for several thousand dollars. It took you 10 minutes.

Step 5. Bring the video back into Claude Code and build the site

Go back to Claude Code and ask it to build a site with a scroll-driven animation based on that video. The agent will ask for the file path itself — you can even just say "check my Desktop."

Then the autonomous magic starts. Claude Code, following its plan:

Initializes Next.js + Tailwind CSS, installs Framer Motion and Lucide React

Creates the structure, styles, and components

Wires the video into a scroll animation: the user scrolls — the product assembles on screen

Opens a browser by itself at localhost:3000, clicks through the UI, tests search and filters, takes screenshots, and reports back on how everything looks

You don't review the code. You review the result — like an art director, not a developer.

Step 6. Add pages and SEO with one prompt

A one-pager is a demo. Clients pay for a full website. Here's the prompt from the video, worth saving word for word:

One prompt covers: design consistency, SEO, schema markup, responsiveness, navigation, and a final audit. These are the things agencies charge for as separate line items on an invoice.

Step 7. Push it live

The finale takes minutes:

Claude Code pushes the project to GitHub

Connect the repo to Vercel

The site is live, on HTTPS, with auto-deploy on every change

The client gets a link. You get paid.

Now the main part: how to actually make money with this

The tech is half the game. The other half is packaging.

Who to sell to. Local small businesses with outdated websites: moving companies (like the example), cleaning services, dental clinics, auto shops, restaurants. They have money and pain — but not $15K for an agency.

How to pitch. Don't sell "a website." Run their current site through Firecrawl, spend one evening building a redesigned homepage with a 3D animation of their product — and send them the finished demo. An email that says "here's what your site could look like, link inside" converts incomparably better than "I offer web development services."

What to charge. Your cost is tool subscriptions plus one evening of time. The market rate for a site like this at an agency starts at $5K. Charge $1.5–3K to begin with: for the client it's a fraction of agency pricing, for you it's margins freelance developers never dreamed of.

How to scale. Every project grows your skill library in Claude Code. First site — an evening. Fifth — a couple of hours. At that point it's no longer freelancing, it's a product pipeline: one person, a dozen clients a month.

Bottom line

→ Firecrawl extracts the client's branding in a minute → Claude Code turns one-off prompts into reusable skills → Nano Banana Pro + AI video deliver 3D-studio-grade visuals → Claude Code builds, tests, and deploys the site on its own → You sell a result that used to cost $10K+ for one evening of work

The barrier to entry for building websites has collapsed. The barrier to entry for selling websites hasn't — yet. The window is open for whoever walks through it first.

Prompts

build a skill with the 3d asset generator prompt on the left

I have an existing website deployed on Vercel. I want to add
multiple new pages to it. Please:

1. Look at my current site and understand the existing design
   language (colors, fonts, layout patterns, component styles)
2. Ask me what pages I want to create — I'll tell you the page
   names and what each one should be about
3. For each page I request:
   - Match the existing design exactly so every page feels like
     the same site
   - Add full SEO optimization (unique title tag, meta
     description, Open Graph tags, canonical URL)
   - Include structured data / JSON-LD schema markup where
     appropriate
   - Make it fully responsive (mobile, tablet, desktop)
4. Update the navigation so the pages link to each other properly
5. After creating all pages, run a full SEO audit across every
   page and give me a report showing what's optimized and any
   remaining improvements

Start by analyzing my current site, then ask me what pages I'd
like to create.

Professional product photography of a modern white removal van
(Mercedes Sprinter or Ford Transit style) centered in frame, shot
from a 3/4 front angle. Clean white background (#FFFFFF), soft
studio lighting with subtle shadows beneath the vehicle. Rear doors
wide open revealing a perfectly packed interior — neatly stacked
cardboard moving boxes, a rolled-up rug, bubble-wrapped picture
frames, organized like a real-life game of Tetris. Photorealistic
rendering, 16:9 aspect ratio, product catalog quality. Minimal,
elegant, Apple-style product photography. No text, no logos, no
other objects in frame.

/skill-creator

Links

• anyvan.com