Skip to content
Ritesh FirodiyaGet in touch

Work / Imposter / Wiki / Surfaces

card

Surfacecanonicalverified 2026-09-23

SURFACE.MOBILE.GAME.CARD

Summary

The face-down hand-off gate: one card, one name, swipe up.

Raw wireframe

  • .context/designs/mobile/game/card.html

Why it is drawn this way

This card is the product. Everything else exists to get here and away again, which is why the name is display size and nothing competes with it.

Pass and reveal are one screen. An earlier version routed between /game/pass and /game/reveal once per player — ten navigations for a five-player deal. This is one card that lifts in place, which is what every app checked does: imposter.app slides it up, Imposter Who? flips it, Party Edition parks the table as chips along the bottom.

Swipe up, not tap. A thumb cannot do it by accident while the phone is changing hands, and it is the gesture the card's own shape suggests — so the affordance costs no copy.

The face-down state confirms identity, not intent. A half-watching player taps Continue by reflex, but they will not swipe up a card with someone else's name on it. Nothing here auto-advances: a countdown would show a card to whoever happens to be holding the phone.

Dots, not a roll-call. "2 / 5" and five dots. Never "Riya ✓ Arjun ✓" — who has already looked is information an imposter can use.

The dots ahead of the current one are links, and only in the wireframe. One swipe has four outcomes and the app deals which; a wireframe cannot deal. Without those links civilian, imposter and imposter-no-hint — the payoff of the entire product — would have no URL. routes.js declares them as forward edges for the same reason.

The revealed card stays on the night flood. These frames used to flood to the role colour on open. Built, that fired a full-screen colour change mid-drag, and dragging across the commit threshold strobed the whole screen. A flood is a payoff for a discrete event; it is the wrong thing to bind to a continuous gesture. The role still reads instantly, because the paper panel carries it.

Related

Sources

  • .context/designs/mobile/game/card.html
  • src/app/game/card.tsx

Every project of mine is written down like this.

Read the résumé