Games

The Game template starts you in a small multiplayer world. Everyone signed in to the app shares one 3D ground. Each player places boxes, cylinders, and spheres on it, moves and turns them, and sees everyone else’s edits arrive live. It runs on the web and on native iOS from one codebase, with the data stack behind it.

The world is deliberately small. It sets up the parts every game needs, done properly, and leaves the game itself to you.

#What you get

• Place, move, and turn. Pick Box, Cylinder, or Sphere and tap the ground to place it. Drag a block to move it. On a touchscreen, hold it with one finger and turn it with a second.
• Remove, undo, and redo. Remove takes away the selected block. Undo and Redo walk back through your accepted edits.
• Time of day. The time button cycles morning, noon, golden hour, dusk, and night. The sun, the shadows it casts, and the sky light change with it.
• Players in the room. The footer counts who else is here. A block another player has selected shows a ring in their colour.

A player signs in first. The guest login on the first screen is enough to start playing.

#How it’s built

#A real 3D scene on both platforms

The scene is React Three Fiber on three.js’s WebGPU renderer, in the browser and on iPhone. Materials are written in three’s node shading language, so one shader serves both platforms. Lighting comes from a sun with real shadows and a generated sky, and each time of day is one table of values for all of it.

The scene draws only when something changes. A drag or a time change paints frames. A world at rest paints none, so an idle game spends nothing on drawing.

#Saved with the data stack

Blocks are rows in your app’s database, synced to every player through the data stack. Every edit, whether a place, move, turn, removal, undo, or redo, goes through one mutator that records what the block looked like before and after. If another player changed that block first, the edit is refused instead of overwriting their work, and your undo history only keeps edits the server accepted.

A drag never writes while it moves. The block follows your finger on screen, and one edit saves when you let go.

#Live state in a room

Who is here, and which block each player has selected, changes every moment and is never worth saving. That state goes through a live room the app runs beside its database, instead of into the database. Only signed-in players get a ticket into the room.

#Make it yours

Describe the game you want in chat, for example Turn this into a tower-stacking game with a height score, and the factory builds on the template. You can also edit the code directly in the Dev space.

• features/blocks/ is the game: the controls, the scene, a block’s gestures, and the room. Replace it with your own.
• features/scene/ is the foundation the game stands on: the canvas, lighting, time of day, camera, and input. Most games keep it.
• database/schema.ts and data/ hold the saved data. After changing them, run Run → Generate and Run → Migrate as the data page describes.
• skills/game.md is the guide the factory’s agents read before changing the game, and a good map of the project for you too.

The template has no continuous simulation loop, scores, or leaderboard. Add them when your game needs them.