Video editor who got hooked on building fun 3D stuff with AI. Sharing it as I go, plus the workflow so you can build your own. @ Design+Code

Quebec
This got over 60K views on Threads and LinkedIn combined overnight, which never happens to me. So here it is for X. A flat floor plan that builds itself into a house as you scroll. Built with @claudeai Opus 5.5.
34
107
1,225
138,169
7 creative ideas to turn a flat drawing into 3D as you scroll. Which one feels the most premium to you? 1- Section Sweep: a scan turns the ink into real materials and you walk in through the cut 2- Card Model: scroll down to the tiny figure and the white card model becomes the real house 3- Build Time-Lapse: walk the site while the house goes up week by week 4- Open Section: the cut opens into depth and the camera visits each floor 5- Sunlit Elevation: the hatching on the drawing is the real shadow, so when it turns to brick not one shadow moves 6- Exploded House: the layers land one by one in building order, then you walk in 7- Schedule Build: scroll the construction schedule and a crane builds the house I’m sharing everything (starter prompts and repo). Stay tuned. All built with Opus 5.5.
11
29
390
17,357
How I built 7 ways to turn a flat drawing into 3D, in one 18-minute video. - What each one does, with my demo - Its starter prompt in a fresh @claudeai Opus 5.5 session. First try, no editing. - How I polished the floor plan that went viral, room by room Try all 7 (best on a laptop): sam1983aing.github.io/flat-t… Starter prompts and repo: github.com/Sam1983Aing/flat-… The polished floor plan: sam1983aing.github.io/lintel… YouTube: piped.video/UTCPqJZFg04
7 creative ideas to turn a flat drawing into 3D as you scroll. Which one feels the most premium to you? 1- Section Sweep: a scan turns the ink into real materials and you walk in through the cut 2- Card Model: scroll down to the tiny figure and the white card model becomes the real house 3- Build Time-Lapse: walk the site while the house goes up week by week 4- Open Section: the cut opens into depth and the camera visits each floor 5- Sunlit Elevation: the hatching on the drawing is the real shadow, so when it turns to brick not one shadow moves 6- Exploded House: the layers land one by one in building order, then you walk in 7- Schedule Build: scroll the construction schedule and a crane builds the house I’m sharing everything (starter prompts and repo). Stay tuned. All built with Opus 5.5.
1
8
34
1,486
I made a glass reading stone you can slide across a webpage. Try it: sam1983aing.github.io/beryl/ Prompt and source: github.com/Sam1983Aing/beryl The words swell under it. Tap it and it ripples like water. Pick a glass and the colour spreads across the page from the bead. One HTML file, no images, no 3D models. Built with @claudeai Opus 5.5.
2
15
823
These scene sequences made with Opus 5.5 are so well executed that you forget for a moment AI was behind it. The Little Prince story turned into a 3D world that feels like a small film. The rose, the king, the fox, the crashed plane in the desert. The 3D models come from Tripo and Blender and Opus stitched everything together. 16 days of work. That's the level we can get to now when someone actually takes the time to polish every scene. Explore: littleprince.dev
花费16天,我用 Opus 5.5 将小王子的故事制作成了3D剧情游戏 结合Tripo+Blender,Opus 5.5 将小王子故事中的每一个星球变成了可探索的3D场景 希望大家能支持一手,后续会开源整个游戏,以及详细制作流程 Welcome to The Little Prince: Across the Stars✨:littleprince.dev/
1
140
I really love this button. Never seen anything like it while browsing on here. Gives me full Venom vibes, the way it grabs the cursor. Pretty awesome work. 👏
Clauded this in 2 hours
1
272
I open-sourced this iconic location in Bali. Code: github.com/Sam1983Aing/sacre… Live: sam1983aing.github.io/sacred… The Sacred Monkey Forest follows the real visitor map. The three temples, the holy spring, the Dragon Bridge over the ravine, 2,275 trees and 120 long-tailed macaques walking the paths. - Monkeys, temples and trees built in Blender by scripts - Carved faces and statues turned from photos into 3D with Hunyuan3D - Every sound made in code Built with @claudeai Opus 5.5, then polished with Gemini 4 Argon
1
1
4
392
I rebuilt Bali's iconic Sacred Monkey Forest in the browser. Live: sam1983aing.github.io/sacred… It follows the real visitor map. The three temples, the holy spring, the Dragon Bridge over the ravine, 2,275 trees and 120 long-tailed macaques walking the paths. - Three.js for the whole scene, custom shaders for the water, sky and wind - Monkeys, temples and trees built in Blender by scripts, no hand modeling - Carved faces and statues turned from photos into 3D with Hunyuan3D - Every sound made in code with Web Audio, even the monkey calls - Golden hour, morning, noon and night with the temple lanterns lit @threejs and @claudeai Opus 5.5 again, with Gemini 4 Argon @antigravity on the final polishing round. Should I make this open source?
6
1
7
725
Okay, Gemini 4 Argon is freaking good at this. First try in @antigravity, set to High. A concert ticket you can bend, flip and tear off. Tearing it is so satisfying. It rips one fiber at a time and even the sound is made in code. The holographic foil shifts as the paper bends. It feels super premium. The full prompt below.
21
38
469
22,024
Starter Prompt: Build an interactive 3D physical paper "Ticket Tear" event checkout component ("ADMIT ONE // HOLOGRAPHIC PASS") using Vite, TypeScript, Three.js, custom GLSL shaders, and the Web Audio API. 1. Visual Direction & Layout - Use a clean, high-craft studio checkout layout on a Warm Gallery Alabaster background (#F4F2ED) with a subtle hairline dot grid, soft radial studio lighting, and an optional Dark Concert Hall theme toggle in the top header. - Left column: a sleek event checkout card ("KINETIC LIGHTS SYMPOSIUM") with a 3-way Holographic Foil Edition selector (01 Silver Holo, 02 Founders Gold Leaf, 03 Ultraviolet Prism), seat/zone selector, live perforation fiber tear meter (25/25 fibers), and a primary action button. - Right/Center stage: the large 3D perforated pass (2 : 3.4 vertical proportions) suspended in 3D space and casting a real, deforming soft contact shadow onto the studio floor. 2. Real-Time 3D Verlet Card-Stock Physics & Split-Seam Topology - Build a custom 900-vertex (25 columns x 36 rows) 3D Verlet physics solver (VerletPaperEngine) stepped at 10 constraint iterations per frame. - Use 4 spring constraint types so the mesh feels like heavy 350gsm laminated card stock rather than floppy cloth: a) Structural springs (stiffness = 0.94) along horizontal and vertical grid edges. b) Shear springs (stiffness = 0.82) across diagonals to prevent skewing. c) 2-hop and 4-hop Bending springs (stiffness = 0.76 and 0.56) so the card resists sharp creases and bends in smooth, stiff arcs. d) Split-Seam Perforation Topology (The Secret to a Real V-Gap Tear): - Split the geometry at 72% down the card (UPPER_SEAM_ROW = 24, LOWER_SEAM_ROW = 25) so the upper pass body and lower detachable QR stub do NOT share welded triangle indices across the seam. - Bridge row 24 and row 25 exclusively with 25 breakable perforation seam springs (one per column). - When a seam spring at column c is severed, deactivate the structural, shear, and bending springs crossing the seam at column c and apply a slight curl impulse so the torn edge physically opens into a 3D V-shaped gap as you slice across. 3. Two Tactile Ways to Tear & Flex the Pass - Grab, Flex & Tilt: Raycast pointer movement tilts the card toward the cursor so the holographic foil catches the studio lights. Dragging anywhere on the upper pass pulls vertices in 3D space with damped elastic recoil. Double-clicking (or pressing F) flips the pass 180 degrees to inspect the back face. - Slice or Pull to Tear the Stub: - Dragging across the perforation seam (or pulling the bottom QR stub downward) severs the 25 perforation fibers sequentially (0% to 100% torn). - Once all 25 fibers are severed, release the bottom stub under gravity with air-drag flutter and rotational tumble, recoil the upper pass, and transition the checkout UI to "PASS VERIFIED · ADMIT ONE". - Pressing R ("Issue Fresh Pass") slides a crisp untorn pass into the stage. 4. Custom GLSL Prismatic Holographic Foil & Emboss Shader - Generate high-DPI (1024 x 1740) procedural canvas textures for both the front and back faces: - Diffuse + Alpha Map: Ticket typography, fine guilloche security rosette, QR/barcode stub, rounded corners, side security notches, and 24 punched circular perforation holes along the seam (discard alpha in fragment shader so the punched holes and torn scalloped teeth are see-through). - RGB Foil / Emboss / Phase Mask: Red channel = foil reflectivity mask, Green channel = embossed heightfield for finite-difference normal perturbation, Blue channel = local phase offset. - In the custom GLSL fragment shader (with position and normal attributes recomputed every frame after the Verlet step): - Evaluate a diagonal thin-film rainbow sweep driven by view angle, vertex normal, light direction, and UV projection. - Add 2D Voronoi cellular micro-glitter flakes that sparkle individually when each cell's random tilted normal aligns with the studio light. 5. Procedural Web Audio & [X] Physics X-Ray Mode - Synthesize all audio in code via Web Audio API: band-passed noise bursts (1.35kHz to 2.8kHz) pitched up across columns 0..24 as each paper fiber snaps, culminating in a warm Fmaj9 verification chord on detachment. - Pressing X ("Physics & Shader X-Ray") overlays a live THREE.LineSegments lattice of all active Verlet springs color-coded by type and strain (cyan = structural, indigo = shear/bending, amber/red = breakable perforation seam fibers).
23
1,598
After this viral floor plan, I tried a new style of 3D. Paper cut-out. Try it live: sam1983aing.github.io/fold-l… Everything is real 3D but it lies flat until you reach it, then springs up like a pop-up book. Click a map, dive into its red pin and a tiny paper hiker walks the trail. Built with @claudeai Opus 5.5.
This got over 60K views on Threads and LinkedIn combined overnight, which never happens to me. So here it is for X. A flat floor plan that builds itself into a house as you scroll. Built with @claudeai Opus 5.5.
3
12
106
4,677
The rough version of this went viral across all my platforms. Here's the polished one, about 90% there. Still a flat floor plan that builds itself into a house as you scroll. Just a lot more detail in every room now. Built with Opus 5.5.
This got over 60K views on Threads and LinkedIn combined overnight, which never happens to me. So here it is for X. A flat floor plan that builds itself into a house as you scroll. Built with @claudeai Opus 5.5.
8
20
253
12,854
I gave a free 3D car file to Google’s new Argon model and it turned it into a full supercar commercial like it was nothing. 45 minutes to build the Ferrari from scratch. 14 minutes to convert it to the Lamborghini Aventador. Built in @antigravity.
4
464
Google Argon just deconstructed and rebuilt a Lamborghini Aventador and a Ferrari 458 Italia like it was nothing. It took 45 minutes to build and polish the full 5-act sequence for the Ferrari and only 14 minutes to convert the entire thing to the Lamborghini (under 1 hour total). Built with @antigravity (@GoogleDeepMind). • Exploded 3D wireframe parts flying together in mid-air • A sweeping laser scan that reveals the real paint, rims and badges • Engine startup, exhaust flames and a 300+ km/h midnight highway chase Let me know if you want to learn the workflow behind this build.
1
1
12
1,241
After this one unexpectedly went viral, I got curious. What other creative ways are there to use 3D? So I tried 3 new concepts. All Three.js, no images, everything built in code. They're still in the early stages. Nothing is polished yet. Which one do you like most? 1, 2 or 3?
This got over 60K views on Threads and LinkedIn combined overnight, which never happens to me. So here it is for X. A flat floor plan that builds itself into a house as you scroll. Built with @claudeai Opus 5.5.
9
20
286
13,052
I tested Argon inside Google Antigravity by building complex 3D WebGL/Three.js simulations from one detailed prompt in a single shot. Along the way, I learned that most people only use AI coding agents in "1st gear." Antigravity actually has 3 distinct execution levels and picking the right one completely changes your output quality vs. token usage: 🟢 Level 1: Regular Mode (Raw Prompt) • Workflow: Reads prompt → writes code immediately → done • Usage: 1x (Baseline) • Best for: Fast prototypes, single-pass apps, and quick iterations. 🟡 Level 2: /plan (Architecture-First Mode) • Workflow: Researches → writes a full technical spec artifact → waits for your approval → builds cleanly • Usage: ~1.5x–3x (Saves tokens by preventing wrong assumptions) • Best for: Multi-file physics, complex state, and clean modular architecture. 🔴 Level 3: /boost (Maximum Rigor + Self-Verification) • Workflow: Deep thinking → parallel subagents → builds modular code → writes unit tests → launches a live browser to visually inspect shaders/UI & fix bugs automatically • Usage: ~4x–16x • Best for: Complex GLSL shaders, 3D math, and jaw-dropping 1-shot demos that work out of the box. ✈️ AERO-X9000 — 3D Procedural High-Bypass Turbofan CAD Inspector Mode used: Regular (Raw prompt, no slash command) Even in standard 1x mode, it generated twisted aerofoil fan/compressor stages, an exploded-view assembly slider, dual-spool N1/N2 kinematics, GPU airflow streamlines, and PBR/Blueprint/Thermal modes. Prompt: Build an interactive 3D Procedural High-Bypass Turbofan Jet Engine CAD Inspector using Three.js and Vite. Requirements: 1. Purely procedural 3D geometry (no external 3D model files): intake cowling (with cutaway/transparency toggle), titanium fan stage with twisted aerofoil blades, low/high-pressure compressor stages, annular combustion chamber with emissive flame glow, high/low-pressure turbine stages, exhaust nozzle, and internal drive shafts. 2. Interactive "Explode Assembly" slider that smoothly separates all engine modules along the central axis with spring interpolation, plus individual stage isolation (click any module to focus the camera and inspect it). 3. Animated kinematics & airflow: variable RPM throttle slider that spins the low-pressure (N1) and high-pressure (N2) spools at realistic gear ratios, plus animated GPU particle streamlines showing cold bypass air vs. hot core combustion gas flow. 4. Visual modes: PBR Studio Metallic mode, Blueprint Wireframe mode, and Thermal/X-Ray heatmap mode. 5. Engineering HUD: live telemetry readouts (N1/N2 RPM, EGT temperature, thrust in kN, bypass ratio, compression ratio) and 3D spatial callout labels anchored to each engine stage. 👇 Below are some interactive 3D demos Argon built:
7
14
2,396
🚀 FALCON-IX — 6-DOF Propulsive Rocket Booster Landing Simulator Mode used: /plan Why /plan here? A closed-loop PID hover-slam autopilot + 6-DOF rigid-body physics needs clean math and modular separation before writing code. Prompt: /plan Build a 3D 6-DOF Propulsive Rocket Booster Landing Simulator using Three.js. Requirements: 1. Procedural reusable rocket booster stage with animated grid fins, unfolding mechanical landing legs, gimbaled main engine nozzle, volumetric mach-diamond exhaust plume shader, and cold-gas RCS thruster puffs on an ocean autonomous drone ship / landing pad. 2. Realistic 6-DOF rigid-body physics: variable mass (fuel burn), thrust vectoring (TVC), aerodynamic drag from grid fins, wind gusts, and landing leg suspension compression on touchdown. 3. Flight modes: Manual piloting (WASD attitude + Shift/Ctrl throttle + G for legs) AND an automated closed-loop PID Suicide-Burn / Hover-Slam Autopilot toggle that guides the booster from high altitude and off-axis drift to a bullseye landing. 4. SpaceX-style telemetry HUD: navball / attitude indicator, altitude & vertical/horizontal velocity tapes, throttle & propellant gauges, predicted impact reticle on the pad, camera switcher (Chase Cam, Pad Cam, Onboard Fin Cam), and synthesized rocket rumble & RCS audio.
1
2
216
🎛️ MAGNETO-CYMATICS — 3D Ferrofluid & Chladni Audio-Visual Synth Studio Mode used: /boost (1-shot) Built-in polyphonic Web Audio FM synth + 16-step arpeggiator driving a 3D magnetic ferrofluid spike shader AND a 50,000-particle Chladni resonance plate in real time. Prompt: /boost Build an interactive 3D Ferrofluid & Cymatics Audio-Visual Synthesizer Studio using Three.js and the Web Audio API. Requirements: 1. Built-in polyphonic Web Audio synthesizer from scratch (no external audio files needed): dual oscillators, FM modulation, resonant low-pass filter, ADSR envelope, stereo delay/reverb, playable via on-screen keyboard, computer keyboard, or a 16-step generative arpeggiator/sequencer with presets. 2. Real-time FFT frequency analysis splitting audio into sub-bass, bass, mid, and high bands. 3. Visualizer Mode 1 — 3D Magnetic Ferrofluid Sculpture: custom vertex/fragment shader with iridescent chrome/oil-slick reflections that forms sharp magnetic spikes driven by bass and harmonic frequencies, plus mouse-cursor magnetic attraction. 4. Visualizer Mode 2 — 3D Chladni Cymatics Resonance Plate: 50,000+ GPU particles settling into mathematical Chladni nodal patterns (n, m modes) that morph dynamically with the played musical pitch and harmonics.
1
117