Game lobbies

A games page that looks and feels like a real game app, made only of blocks. It is how the Business starter's Game Night page is built, and any AI can build the same thing (or an apps page, a class's activities, a menu of challenges) from the same parts.

Code: convex/lib/lobby/ (descriptions, checks, art names, palettes, words, ready page), convex/kits/lobby/lobby.ts (one server read), src/kits/lobby/ (screens), tests/lobby.test.ts.

The blocks #

Kind	What it is	Holds
`poster`	One bright card: art on a gradient, the name in big letters, a badge (HOT, NEW, LIVE), a corner hook, a line. A game poster opens a sheet (how to play, players, time, your best, big Play) and then the game full screen; a link poster opens its `href`.
`posters`	The main shelf: a grid of posters in small (3 across), medium (2) or large (1, wide) with a switch. Cards pop in one after another.	`poster`
`showcase`	The featured carousel: big wide cards with a PLAY button, moves on by itself every `every` seconds.	`poster`
`game.live`	Games people started that others can still join, with how many are in and a Join button. Hidden when nothing is on.
`game.winners`	The latest winners scrolling by.
`game.record`	Each person's own plays, wins and best score per game.
`lobby.header`	Logo square, a line under the page title, and the person's coins counting up (Ledger).
`lobby.row`	A chat-list row that opens the games page: a 2×2 mosaic of its posters' art, the name, the games, a count.	`poster` (optional, extra)
`game.frame`	One game's play screen on a page. Posters open the same screen by themselves.

Every prop is described once in convex/lib/lobby/blocks.ts; HQ, the page editor and the AI read the same descriptions.

Looks are settings #

The page gets chat-app's Arcade glow look by default (ARCADE_LOOK in convex/lib/scene.ts, a page look): a deep night ground, grid lines that sweep from teal to violet to amber to pink, soft lights drifting, a lit floor of lines moving toward you at the bottom, light streaks, glass cards with a lit edge and glowing section titles. It's only style settings (backdrop.lines, glow, floor, streaks), so the AI can change any of it or give the same look to any other page. gamesLobbyPage({ look: null }) keeps the space's own look.

Art (art): one of 20 drawn scenes by meaning (trophy, board, survey, mask, sketch, bubble, dice, wheel, bingo, cards, bomb, gift, detective, number, poll, buzzer, crown, mic, tv, rocket), an emoji, or an https picture. Each scene has a part that floats gently.
Colours (palette or colors): 12 palettes (sunset, ocean, grape, lagoon, ember, lime, candy, night, gold, mint, berry, sky) or your own 2–3 colours / style roles.
Leave both out and a game poster picks art from what the game does (a board for a quiz board, a pencil for a drawing game) and a palette from its id, the same every time. A game the AI just made already looks finished.
The play screen borrows the look of its game's poster wherever it is.
Words: blueprint.words["lobby.<key>"] (keys in convex/lib/lobby/words.ts).

The play screen #

Intro splash (one second, tap skips; off with reduced motion), then a start screen (art, players / rounds / time, how to play, name, Start or Join · CODE, a code box). In the game: a header in the game's colours with the round and a timer, a progress bar, a chip per turn with what you scored, the game itself (the Rounds engine's GamePlay), and confetti when you win.

Light on the device #

One server read per shelf (convex/kits/lobby/lobby.ts summary), only for the parts a block shows; it stops while a game is open full screen or the page is in the background.
Only cards someone is playing right now (and the showcase card on screen) animate on their own. Everything else pops in once and rests. All motion is native-driven and off with reduced motion.
No images to download: art is vector (react-native-svg), gradients are styles.

For the AI #

The guide part is LOBBY_GUIDE() in convex/lib/lobby/guide.ts. Typical page, top to bottom: lobby.header, showcase, game.live, posters "House games", posters "Quick play" (small, hrefs), game.winners, game.record, ledger.leaderboard. gamesLobbyPage() in convex/lib/lobby/page.ts builds exactly that from a list of games. When the AI makes a new game it also adds a poster for it.

A poster for a game that was taken out (its kit removed) is not an error: it hides for members and shows greyed to people who manage the space.