Sonnet 5.5 Just Changed Design Forever (free prompts)
Viktor Oddy · 2026-09-29 · tutorial · 13,719 views
What's in the video
Description written by Gemini, which watched and listened to the whole video.
Summary
Web designer and entrepreneur Viktor Oddy presents a tutorial exploring how to design and code interactive, animated websites using Anthropic’s Claude (specifically Claude Sonnet 5.5 and Opus 5.5). He details a four-part workflow ranging from zero-shot prompting to copying CSS via browser extensions, repurposing visual animations via image/video prompting, and recreating complex 3D interactive layouts from direct URLs.
What is shown
- Showcase of AI-built websites [00:00–00:43]: Demonstrates interactive sites created with Claude, including the "Munforge" golden apple site with dynamic text and hand animations, and a North Face concept store with interactive sliders and checkout flow.
- Method 1: Plain Prompting [01:13–01:49]: Creates a minimal four-section AI agency landing page ("Plainly") from scratch in Claude using Sonnet 5.5 with medium effort settings.
- Method 2: Component Scraping & Vibe-Coding [02:08–03:40]: Uses Landbook to find website inspiration and the Chrome extension Get Design to copy CSS/HTML styling from Agiloft, feeding the snippets into Claude to re-skin the "Plainly" prototype into a dark theme with updated typography.
- Method 3: Video Reference & Asset Editing [03:49–09:35]: Grabs a 3D interface animation from Pinterest, uses Figma’s AI prompt editor (powered by GPT Image 2.5 Sunburst) to remove typography and isolate 3D backgrounds, screen-records the motion clip, and prompts Claude to generate scroll-tied 3D animations referencing Seedance 2.5.
- Method 4: Direct URL Recreation [09:53–11:53]: Feeds a live URL (
drone.riotters.com) into Claude Opus 5.5 with max effort to clone a multi-section 3D interactive drone scanning landing page, demonstrating interactive model rotation, scrolling triggers, and mobile responsiveness. - Deployment & Client Acquisition [11:56–13:05]: Demonstrates free hosting on Vercel and explains how to share designs and get client inquiries on X/Twitter and Instagram.
Claims & numbers
- The presenter claims he built the interactive "Munforge" site in five minutes using Claude Sonnet 5.5 [00:06].
- The presenter claims to have 10–12 years of professional web design experience and 3 years designing with AI [00:44].
- The presenter claims that even on the cheapest Claude tier, Sonnet 5.5 usage limits are generous enough to feel virtually unlimited for building websites [00:15].
- During an Opus 5.5 run, the presenter’s Claude usage interface shows 21% of his 5-hour limit and 30% of his weekly limit used [11:21].
- The presenter claims Seedance 2.5 generation on Higgsfield is relatively expensive based on his experience [08:31].
Notable quotes
- [00:00] "Sonnet 5.5 just came out and I do think this is the best thing that happened to web designers."
- [06:33] "If you are new to this design thing, do not ever open Figma. It's not the future, there is nothing about Figma that will work in the future."
- [12:08] "Again, the best way to get money for your service, to get clients, to get money, to get customers is from Twitter."
Assessment
This is an independent workflow tutorial and promotional demo for the creator’s prompt repository (motionsites.ai) and browser extension (Get Design). The video captures real screen recordings of Claude generating functional HTML/CSS/JS applications, though the waiting intervals during code and video generation are cut for time.
Described by gemini-3.8-flash on 2026-09-29 from the video's audio and frames.