# Claude + 3D animations: build $10,000 AI websites in 15 mins

**Video.** [Claude + 3D Animations: Build $10,000 AI Websites in 15 mins](https://www.youtube.com/watch?v=9RiV-_MUiCI) · id `9RiV-_MUiCI` · 15:47 · reviewed 02-08-2026 · author Viktor Oddy

**Note.** Despite the title, the builder in this video is **bolt.new**, not Claude: his Fable 5 access had been pulled, and bolt's "max" model here runs Opus 4.8.

## The process he shows

1. **Pinterest.** Find a creature or subject looking at the camera (or ask AI to turn a side view into a front portrait).
2. **Two end frames.** In the image chat, from the portrait: "make the creature look to the right side", then one looking left.
3. **Seedance 2.0 with start frame + end frame.** Prompt: "the creature slowly and smoothly turns his head from left to right, steady neutral pace; body stays mostly still; keep the same expression." The result plays as if the page tracked the visitor's mouse — a 3D feel with no WebGL, no Blender.
4. **Builder: bolt.new** (model "max"). He starts from a full recreation prompt kept on motionsites.ai, then strips that prompt's video and keeps a pure black background.
5. **Video in.** Paste the hosted head-turn video: "add behind all content, no overlay, 100% opacity."
6. **Swap the UI by prompt.** He pastes only the UI part of a different motionsites prompt ("neural interface") to replace the navbar and hero content wholesale.
7. **Text effect from a screenshot.** A Dribbble text animation, screenshotted: "add this kind of text effect above the hero."
8. **Second section.** Animate a minimal background image (Seedance, "just animate this", 8-10 seconds), set it as the section background, no overlay.
9. **Seamless seam.** Sample the hero's color in Figma, then: "from the top of section 2, a gradient from this color at 100% opacity to 0" — the sections melt together.
10. **Scroll text.** A "cinematic parallax animated text block" prompt from his library gives the text animation over the video.
11. **Rest of the page in one prompt.** Three to four minimal black sections, same text style, little content each.
12. **Subject continuity.** Character image + background image → ChatGPT: "show this character from the back, on this background" → animate → the third section's video. One actor across the whole page.
13. **Fix cramped layout.** Pin content to the edges of the section instead of one center column.
14. **His argument for AI builders over Framer and Webflow.** They carry a database and auth, so the site can grow into an app.

## What is genuinely new for us

- **The head-turn hero.** Two still end frames plus start/end-frame conditioning in Seedance make a subject that seems to follow the visitor. Our doctrine already says 3D = video, not WebGL; this is the concrete recipe that turns a single still into an interactive-feeling hero.
- **Subject continuity by compositing.** The same creature seen from the back on the next scene keeps one actor across sections. It extends our "one style reference per page" rule from style to subject.

## What we skip and why

- **bolt.new and the database/auth pitch** — we build in Claude Code; not our stack.
- **The color-matched gradient seam** — our doctrine already holds the bottom gradient fade into the page background.
- **Reusing motionsites.ai prompts** — his product; our contracts are our own recreation prompts.
- **"$10,000 in 15 minutes"** — sales.

## Fold-in candidates

1. **Head-turn hero** (portrait → left-look and right-look stills → Seedance start/end-frame video; body still, head turns) → `9 - System/ui-ux/motion/motion-design.md` §3 technique shelf, beside frame-sequence scrub.
2. **Subject continuity** (keep one character across sections by compositing new views, e.g. the back view on the next background) → `9 - System/ui-ux/motion/motion-design.md` §6 taste rules, next to unity of style.

## Deserves a full reference page with frames: yes

The head-turn trick is pure frames: the left-look still, the right-look still, the resulting motion on the page. Three frames teach it; text alone undersells the effect.