Web and mobile web
The broadest doorway. Desktop can host a whole game, while phones become private controllers.
Work · games and interactive
Big Black
Cards
A realtime party game built for browsers, phones, televisions, and native stores. The social layer is not decoration. It is the product.
- Role
- Product, game design, brand, content, engineering
- Release
- Web and Fire TV live, Apple builds approaching release
- Scope
- Realtime multiplayer, TV stage, native delivery, host system
Realtime is the feature Adam
The judge
Someone wrong
// the product problem
Online card games remove the room to make the cards work.
That solves synchronisation and quietly removes the reason people came. The dead time, hovering, reactions, arguments, and visible alliances are usually flattened into buttons and a turn indicator.
The central decision
Make presence playable.
We treated cursors, chat, reactions, and the television host as first-order game systems. Players can see attention move before the judge makes a choice. That tension carries the round while the card rules stay deliberately simple.
- Named cursorsPointing becomes public pressure.
- Reaction layerHeckling lands on the play, not in a detached feed.
- TV stageThe room gets one public performance surface.
- Private controllersPhones preserve hands and write-ins.
// system underneath
One room model, delivered through several shells.
The main site should explain the implementation by responsibility. The game site can spend that space showing the experience instead.
- 01
Responsive game client
One interaction model adapts from private phone hands to desktop play and the public television stage.
- React 19
- Vite 8
- TypeScript 6
- Tailwind CSS 4
- 02
Realtime room model
Presence, cursors, plays, judging, and recovery share a room state without hiding the social layer.
- Supabase Realtime
- Postgres
- Zustand
- 03
Native platform shells
The web client travels through native shells while tvOS gets a focused stage implementation built for the remote.
- Capacitor 8
- SwiftUI
- Tauri 2
- Gradle
- 04
Show and content pipeline
Prompts, host timing, visual transitions, and card content turn a database round into a small game show.
- Framer Motion
- Lottie
- Airtable
- TTS audio
Architecture at a glance
Browser Phone Fire TV Apple TV Desktop
room authority Supabase
Realtime Postgres state · presence · events
Realtime Postgres state · presence · events
Airtable card sync Host audio Static game client Native build pipelines
// platform strategy
Share the game. Specialise the stage.
Platform reach came from preserving the responsive game client where it fit, then building purpose-made television behaviour where a wrapped browser would be the wrong product.
Fire TV
A Capacitor-based Android TV package with overscan-safe layouts, remote navigation, and low-power motion budgets.
iOS, iPadOS, macOS
Shared native packaging, platform audio behaviour, lifecycle recovery, and store-specific release work.
tvOS
A focused SwiftUI stage that reads room state, owns television audio, and treats the remote as a remote.
Android and Roku
Android builds extend the Capacitor path. Roku requires its own delivery surface and a deliberately narrower interaction model.
// hard parts worth showing
The portfolio value lives in the constraints.
Audio needs an owner
One television or host device speaks for the room. Presence changes need grace periods so a brief network flap does not create a chorus.
Televisions punish decorative motion
Blur and brightness animation that feels cheap on a laptop can become ruinous on a low-power TV GPU. The stage uses cheaper transforms and light.
Realtime recovery is a product state
Rejoining a channel is not enough. The stage must refetch authoritative state after gaps or it can remain confidently stuck in the wrong round.
// current outcome
A browser game became a platform product without losing the room.
The current product runs on the web and Fire TV, with Apple and additional platform work in motion. The useful proof is not the number of build targets. It is that each target preserves the same social round while respecting the screen in front of it.