Fair Chair
A poolside reservation system designed to stay legible in direct sun, taken from design system through to a working prototype.
Three parts, one system.
Each opens in its own tab and carries its own navigation, so you can move between the system, the screens and the prototype.
Design system
Principles, colour across three modes from one set of variables, type, spacing, touch targets and the chair node component.
Open in a new tab → 02High-fidelity screens
The guest app, the walk-up kiosk and the pool team console, drawn from the same system.
Open in a new tab → 03Interactive prototype
The reservation flow, clickable end to end.
Open in a new tab →The constraint was the sun
A poolside product gets used outdoors, at midday, on a screen someone is squinting at. That set the bar for everything: contrast had to hold up in glare, type had to stay readable at arm's length, and nothing could depend on a subtle tonal difference to carry meaning.
The system states it plainly in its own principles: legible in full sun, shade is data, quiet luxury.
One system, three very different surfaces
A guest holding a phone, a walk-up kiosk standing in the open, and a pool team console being read at a glance are three different reading distances and three different lighting conditions.
Rather than three designs, it is one set of variables resolved into three modes, with shared spacing, radius and minimum touch targets. The chair node is the component that ties them together, since every surface is ultimately showing the same thing: which chairs are free, reserved, or in shade.
Built, not just drawn
The prototype is the part that answers whether the system actually works. It runs the reservation flow end to end in the browser, using the same components and tokens as the design system rather than a separate set of mockups pretending to be the product.
Designed to be read at noon.The line the whole system was built against