The framing section of the live study states the job in one sentence and then refuses to widen it. Everything downstream is measured against whether it helps Maya read her own vitals with confidence across three surfaces, and whether her care team reads the same thing later.

It is worth being direct about scope: this is a speculative product. It is not FDA cleared and it has not been through human factors validation. Saying so plainly is part of the point, because a portfolio piece that implies regulatory clearance it does not have is exactly the kind of ambiguity this system is designed to eliminate.

What it is meant to demonstrate is method. Name the user and the job, build a system that scales past the screens you can imagine today, prove the safety patterns in working UI rather than describing them, and keep accessibility visible as a constraint instead of a footnote.

Color, type, space, and radius all live as shared variables, which is what lets tablet overview, phone density, and watch glanceability inherit one language instead of drifting into one-off styles. The canvas is deliberately neutral with a single high-energy lime accent held under roughly ten percent of any surface, so the accent still reads as an accent once the product grows.

Type is Inter Tight, set so the big numbers carry the hierarchy while labels shrink and mute. In a vitals product the number is the content, and a system that lets labels compete with readings is working against the person trying to read them. Radii run from 10px up to 36px and generous rounding is the signature that ties the whole thing together.

The most important rule in the system is the one separating brand from status. Positive, warning, and critical tones carry clinical meaning; the accent carries identity; and the two can never be swapped. That constraint exists so clinical meaning survives a brand refresh. Somebody can restyle this product without quietly changing what a color means at a bedside.

The iPad layout is the full read: SpO2 against its 94 to 98 percent target band, resting heart rate versus the weekly baseline, recovery trend, and activity, laid out so the eye can move between them without hunting. The phone is the same information at check-in density, not a squeezed copy of the tablet.

Getting that right is a system question rather than a layout question. Because both surfaces pull from the same tokens and the same metric card, the phone can drop supporting detail and keep spacing tight without any value changing meaning. Density becomes a setting rather than a redesign.

The alert thresholds are where the principles earn their place. A reading below 92 percent across three consecutive readings is not styled as a nicer chart, it is a critical state with explicit copy telling the patient to contact her care team. Every reading also shows its own as-of timestamp and live, stale, or offline status, so a chart that has stopped updating says so instead of quietly implying everything is fine.

Auth is usually treated as boilerplate, which is a mistake in a product handling clinical data. It is the first thing a patient sees, and it sets the expectation for how carefully the rest of the product will treat them.

So these screens use exactly the same field, button, and validation components as everything else. Same pill fields, same touch target floors, same error language that explains what is missing and why it matters rather than just turning a border red. A system that only holds together on the impressive screens is not a system.

The watch is the clearest test of whether the system actually holds, because it is the surface where the obvious move is the wrong one. Post-op monitoring on the wrist needs seconds, not scrolling.

The refusal matters more than the addition here. A full dashboard on the wrist was explicitly rejected. The watch is glance-only, the crown steps through vitals one card at a time, and anything requiring real attention stays on the phone and tablet where there is room to do it properly. Judgment in a design system shows up in what does not get shipped.

Screens are easy to admire. The thing a medical product team is actually hiring for is tradeoffs, and this project is built to make those legible: why accent is locked out of severity, why an offline chart has to admit it is offline, why unpairing a device is deliberately slower than it needs to be.

It is also why the interactive version exists rather than a set of flat exports. Claims without demos are portfolio theater. The confirm modals really trap focus, the crown really steps through the watch cards, and the components on the dashboard are the same ones documented in the system with their do and don't rules attached.

The most useful outcome is what happens to the next feature. Because the language is defined once, a new surface starts from tokens and existing patterns instead of a blank canvas, which is the difference between a design system as documentation and a design system as the thing that lets an organization scale without its product fragmenting underneath it.

That is the argument here. Not prettier UI, but a scalable clinical language, and the judgment to know which rules are not allowed to bend.