How I Build $5,000 3D Animated Websites with AI (Sonnet 5)

youtube.com/watch?v=IeR5ZMKssSc · id IeR5ZMKssSc · 18:54 · reviewed 02-08-2026

The process he shows

One-shot a base site. Paste a full motionsites.ai prompt ("pulse 3D") into Claude with Sonnet 5 — the whole 3D site in one message.
Reskin the image. Higgsfield with two inputs: a screenshot of the current background plus one Pinterest image. Prompt: "replace the flower in the first image with the second one." Framing and style survive; only the subject changes.
Reskin the motion. Seedance 2 with the original video plus the new image — it copies the original camera and movement onto the new subject. Match the seconds to the original (a 4 second reference stays 4 seconds). Pick 1080p for web, not 4K: it loads faster.
Reskin the words. "Replace all content — navbar, name, headline, buttons, cards — to be about an AI video editing agency. Keep the same number of characters as now." The layout never breaks.
From scratch when needed. Hero 100vh, pure black, minimal navbar, one giant uppercase headline that always fills the section width.
Fonts. Pick on Google Fonts, give Claude the name to import. His line: "design is about 50% about the fonts."
Headline animation prompt. The title splits into characters that fall down and fade one by one, left to right, with a slight squish — tied to scroll position, so scrolling back reverses it.
Scrub prompt, near verbatim. "A muted video element has its currentTime set each animation frame, so the video plays frame by frame and there is no lagging on any device."
Reveal prompt. "Fade in from a blurred, slightly scaled-down state to sharp and full size as they enter the viewport, staggered so each line animates in sequence."
Second section. A full-screen panel with a rounded top edge rises from the bottom, driven by scroll progress over the hero; behind it a scroll-scrubbed video; on the left a "text drum" — scroll-driven manifesto lines with keyword highlights, depth blur, opacity falloff.
When words fail, screenshot. For a hard effect he screenshots it and pastes the image: "it will recreate that exact thing."
Distribution. Same X advice as his other videos: record, post, tag the tool and him.

What is genuinely new for us

The reskin chain as a business method. One proven base site + image-pair swap + video-pair swap + same-character-count text swap = a "new" client site in minutes. We hold the Seedance video reskin (AI Studio reference); the chain of all three, plus duration-matching, is the news.
Same-character-count content swap. Rewriting every text to a new topic while keeping lengths — the cheapest way to change a page's subject without breaking its layout.
Character-fall headline. A giant title whose letters fall and fade with scroll, reversible — a named grammar move we do not hold.
Rising rounded-top panel. A full-screen panel sliding up over the hero on scroll progress — ditto.
Screenshot-the-effect prompting. Extends our design-as-image pattern from stills to animations: paste a picture of the moving thing you want.

What we skip and why

The scrub technique itself. currentTime per animation frame is already specified, with smoothing and frame cache, in the NovaAI prompt.
His prompt library. Our recreation-prompt discipline already produces the same contracts.
The X growth loop. Held in the award-winning-sites reference; not our channel.

Fold-in candidates

Reskin chain. Name the three-step recipe (image pair → video pair → same-length text) as the fast path from one built site to the next — home: `[local implementation path]
Same-character-count swap. One line: when changing a page's topic, keep every text the same length — home: `[local implementation path]
Character-fall headline and rising panel. Two additions to the technique shelf — home: 9 - System/ui-ux/motion/motion-design.md §3.
Screenshot-the-effect. When an animation is hard to describe, paste a screenshot of it — home: `[local implementation path] (animation step).

Deserves a full reference page with frames: no

The two heavy techniques (scroll-scrub, video reskin by reference) are already held with full specs in the NovaAI and AI Studio references. What is new here — the reskin chain, the text-length trick, two grammar moves — travels fine as text. This digest is the record.