The Prompts I Used to Build a Drivable 3D Car Game (React Three Fiber + Rapier)

A Bruno-Simon-style drivable 3D car game — drive a low-poly truck around a warm diorama and scatter the letters of your name. The full one-shot prompt, an 8-step incremental build, and a refinement round, using React Three Fiber and Rapier physics.

Overview

A physics playground inspired by bruno-simon.com: drive a low-poly truck around a warm, stylized world and shove the letters of your name around. Built with React Three Fiber + Rapier physics. Below is the exact set of prompts I used — a single one-shot prompt to bootstrap the whole thing, an 8-step incremental build for when the one-shot is too much for the tool, and a refinement round for the two parts that always need iteration.

What it produces: a drivable low-poly truck (Rapier raycast vehicle) on rolling hills, ~12 physics crates, the extruded 3D block letters of your name as individual rigid bodies you can plow through, stylized water with a submerged look, static walls, and a cozy sunset diorama — all in one Vite + React app.

Stack: three, @react-three/fiber, @react-three/drei, @react-three/rapier (Rapier is WASM — wrap <Physics> in <Suspense>). Asset: upload low-poly_truck_car_drifter.glb when the prompt asks for it.

The one-shot prompt (for Fable 5)

Paste this whole thing at once, uploading low-poly_truck_car_drifter.glb with it. Then iterate on whatever needs polish — the incremental prompts further down are your refinement toolkit.

Build a complete, single-page interactive 3D car game as a Vite + React app using three, @react-three/fiber, @react-three/drei, and @react-three/rapier. Visually inspired by bruno-simon.com: a low-poly, stylized diorama — NOT realistic textures. Ship it all in one go, cleanly structured into components (Scene, Terrain, Vehicle, Crates, NameLetters, Water, Walls, Lights, HUD). ART DIRECTION - Warm sunset palette: sandy-orange ground, teal/dark water, warm autumn accents, soft glows. - Flat-shaded low-poly / MeshMatcapMaterial everywhere — no photo textures. - One warm directional "sun" (soft shadows) + gentle ambient/hemisphere fill, light fog for depth. WORLD - Low-poly ground terrain with gentle rolling hills (subdivided plane, simplex-noise vertex displacement; keep hills subtle enough to drive over). Static (fixed) collider matching shape. - A water body in a low area: semi-transparent shader plane with gentle scrolling waves/ripples and depth-based tint so submerged objects look underwater. Teal color. - Static walls / barriers (fixed colliders): an outer boundary so the car can't leave the arena, plus a couple of interior obstacles. Loose objects bounce off them; walls never move. - ~12 cuboid crates of varying sizes as rigid bodies that fall in and settle (low-poly wood). - A few atmosphere props: low-poly trees, rocks, a lantern with a warm point-light glow. THE CAR — Load the uploaded GLB [upload low-poly_truck_car_drifter.glb] as the visual mesh of a Rapier raycast vehicle. Chassis = simple cuboid collider (never trimesh); the GLB follows the chassis each frame. Controls: W/S accelerate/reverse, A/D steer, Space brake. Tune mass, engine force, steering, suspension, and damping so it's responsive but doesn't flip easily. CAMERA — Third-person follow camera trailing behind/above the car; lerp position and lookAt (~0.1 smoothing) with slight lag on turns. No OrbitControls in the final game. MY NAME — Add "AVI VASHISHTA" as large extruded 3D block letters (drei Text3D, bold font), two rows ("AVI" / "VASHISHTA"), each letter its own rigid body with tuned mass so the car can plow through and scatter them. Bright accent matcap that pops against the ground. POLISH — Soft shadows, warm late-afternoon sun angle, mild bloom on glowing elements, subtle dust particles. On-screen hint: "WASD to drive · Space to brake." Wrap <Physics> in <Suspense> (Rapier is WASM). Keep it performant: reasonable shadow-map size, instance repeated props, and degrade gracefully on mobile. Deliver a working, drivable scene where I can immediately drive around, knock the letters of my name apart, shove crates, bounce off walls, and drive into the water.

After the one-shot, use the phase prompts below to fix the two things most likely to need iteration: vehicle feel (Prompt 3) and the water shader (Prompt 6).

How to use the incremental build

Vibe coders fail when you ask for everything at once. If the one-shot is too much for your tool, paste Prompt 0 first to establish the project and look. Then paste prompts 1 → 8 one at a time, checking the preview after each before moving on. Each prompt ends with a ✅ acceptance check — don't advance until it passes.

Prompt 0 — Project + art direction (paste first)

Build a single-page React app using Vite with three, @react-three/fiber, @react-three/drei, and @react-three/rapier. This is an interactive 3D car game, visually inspired by bruno-simon.com — a low-poly, stylized look (NOT realistic textures). Art direction: - Warm sunset palette: sandy-orange ground, teal/dark water, warm autumn accents, soft glows. - Use MeshMatcapMaterial / flat-shaded low-poly materials everywhere, not photo textures. - Soft shadows, one warm directional "sun" light + gentle ambient/hemisphere fill. - Slight fog for depth. Clean, cozy, game-like — think a small diorama world. For now just create the empty scene: canvas filling the viewport, warm background color, directional + ambient lights, soft shadows enabled, and a fog. Add an OrbitControls camera so I can inspect it.

✅ Confirm the packages install and I see a lit, empty scene with the warm background.

Prompt 1 — Ground with small hills + the car model

Add a low-poly ground terrain with gentle rolling hills (a subdivided plane with vertex displacement / simplex noise for small bumps — keep hills subtle so a car can drive over them). Give it a warm sandy-orange matcap/flat material and enable it to receive shadows. Load and display this GLB model on the ground: [upload low-poly_truck_car_drifter.glb]. Scale/position it so it sits nicely on the surface and casts a shadow.

✅ I see the truck resting on a bumpy low-poly ground.

Prompt 2 — Physics world + falling boxes

Add @react-three/rapier. Wrap the scene in <Physics> (with <Suspense> since Rapier is WASM). Enable gravity. Make the ground terrain a fixed (static) collider matching its shape. Drop about 12 cuboid rigid-body crates of varying sizes from above so they fall and settle on the ground. Give them a low-poly wooden/matcap look. Add a debug toggle for colliders.

✅ Crates fall, bounce slightly, and come to rest on the terrain.

Prompt 3 — Make the car drivable (raycast vehicle)

Turn the truck into a drivable raycast vehicle using Rapier's vehicle controller. - The chassis is a simple cuboid collider sized to the truck body; the GLB mesh is purely visual and follows the chassis transform each frame. - Controls: W/S = accelerate/reverse (engine force), A/D = steer, Space = brake. - Tune mass, engine force, steering angle, and suspension so it feels responsive but stable — it should NOT flip easily. Add mild damping.

✅ I can drive the truck around the terrain with WASD and it pushes the crates realistically.

Prompt 4 — Smooth follow camera

Replace OrbitControls with a third-person follow camera that trails behind and slightly above the car. Lerp both the camera position and its lookAt target toward the car each frame (smoothing ~0.1) so it glides rather than snaps. Keep a little lag on turns for a nice chase feel.

✅ The camera smoothly follows the car as I drive; no jitter or motion sickness.

Prompt 5 — My name as pushable letters

Add my name "AVI VASHISHTA" as large 3D block letters standing on the ground (use drei's Text3D with an extruded bold font, or per-letter box meshes). Each letter is its own rigid body so the car can plow through and scatter them. - Two words on two rows: "AVI" and "VASHISHTA". - Give letters a bright accent matcap that pops against the ground. - Tune their mass so they topple and slide when hit but aren't weightless.

✅ I can drive into the letters and knock them around individually.

Prompt 6 — Water body (with submerged look)

Add a water body — a low area / pond in one part of the terrain filled with a semi-transparent water plane. - Use a shader (or meshTransmission / depth-based tint) so objects below the surface look submerged: tinted and fogged with depth. Add gentle scrolling ripples / vertex waves. - Teal/dark water color to match the palette. - When the car drives in, it should visually sink/get tinted below the waterline (buoyancy optional — visual submersion is enough for v1).

✅ The pond looks like water; the car and crates look submerged when they enter it.

Prompt 7 — Immovable walls / boundaries

Add some static walls the car cannot move — low-poly stone or wooden barrier blocks placed around the play area as fixed colliders. Use them to: - Form an outer boundary so the car can't drive off the world. - Create a couple of interior obstacles / a little maze corner to drive around. Walls do not move when hit (they're fixed), but crates and letters still bounce off them.

✅ The car collides with walls and stops; it can't leave the arena; loose objects bounce off walls.

Prompt 8 — Polish pass

Polish the whole scene: - Add a few low-poly props for atmosphere (trees, rocks, a lantern with a warm glow light). - Enable and soften shadows; tune the sun angle for a warm late-afternoon feel. - Add subtle ambient particles/dust and mild bloom on the glowing elements. - Add a small on-screen hint: "WASD to drive · Space to brake." - Make sure it runs smoothly; if FPS drops, reduce shadow resolution and instance the props.

✅ The scene looks cohesive and cozy, runs smoothly, and is fun to drive around.

Paste these one at a time — each is a focused fix, ordered easiest → trickiest.

R2.1 — Orbit-follow camera (Bruno Simon style)

Replace the rigid behind-the-car camera with a Bruno-Simon-style orbit-follow camera. It should smoothly follow the car (the camera target lerps to the car's position each frame), but I can click-drag (and touch-drag) to orbit 360° around the car, and scroll to zoom. Implement it as a spherical offset (azimuth / polar / radius) around the car target; damp both the target and the rotation so it glides. Clamp the polar angle so the camera can't go under the ground. When I'm driving and NOT dragging, slowly ease the camera back to behind the car.

R2.2 — Make props solid (colliders on trees/rocks/lamps/fence)

Right now the car phases through the trees, rocks, lamp posts, and fence — give them all physical colliders. Wrap each static prop in a fixed RigidBody (type="fixed"): rocks = convex hull collider, tree trunks and lamp posts = cylinder or cuboid collider, fence segments = cuboid. They shouldn't move, but the car, crates, and letters should collide with them properly.

R2.3 — Play the truck's animations + spin the wheels

The truck GLB has animation clips that currently never play. Load them with drei's useAnimations and play the appropriate clip(s) — list the clip names you find so I can pick. Regardless of clips: spin the wheel meshes based on car speed and turn the front wheels with the steering input so the car looks alive while driving. Loop any idle clip when stationary.

R2.4 — Jump

Add a jump on Spacebar (move the brake to Left-Shift and update the HUD hint). On jump, apply an upward impulse to the chassis — but only when the car is grounded (at least one wheel in contact, or a short downward raycast hits ground) so I can't fly. Tune the impulse for a satisfying hop, and add a tiny cooldown.

R2.5 — Better water (kill the polka dots) + buoyancy

Redo the water — the scattered white polka dots look wrong; remove them entirely. Replace with clean stylized low-poly water: a flat plane with gentle Gerstner/sine vertex waves, a soft Fresnel rim, and a thin foam line only where water meets the shore (using scene depth), plus depth-based tint so submerged objects darken/blue with depth. Keep it calm and cohesive with the sunset palette. Subtle animated normal ripples are fine. Also add simple buoyancy so the truck floats and bobs at the surface instead of sinking and tipping over: apply an upward force proportional to how deep the chassis is below the waterline, plus vertical + angular damping, so it rides the waterline upright.

Gotchas to watch

        
            Rapier is WASM — needs
            <Suspense>; if the platform can't load WASM/npm,
            the build fails at Prompt 2. That's your go/no-go signal for the
            platform.
          
            Never use a trimesh collider on the moving car —
            use a cuboid. Trimesh is only for static terrain/walls.
          
            Vehicle feel (Prompt 3) and the
            water shader (Prompt 6) are the two that need
            iteration. Expect 2–3 refinement rounds each; describe what feels
            wrong rather than restarting.
          
            Test on mobile early — physics + shadows + water is
            the combo that hurts FPS.