D&D Campaign — 5-Episode Tabletop Saga (3D)
Four heroes. Five episodes. Real rolling D20. A worm-king at the end.
Built with:
HTMLJavaScriptthree.js
Prompt
An autonomous 3D D&D campaign in a single file. Four heroes (paladin, bard, rogue, wizard) playing a 5-episode story — tavern hook, village investigation, dungeon crawl, plot twist in episode 4, lava-arena climactic boss fight against the Worm-King Malthazar. Real 3D rolling D20 with physics (gravity, bounce, friction, face-normal detection, forced-face for narrative beats). 5 cinematic dioramas. Dungeon Master Cole figure at the table with candle and trifold screen. Typewriter chronicle with color-coded speakers. Per-mood lighting, torch flicker, particles, ACES tonemapping. HP bars, initiative, persuasion/insight/stealth/arcana checks, NAT 20 critical hits. End card listing each hero's fate. Auto-restart forever.
Paste this into Claude, Cursor, or Copilot. Change one thing that matters to you.
What I learned shipping it
- A physical D20 is the strongest narrative beat in any tabletop sim — let it bounce, settle, then read the face. Optional forced-face still respects physics: the same dice tumble, just the resting orientation is biased.
- 5 episodes × ~40 beats = 200-beat campaign in 100 KB. The trick is letting the chronicle typewriter be the bandwidth-heavy element while the 3D scene resets cheaply between episodes.
- Color-coded speakers in the typewriter (DM amber, paladin gold, bard pink, rogue grey, wizard purple) lets viewers track a 4-hero conversation without character names on every line.