The Ramen Shop — A Tokyo Counter at Midnight, Procedural Lo-fi
You're sitting at a counter in a small Tokyo ramen shop after midnight. Steam rises from the bowl. Rain runs down the window. Lanterns sway. A procedural lo-fi loop plays in 4-bar Dm9-Fmaj7-Am7-Gm7. Mood, the demo.
What this is
You're at the counter of a small Tokyo ramen shop at midnight. The bowl in front of you has lathe-modeled ceramic, ripple-shaded broth, 14 tube-geometry noodles with vertex wobble, a half-egg with emissive yolk, chashu rings, scallions, nori. 8 stacked transparent steam billboards rise from the bowl with FBM noise. The window beside you shows a procedural rain-streaked alley with swaying lanterns (spring-damper physics) and occasional walking NPC silhouettes — all rendered in one fragment shader. 72 BPM lo-fi loop in jazz seventh chords plays in the background through Web Audio. ACES tone mapping with vignette. Vinyl crackle layer.
Why this is mind-blowing
"Mood as a deliverable" is hard. This demo nails it. The model understood that the brief was atmosphere, not features — and assembled the warm-cool color contrast, the spring-physics swaying, the FM-sax jazz lead, the rain hiss, the chef silhouette stirring noodles, all from one paragraph. Sit in the demo for a minute. You'll be in Tokyo.
Build a first-person scene of a small Tokyo ramen shop at midnight in
Three.js. Counter view of a bowl of ramen with rising volumetric steam.
Outside the window: a rain-streaked alley with paper lanterns swaying
on a wind-driven physics constraint. Procedural noodles, broth surface
ripples. Procedural NPCs occasionally walk past the window as silhouettes.
Audio: ambient rain + lo-fi hip-hop loop generated via Web Audio. The
whole scene should feel like the cover of a chillhop playlist.Paste this into Claude, Cursor, or Copilot. Change one thing that matters to you.
What I learned shipping it
- Stacking 8 transparent steam billboards with FBM noise + warm-bottom/cool-top tint is cheaper and prettier than real volumetric steam. Layered 2D > expensive 3D for diffuse semi-transparent effects.
- Spring-damper physics on the lantern strings — driven by procedural wind — is the small touch that sells presence. Without it, the lanterns look static, and the whole scene feels like a screenshot.
- Lo-fi music is just FM synthesis with a sax-like 2:1 ratio over jazz seventh chords (Dm9-Fmaj7-Am7-Gm7) at 72 BPM with a vinyl crackle layer. The model has the playlist's DNA.