Messages from home, at the edge of your game.
A self-initiated concept, designed and built solo: brand, design system and product. Sample data throughout.
Three working apps
Her phone, his desktop, the overlay on his game, and the site that sells them. Each one works; open any of them in its own tab.
Both ends, linked
Send from her phone, answer from his game with one key.
The overlay’s states
Small, dark, in the corner, gone in eight seconds. Only urgent is loud.
| Game | Corner | Why |
|---|---|---|
| Valorant, Counter-Strike 2 | Top right | Above the kill feed. Polite mode in ranked. |
| Overwatch 2 | Top left | The kill feed owns the top right. |
| Fortnite | Bottom right | The top is busy with the storm and the squad. |
Comms+
Free does the job. Comms+ is one payment, for people who outgrow it.
Free is the whole product for most people. Comms+ is for the ones who outgrow it, and it’s US$6.99, once. No subscription: a small utility shouldn’t rent itself back to you.
- One PC, 3 people
- Moods, quick messages and urgent
- Three reply keys, in your words
- Heads down and per-person rules
- As many people as you like
- A corner and keys for each game
- Custom sounds and overlay styles
- Every future feature
A name and a dot
Comms is what players call their voice channel. The o is the ping.
The logo and the notification are the same object: the magenta dot that lands on her photo when she writes. See the dot, and someone at home is talking.
One pink, flat
A quiet grey and one magenta. Pink always means someone at home.
Two typefaces
Clash Display for the brand, Neue Montreal for everything read at a glance.
Six moods, drawn by hand
A face and a word, so tone survives a two-line message.
She chooses the mood; the product never guesses. Each face has one detail and always arrives with its word.
Tokens in three layers
One source file builds the web, the docs and the overlay’s native constants.
The components
Thirty-one documented pages, from colour to his dashboard, each with its props, states and WCAG 2.2 criteria.
Open the component reference →
| WCAG 2.2 | How Comms meets it |
|---|---|
| 2.5.8 Target size | Everything clears 24px; her main targets are 44px. |
| 2.4.13 Focus | A 2px magenta ring with a 2px gap on every control. |
| 2.5.7 Dragging | Every overlay position is reachable without a drag. |
| 2.2.1 Timing | Eight seconds, adjustable to “until I answer”. |
| 2.1.4 Shortcuts | F7 to F9 only listen while a message shows. |
| 3.3.8 Authentication | She joins from a link: nothing to type. |
It costs no frames
A budget for every resource, set before the first screen.
Budgets, not measurements: asleep all evening, and the part that draws over the game only exists while a message is on screen. No Electron, nothing injected into the game.
Testing it honestly
Four beliefs, four small tests, each pass condition written in advance.
| Belief | The test | It passes if |
|---|---|---|
| It costs no frames | Same Valorant deathmatch, Comms off and on, frame times from PresentMon. | No change beyond run-to-run noise. |
| The corner is safe | Five players, messages at random, a short interview after. | No death blamed on the overlay. |
| Partners can use it unaided | Five non-gamers get his link: “Tell him dinner’s ready.” | Four of five, within a minute. |
| The time range is trusted | A week of evenings: the range against when he came out. | Inside the range eight times in ten. |