Skip to content

Responsive Design

The device the named person actually uses shapes the design space. Not the device that flatters the screenshot.

Owners: Designer Phase it lives in: What We Build → How We Build (Volumes III and IV) The corpus principle this enacts: Witnessed, not described — including the device.

Where it lives in the chain

How to do this

  • Practice — name the device in the observation note. Gal grades on her 27" desktop. Uri reconciles on his ThinkPad in airport lounges. The receptionist's tablet is propped against the keyboard. The breakpoints follow.
  • Related craftUX/Product Ilities

What good design output looks like

The Figma frames exist at the breakpoints the named people actually use, not the breakpoints the design tool ships with. Touch targets are named — minimum 44px on the surfaces touched by hands, not by cursors. Layout shifts between breakpoints are intentional, not emergent; the same state has the same meaning at every size. A form that fits on the desktop and collapses to an unscrollable accordion on tablet is two products in one codebase, and the helpdesk pays for both.

The discipline is observation-first: what device does this person reach for, and where? The pickup-line attendant uses a phone outside in sunlight changes contrast, button size, and layout in ways that "mobile-friendly" never does.

200apps · How We Work · NWIRE