Diorama • sprites as code

2.5D game sprites written as code. AI coding agents write TypeScript, the engine draws characters, scenery and effects. No image models. Open source (MIT)

[Diorama • sprites as code @dioramadev]

Diorama: 2.5D game sprites written as code.

An AI coding agent like Claude Code writes TypeScript. The engine draws characters, scenery and effects in one camera and one light, and exports sprite sheets a game can play.

No image models. Open source (MIT). 🧵

#gamedev #indiedev

[Diorama • sprites as code @dioramadev]

@The1Broom Thanks! The weapon brings its class too: the guard's slash and cleave are made for a blade, so with a scythe they drop out of the controls. Are you building something with sockets yourself?

[Diorama • sprites as code @dioramadev]

Diorama: 2.5D game sprites written as code.

An AI coding agent like Claude Code writes TypeScript. The engine draws characters, scenery and effects in one camera and one light, and exports sprite sheets a game can play.

No image models. Open source (MIT). 🧵

#gamedev #indiedev

[Diorama • sprites as code @dioramadev]

@The1Broom Stable pivot. The rig declares the cell and pivot once, and every outfit is drawn on it, so variants share both. Body sockets (head, hands) come from the skeleton and match across swaps; weapon sockets like tip come from the held item, so a scythe's tip differs from a sword's.

[Diorama • sprites as code @dioramadev]

@totoroa_nana Hey that’s amazing! If you wanna create 2.5D assets with consistency, check the Diorama in github! https://t.co/Dq1xFzPLSa

Any feedback is welcome.

[Diorama • sprites as code @dioramadev]

@jphilipp @hakimieiqbal Turned your idea into an issue: the line-art part already works per project, so it's a style recipe now, and bloom is an open question there. https://t.co/4giRVyctRe

[Diorama • sprites as code @dioramadev]

@jphilipp @hakimieiqbal Thanks! Both are style settings per project: inner lines are a darker shade of each material (one value in the theme), and turning the ink contour off leaves each shape outlined in its own colour. Bloom fits better in the game engine. I'll post a version with both!

[Diorama • sprites as code @dioramadev]

@jphilipp @hakimieiqbal Yes! Check this

[Diorama • sprites as code @dioramadev]

@Giulio6686 Building Diorama: Claude writes 2.5D game sprites as TypeScript and the engine renders them. Characters, scenery, effects and HUD, all from code, no image models. Same source, same pixels.

Open source: https://t.co/Dq1xFzPe2C

[Diorama • sprites as code @dioramadev]

@VistaLargaGames Building Diorama: Claude writes 2.5D game sprites as TypeScript and the engine renders them. Characters, scenery, effects and HUD, all from code, no image models. Same source, same pixels.

Open source: https://t.co/Dq1xFzPLSa

[Diorama • sprites as code @dioramadev]

@hakimieiqbal Nice result! How did you keep the PixelLab characters consistent across animations? That's the part I see most people fight with.

[Diorama • sprites as code @dioramadev]

@jphilipp @hakimieiqbal Keeping a character identical across frames is the hard part with image models. I took another route with Diorama: Claude writes each sprite as code and the engine renders every frame, so nothing drifts (2.5D, not pixel art). https://t.co/Dq1xFzPe2C

[Diorama • sprites as code @dioramadev]

@N1njaCodex This looks great. How did you get the pixel art look in 3D: a low-res render target, or just the textures? Keeping a consistent style with Claude is the hard part in my experience.

[Diorama • sprites as code @dioramadev]

@WukongNumber1 Exactly. Change a number, re-export, and the diff is one line of TypeScript. Same source, same pixels, so a refactor can be proven pixel-identical. There's even a before/after contact sheet (npm run contact --with) to review the frames side by side.

[Diorama • sprites as code @dioramadev]

Next, in public: a Phaser package, and Soulkeeper, a small dark-fantasy JRPG made entirely with Diorama.

Repo and roadmap: https://t.co/Dq1xFzPe2C

It grew out of MrMagma's NoctAssetForge, with his blessing 🙏

#gamedev #indiedev

[Diorama • sprites as code @dioramadev]

Scenery comes in kits on your game's grid: floors with transitions, walls that connect, doors and chests that open.

Scenes export their navigation, and effects fire on animation events: the soul bolt leaves the palm on "release" and bursts on the wall.

[Diorama • sprites as code @dioramadev]

Characters are skeletons written as data: humanoids, wolves, spiders.

Gaits plant their feet, attacks carry hit frames and sockets, and every sheet ships a manifest the game reads. Gear is parts: swap the sword and the attacks follow the weapon.

[Diorama • sprites as code @dioramadev]

We’re looking for more than Pro Clubs players.

Developers, QA, designers, security folks, product people — if you spot a bug, UX issue, edge case or something we should rethink, we want to hear it.

We’re building Gaffer with the community, not behind closed doors.