Frontier AI models & creative code. 3D web experiments, backend reality & occasional tech rants. Demos & builds below

Bangladesh
Joined May 2023
Claude 5.5 Sonnet built this entire Scottish Highland steam train scene. Pure code. Zero 3D assets. • 770k tokens burned • ~1 hour generation time • Procedural viaduct, terrain, and particle smoke Is procedural 3D completely replacing traditional asset pipelines? 🚂
38
27
1
443
18,325
Your architecture is distributed across 14 microservices and 0 paying customers.
6
12
365
Prompt: PROJECT: HIGHLAND EXPRESS Fully Procedural 3D Steam Railway Experience You are a senior Three.js developer, procedural 3D artist, animation engineer, and technical artist. Build a visually stunning, fully procedural 3D railway scene featuring a detailed Victorian steam locomotive crossing a massive stone viaduct in the Scottish Highlands. The result should resemble a beautifully crafted miniature railway diorama brought to life, with cinematic lighting, rich environmental details, realistic mechanical animation, and atmospheric depth. TECHNOLOGY: Three.js TypeScript Vite Custom BufferGeometry Procedural shaders and materials Instanced meshes for environmental details CRITICAL REQUIREMENT: Everything must be generated procedurally using code. Do not use premade 3D models, downloaded assets, external image textures, or model files. Generate geometry, materials, terrain, vegetation, architectural structures, and animations programmatically. 1. STEAM LOCOMOTIVE Create a highly detailed Victorian steam locomotive with convincing proportions and intricate mechanical components. Include: Cylindrical boiler with detailed metal bands and seams. Large smokebox and front door with bolts and hinges. Tall chimney with a detailed rim. Steam dome and safety valves. Headlamp with a warm glow. Detailed cowcatcher and front buffers. Multiple large driving wheels with spokes. Smaller leading and trailing wheels. Connecting rods and coupling rods. Pistons and crank mechanisms. Cab with windows, controls, and interior details. Handrails, pipes, rivets, vents, and metal fittings. Procedurally generated paintwork and weathering. Use custom geometry and carefully modeled details rather than simple primitives as finished components. The locomotive must have a recognizable silhouette and convincing industrial construction. 2. MECHANICAL ANIMATION The locomotive must move continuously along the railway track. Implement: Rotating driving wheels. Connecting rods synchronized with wheel rotation. Correctly coordinated crank movement. Animated pistons where visible. Subtle locomotive suspension movement. Smoke emitted from the chimney. Steam escaping from valves and pipes. Headlamp illumination. Wheel rotation and connecting-rod movement must remain mechanically synchronized with the train's speed. 3. PASSENGER CARRIAGES Create several classic Victorian passenger carriages behind the locomotive. Each carriage should feature: Detailed body panels. Wooden or painted metal construction. Repeated windows. Roof curvature and roof seams. Doors, steps, buffers, and couplings. Underframe details and wheel assemblies. Warm interior lighting. Arrange the carriages along the railway track and make them follow the locomotive smoothly. All carriages must maintain consistent spacing and alignment when traversing curved tracks. 4. MASSIVE STONE VIADUCT Build a spectacular railway viaduct crossing a deep Highland valley. Include: Multiple massive stone arches. Thick stone pillars. Detailed masonry blocks. Individual stones with subtle variations. Decorative stone railings. Railway sleepers and metal rails. Weathering, moss, and subtle discoloration. Convincing structural proportions. Generate the arches parametrically rather than assembling the entire bridge from plain boxes. The train must travel across the top of the viaduct while the camera reveals the enormous scale of the structure. 5. RAILWAY TRACK Procedurally generate a railway track following a smooth three-dimensional path. Include: Two parallel steel rails. Repeated wooden sleepers. Rail fasteners. Gravel ballast. Track curvature and elevation changes. Use a spline-based track system. The locomotive and all carriages must follow the track accurately, including their orientation along curves. The train should not float above the rails, penetrate the bridge, or lose alignment during turns. 6. SCOTTISH HIGHLANDS ENVIRONMENT Create a beautiful Highland landscape surrounding the railway. Generate: Rolling green hills. Distant mountain ranges. Rocky cliffs and exposed stone. A deep valley beneath the viaduct. A winding river or stream. Small waterfalls where appropriate. Dense patches of pine trees. Scattered deciduous trees. Grass, shrubs, moss, and wildflowers. Rocks and boulders of varying sizes. Use procedural terrain generation, noise functions, custom geometry, and instanced vegetation. Trees must have varied silhouettes, branch structures, and foliage density. Avoid repeating the same tree or rock identically throughout the scene. Create depth through layered terrain, atmospheric fog, and distant mountain silhouettes. 7. STEAM, SMOKE, AND ATMOSPHERE Create convincing procedural particle effects. Chimney smoke: Continuous emission synchronized with locomotive movement. Expanding smoke puffs. Upward motion with wind-driven drift. Gradual fading and dissipation. Steam: Short bursts from valves and mechanical components. Expanding translucent clouds. Natural movement and fading. Environment: Light atmospheric mist in the valley. Subtle clouds moving across the sky. Gentle vegetation movement. Optional drifting particles illuminated by sunlight. Use efficient particle systems and shader-based effects where appropriate. Avoid oversized opaque particles that resemble simple spheres. 8. LIGHTING AND VISUAL STYLE Create a cinematic late-afternoon Highland atmosphere. Include: Warm sunlight illuminating the locomotive and viaduct. Cool shadows in the valley. Soft atmospheric haze. Distant mountains fading into the mist. Realistic metal reflections. Detailed stone and wood materials. Warm carriage windows. A glowing locomotive headlamp. Subtle ambient occlusion. Carefully controlled shadows. Restrained bloom and color grading. The locomotive should remain the visual centerpiece. Use a polished, stylized-realistic aesthetic with rich geometry and a miniature diorama presentation. Avoid excessive darkness, oversaturated colors, and excessive post-processing. 9. CAMERA AND PRESENTATION Create a cinematic opening sequence. Begin with a wide establishing shot showing the viaduct, valley, and approaching train. Then: Slowly approach the locomotive. Reveal the rotating wheels and connecting rods. Track alongside the moving train. Show the train crossing the stone arches. Pull back to reveal the surrounding Highland landscape. Finish with a dramatic wide shot of the entire scene. Provide interactive orbit controls and zoom. Include an optional train-follow camera that tracks the locomotive. Allow the user to pause and resume the train animation. The camera must not clip through the terrain, locomotive, or bridge. 10. AUDIO If practical, implement subtle procedural or synthesized audio: Steam locomotive chuffing synchronized with wheel rotation. Steam release sounds. Train wheel and rail ambience. Distant wind and environmental ambience. Audio must be optional and should respect browser autoplay restrictions. 11. TECHNICAL QUALITY Organize the project into logical modules: Scene and renderer. Locomotive geometry. Mechanical animation. Passenger carriages. Railway track. Viaduct generation. Terrain generation. Vegetation. Particle systems. Lighting and atmosphere. Camera and controls. Requirements: Use instancing for repeated sleepers, stones, foliage, and architectural details where appropriate. Avoid excessive draw calls and unnecessary geometry duplication. Use appropriate geometry resolution and level-of-detail techniques. Handle browser resizing correctly. Dispose of resources appropriately. Maintain smooth animation and responsive controls. Ensure all moving components remain synchronized. Avoid placeholder geometry in the final hero locomotive. 12. EXECUTION REQUIREMENTS Do not stop after writing a plan. Inspect the existing project structure, implement the complete experience, run the application, and inspect the actual rendered result. Identify visual defects and refine the locomotive, mechanical animation, viaduct, terrain, materials, and lighting. Verify that: The locomotive follows the track. Wheels rotate correctly. Connecting rods remain synchronized. Carriages follow the locomotive. The train crosses the viaduct without clipping. Smoke and steam animate correctly. Camera controls work. Performance remains acceptable. Deliver a complete, runnable Vite + Three.js project with installation instructions. FINAL QUALITY TARGET: The scene should look like an exceptionally detailed miniature steam railway brought to life: a beautiful locomotive with moving mechanical components, a massive stone viaduct, lush Highland scenery, drifting steam, and cinematic lighting. Prioritize visual quality, procedural modeling, mechanical accuracy, coherent animation, and environmental atmosphere over unnecessary features. lets build this.
1
3
20
935
"PHP is dead" - sent from a MacBook bought with money made entirely from a Laravel app.
9
10
538
Storm at sea simulation - update 2 Built entirely with code, zero external 3D models What's new: • MSC vessel & cruise ship options • Stormy weather & wave dynamics • Night mode water reflections & ship lighting How does it look?
5
1
20
747
Verified badge: done. 500 verified community: done. Just 466K impressions to go on the home stretch. Huge thanks to everyone rocking with the 3D & AI experiments so far - we’re just getting warmed up! 🤝🔥
3
7
283
Remove one permanently: VS Code, Git, Docker, Postman.
6
5
388
@grok If you had to permanently delete one and run the entire xAI stack without it, what's getting purged first?
1
1
115
Prompted both models to build an interactive procedural penguin with GPU fur strands. One nailed the squish dynamics. The other completely gave up on the tumble physics. Top (Opus 5.5) or Bottom (Astra 6)?
4
1
11
487
Prompt: Create an adorable, interactive 3D fluffy penguin toy using Three.js. Build the penguin entirely from procedural geometry. Give it a rounded black-and-white body, tiny wings, orange feet, a small beak, expressive eyes, and thousands of individually animated fur strands. INTERACTIONS: - Click and drag to poke, push, and pull the penguin. - Its soft body should squash, wobble, and bounce. - It should fall over when pushed and attempt to stand back up. - Animate a cute waddling idle motion. - Make the fur react locally to cursor interaction and movement. VISUALS: - Realistic fluffy fur using efficient GPU techniques. - Soft studio lighting, contact shadows, and a clean pastel background. - Smooth, physically believable movement. - A polished, minimal interface. Use Three.js, TypeScript, and Vite. No external models or textures. Optimize for smooth real-time performance. Build a working application, not a mockup. Test the interactions and fix errors. Prioritize cuteness, tactile physics, detailed fur, and a memorable 10-second visual showcase. Avoid unnecessary features.
112
95% of software engineers claiming they "code 10x faster with AI" are just writing unmaintainable tech debt at 10x speed.
9
7
437
Same prompt: "Procedural coastal diorama in Three.js. No models, no textures." • DeepSeek V4.1 Flash: ~1 hour · 78M tokens • MiniMax 3.1 Flash: ~2h 17m · 60.3M tokens Lighthouse, boat, water shaders, birds, and night mode. Left or Right which one built the better scene? 👇
8
1
34
2,367
DeepSeek got a bit too poetic and made a ghost lighthouse! Left has great atmospheric lighting, but Right definitely wins on the solid diorama build!
122
Prompt: Build a beautiful, highly detailed, interactive 3D coastal diorama using Vite and Three.js. Everything must be generated procedurally using code. No premade 3D models, downloaded assets, image textures, external model files, or manually created assets. Generate all geometry, materials, textures, and animations programmatically. SCENE: Create a miniature rocky island surrounded by an animated ocean, featuring a tall lighthouse, a wooden fishing boat, pine trees, a winding coastal path, a tiny dock, grass, flowers, rocks, and coastal vegetation. Use a polished, stylized 3D diorama aesthetic with excellent composition and rich details. LIGHTHOUSE: Procedurally generate the cylindrical tower, alternating painted sections, balconies, railings, stairs, windows, glass lantern room, roof, and decorative details. Add a rotating beacon with a sweeping volumetric-style light beam. OCEAN: Generate a subdivided water mesh with custom GLSL shaders for animated waves, layered wave patterns, moving normals, reflections, and color gradients. Add procedural foam near the shoreline and rocks. Make the fishing boat bob, tilt, and rotate naturally in response to the simulated waves. ISLAND: Generate the island using procedural terrain geometry, layered rock formations, irregular coastlines, cliffs, and elevation variation. Add winding paths, moss, grass, tiny flowers, and vegetation using procedural geometry and instanced meshes. TREES: Generate pine trees procedurally with varied trunks, branches, and layered foliage. Add subtle wind-driven movement to branches and vegetation. ATMOSPHERE: Generate animated clouds, drifting seabirds using procedural geometry, ocean mist, and subtle atmospheric particles. Use a procedural sky shader and cinematic lighting. MATERIALS: Create all textures and surface variation procedurally using shader functions, noise, vertex colors, and generated canvas textures where appropriate. Use detailed wood grain, weathered lighthouse paint, rocky surfaces, and varied foliage. No external image textures. LIGHTING: Implement golden-hour lighting, soft shadows, realistic water reflections where practical, a warm lighthouse glow, subtle bloom, and strong warm-versus-cool color contrast. Add a day/night transition that changes the sky, lighting, lighthouse illumination, and environmental mood. INTERACTIVITY: Implement orbit controls, zoom, a day/night toggle, a wind-strength slider that affects vegetation and waves, and a lighthouse-beam toggle. Add smooth camera movement and a polished default viewing angle. TECHNICAL REQUIREMENTS: Use Vite and Three.js. Generate custom BufferGeometry, parametric surfaces, procedural curves, shader-based effects, and instanced meshes. Avoid using basic primitives as finished assets; use them only as building blocks for more detailed custom geometry. Keep the code modular, optimize draw calls, handle resizing, and ensure all visible controls work. Maintain smooth performance in a modern desktop browser. DELIVERABLE: Create a complete, runnable project. Run it, inspect the actual rendered scene, identify visual deficiencies, and refine the geometry, water, materials, lighting, and animation. Prioritize exceptional visual quality, intricate procedural modeling, convincing animated water, natural boat movement, and cinematic presentation. The final result should look like a carefully crafted miniature 3D artwork, not a collection of basic shapes.
2
314
100% genuine, unedited, authentic, totally not edited in DevTools at 1 AM. 🥂
21
43
1,086
@grok is it a crime to generate my own happiness with ChatGPT when the real algorithm won't?
1
1
197
Drop the coolest thing you’ve built with AI 👀 Full apps, Three.js scenes, shader experiments, or tiny weekend hacks anything goes. Drop your links and screenshots below, let's see what everyone's shipping 👇
7
6
358
Here’s what I’ve been tinkering with lately: 30+ interactive procedural worlds, shaders, and physics toys built with frontier models. experiments.fazleyrabbi.xyz Still reviewing and trying everyone else's builds coming in 👀
1
117
Replying to @nabendu82
@nabendu82 challenged me to see if LLMs could build a full Subway Surfers clone autonomously from scratch. Exact same prompt. Zero external 3D models. Raw Three.js procedural city. • Left: GPT Sol 6.1 (15 min) • Right: Claude Sonnet 5.5 (~1 hr) Which runner would you actually play?
4
1
6
445
Prompt: You are the lead game developer, 3D artist, gameplay designer, and QA engineer for this task. Build the complete project autonomously in one continuous run. Do not stop after creating a plan, do not ask me questions, and do not wait for confirmation. Make sensible creative decisions yourself and continue until the game is working and verified. ## Goal Create a polished browser-based 3D infinite runner inspired by the general gameplay loop of games such as Subway Surfers, but do not copy its characters, environment, branding, music, models, or artwork. The original game concept is called **Rooftop Rush: Neo India**. The player controls a small futuristic courier robot running endlessly across the rooftops of a colourful fictional Indian megacity. The setting should combine modern skyscrapers, rooftop gardens, solar panels, water tanks, neon Hindi-inspired signage, monsoon clouds, flying delivery drones, distant temples, and warm sunset lighting. ## Hard restrictions * Do not use Blender. * Do not require Blender. * Do not use Unity, Unreal Engine, Godot, or another external game engine. * Do not download or depend on external 3D models. * Do not use copyrighted game assets. * Create all characters, environments, obstacles, effects, and animations procedurally with code. * The finished game must run locally in a normal web browser. * Do not leave important features as TODOs or placeholders. ## Technical stack Use: * Vite * React * TypeScript * Three.js * React Three Fiber * Drei * Zustand for game state if useful * CSS for the HUD and menus You may install other lightweight npm packages only when genuinely helpful. Keep the architecture understandable and avoid unnecessary complexity. If the current directory already contains a project, inspect it first and integrate carefully. Otherwise, create the complete project. ## Core gameplay Create a three-lane infinite runner with: * Automatic forward movement * Smooth left and right lane switching * Jumping * Sliding or ducking * Keyboard controls: * Left/Right arrows or A/D: change lanes * Up arrow, W, or Space: jump * Down arrow or S: slide * P or Escape: pause * Touch controls using swipe gestures for mobile * Increasing running speed over time * Procedurally recycled track sections so the game can continue indefinitely * Accurate but forgiving obstacle collision detection * Gradually increasing difficulty * Game-over state and instant restart ## Player character Create an original friendly courier robot entirely from Three.js geometry. It should have: * A distinctive head, glowing eyes, compact body, arms, and legs * A small delivery pack * A cyan-and-orange colour scheme * A visible running animation * Leaning during lane changes * Jump and landing motion * A proper sliding animation * A brief hit reaction * A subtle shadow underneath The robot must face and move in the correct direction. Its running animation should look convincing and should not resemble sliding across the ground. Use code-based skeletal-style grouping and transform animation; no imported model is needed. ## Environment Build an attractive stylised low-poly environment containing: * Three rooftop running lanes * Procedurally repeating rooftop sections * Buildings at different heights in the distance * Water tanks, satellite dishes, solar panels, AC units, rooftop gardens, railings, pipes, and billboards * Moving clouds and distant flying drones * Warm sunset sky with light atmospheric fog * Neon signs using fictional text and symbols * Parallax movement to enhance the sensation of speed * Variation between track sections so repetition is less obvious Prevent visible gaps between recycled track sections. ## Obstacles Include several clearly different obstacles requiring different reactions: * Low AC units that must be jumped * Overhead pipes or signs that require sliding * Large water tanks that block an entire lane * Moving cleaning robots * Broken rooftop gaps with safe jump ramps * Drone barriers that move between lanes Generate fair obstacle patterns. Never create an unavoidable combination. Give the player enough reaction time, especially at the start. ## Collectibles and power-ups Add glowing energy cells arranged in satisfying lines and arcs. Include at least three power-ups: 1. **Magnet** – attracts nearby energy cells 2. **Shield** – protects the player from one collision 3. **Overdrive** – temporarily increases speed, gives invulnerability, and adds a stronger visual effect Power-ups should have visible pickup effects, duration indicators, and clear feedback when they end. ## Scoring and progression Implement: * Score based on distance * Energy-cell counter * Current speed or level indicator * Combo multiplier for collecting consecutive cells without missing * High score saved with `localStorage` * Difficulty progression based on distance travelled * A small milestone notification every 500 metres ## Visual polish Add: * Responsive third-person follow camera * Smooth camera movement during lane changes * Mild camera shake on impact * Small field-of-view increase as speed rises * Dust or energy particles behind the robot * Pickup particles * Shield bubble effect * Overdrive trail * Subtle bloom-like glow using lightweight effects if performance allows * Shadows and appealing lighting * Smooth transitions between menu, gameplay, pause, and game over Prioritise consistent art direction and readability over excessive detail. ## Audio Use the Web Audio API or procedurally generated sounds so no external copyrighted audio is needed. Include simple sounds for: * Jump * Energy-cell pickup * Power-up pickup * Collision * Milestone * Game over Provide a mute/unmute button. Handle browser autoplay restrictions correctly by starting audio only after user interaction. ## User interface Create a clean responsive interface with: * Start screen showing the game title * Short control instructions * Start Run button * In-game score, distance, energy, multiplier, and active power-up display * Pause overlay * Game-over screen with final score, distance, collected energy, and high score * Restart button * Mute button * Small performance-friendly loading screen The game should be playable on desktop and mobile. Ensure text remains readable without blocking the action. ## Code quality Organise the code into sensible components and systems, for example: * Game canvas/world * Player * Track manager * Environment * Obstacles * Collectibles * Power-ups * Game state * Input controller * Collision system * Audio manager * HUD and menus Avoid putting the entire game in one huge file. Use reusable TypeScript types and constants. Dispose of Three.js resources appropriately and avoid uncontrolled object creation during gameplay. ## Performance Target smooth gameplay on an ordinary laptop and a modern mobile browser. Use: * Object pooling or recycling for track sections, obstacles, and collectibles * Instanced meshes where useful * Reasonable polygon counts * Limited shadow-casting objects * Stable React render behaviour * Delta-time-based animation and movement Do not sacrifice gameplay correctness for visual complexity. ## Required workflow 1. Inspect the workspace. 2. Create a concise internal implementation plan. 3. Implement the complete game. 4. Install required dependencies. 5. Run TypeScript checks and production build. 6. Start the game locally and inspect it in the browser if browser tools are available. 7. Test the main gameplay loop, controls, collisions, restart, pause, scoring, high-score persistence, responsiveness, and mobile input. 8. Fix all errors and obvious gameplay or visual problems you find. 9. Repeat validation until the production build succeeds and the game is genuinely playable. 10. Write a README containing setup instructions, controls, architecture, and implemented features. ## Acceptance criteria Do not consider the task complete unless: * The project installs and starts successfully * The production build passes without TypeScript errors * The player can switch between all three lanes * Jumping and sliding work * Running animation faces the correct direction * Obstacles and collisions work * Track recycling supports endless play * Score, collectibles, multiplier, and high score work * All three power-ups work * Pause, game over, and restart work * Keyboard and touch controls work * No Blender or external 3D asset is required * The result looks like an intentional small game rather than a basic Three.js demonstration At completion, give me a short report containing: * What you built * How to run it * Controls * Main files and architecture * Tests and validation performed * Any minor limitations that remain Begin now and take full ownership of the implementation.
361