Skip to content
Ritesh FirodiyaGet in touch

Work / Tic Tac Toe / Wiki / Surfaces

win

Surfacecanonicalverified 2026-09-22

SURFACE.MOBILE.GAME.WIN

Summary

The game-over sheet after a win.

Raw wireframe

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

Why it is drawn this way

A centred card over a dimmed board, not a bottom sheet. It is a transparent Modal with a black/50 backdrop; tapping the backdrop goes Home, tapping the card does nothing.

The icon is a trophy, the loss a frown, the draw a handshake. The one deliberate departure from the code in this set: GameOverModal draws a Trophy for all three and separates them by colour, which asks the player to read a colour to find out whether they won.

The winning line is amber in both themes. It has to beat blue and rose at once, so it cannot be either of them — the one place a third colour is allowed on the board.

The copy changes with the mode. VS Computer says "You Won" or "You Lost"; Local Battle says "X wins" or "O wins", because there is no "you" when both players are holding the same phone.

Two actions, and Home is the quiet one. Play Again carries the brand fill; Home is an outline. The common case after a win is another game.

Related

Sources

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

Every project of mine is written down like this.

Read the résumé