Incredible 3D Websites With Opus 5.5: My Full Workflow

Summary
Meng To (founder of DesignCode) demonstrates how to generate rich, interactive 3D landing pages and WebGL scenes using Claude Opus 5.5 within Claude Code. He explains his end-to-end workflow, which integrates the Mobbin MCP server to feed real UI design references directly to the model, relies on high-effort autonomous agent runs, and uses Three.js procedural code and shaders to avoid low-quality "AI slop."

What is shown

• Three.js 3D Landing Page Showcase [00:00]: Meng showcases "Sunseto," a Japanese-themed solar landing page built with Claude Opus 5.5, featuring 3D animated solar panels, interactive drag-to-rotate elements, ambient lighting, floating cherry blossom petals, and shader-driven text transitions.
• Interactive 3D River & Ship Experiences [00:51]: Demonstrates his viral "Sakura River Valley" WebGL scene, featuring WASD boat steering, volumetric god rays, reflections, and landscape geometry, alongside a 3D sailing galleon with night lighting and fireworks [01:46].
• Mobbin MCP Integration [02:07]: Introduces the Mobbin connector for Claude Desktop/Claude Code, allowing AI agents to query and retrieve UI screenshots and flow references from Mobbin's library.
• Claude Code Setup & Effort Levels [06:13]: Walks through setting up the Claude Desktop app, configuring connectors, selecting Claude Opus 5.5 in "Auto" mode, and setting reasoning effort to "Extra" [09:23].
• Reference Gathering & Project Planning [09:48]: Queries Mobbin through Claude Code for top solar panel landing pages (e.g., Daylight, Origin), receiving full-resolution screenshots directly into the terminal workspace, and generates a multi-section architecture plan [11:59].
• Prompting & Guardrails Workflow [14:31]: Uses voice dictation to specify art direction (Japanese aesthetic, procedural 3D buildings, Iconify icons, transparent PNG overlays) and instructs the agent to self-score and self-verify output in a browser until reaching 8/10 or better [16:21].
• Multi-Threaded Sub-Agents [33:38]: Dispatches background threads in Claude Code to simultaneously build a brand guide, generate billboard mockups via image generators, and explore SVG/PNG logos while the primary build continues.
• Single-Prompt Recipe Breakdown [38:08]: Analyzes the exact text prompt from his viral X post, highlighting instructions for standalone single-file deliverables, automated browser testing, and balancing visual quality with real-time frame rates.
• ThreeUI Templates & Build Review [41:04]: Browses DesignCode's ThreeUI template repository and reviews the active solar landing page build after an hour of autonomous generation [43:08].

Claims & numbers

• The presenter claims that landing pages of this caliber typically command a value of "$10,000, $20,000" if delivered to a client [00:26, 29:15].
• The presenter notes his initial X post demonstrating the 3D boat scene received over 400,000 views and 6,100 likes [01:03].
• The presenter states Mobbin provides access to over 1,428 apps and 621,500+ design screens and flows [02:18].
• The presenter claims procedural 3D code loaded via Three.js takes around 500 KB to download, compared to 1–2 MB for high-res images and up to 100 MB for equivalent looping video backgrounds [24:08].
• The presenter states the autonomous generation run shown took approximately 1 to 2 hours of background agent execution [30:30, 46:25].
• The presenter mentions that ThreeUI includes 150 free 3D components and templates alongside pro elements [41:56].

Notable quotes

• "Everything is in 3D... you can literally create $10,000, $20,000 value of landing pages by using Opus 5.5." [00:17]
• "The more that you give effort level, the longer that it's going to run, and that is so, so important in order to get to a level of details that you find right here." [09:33]
• "The more that I work with AI, the more that I realize I'm just working with, like, a beautiful human... you're more like a manager, you're more like orchestrator." [21:02, 31:07]

Assessment
This is a genuine workflow tutorial and product demonstration presented by Meng To, combining live terminal footage of Claude Code with functional browser previews of procedural Three.js websites. While the autonomous generation process was accelerated via cuts rather than shown continuously across its full hour-long run, all demonstrated interactive 3D code, agent prompts, and browser outputs are authentic and verifiable.

Described by gemini-3.8-flash on 2026-09-29 from the video's audio and frames.