Handoff

A designer opens the running app, hits record, and talks while moving the cursor around. Handoff watches the DOM, works out what they were pointing at, resolves it against the token system, and emits a list of file-anchored changes — instead of an eight-minute Loom nobody scrubs through.

The actual problem

Design feedback is lossy in one specific way: spoken feedback is full of deixis. “This here.” “That one.” “Too tight.” Those words only mean anything paired with where the cursor was and what was on screen at that second. Video preserves both and makes them unsearchable. Text preserves neither.

So Handoff doesn’t ask a vision model to guess what “this card” meant. It reads document.elementFromPoint(x, y) at that timestamp and gets the actual element, its computed styles, and its source file.

The hover inspector

Then it inverts the problem. Instead of the designer saying something vague and the AI inferring intent, the designer reads the truth off the screen and states a delta:

ProductCard › Title              src/components/ProductCard.tsx:34
  Size      12px    text-xs
  Weight    600     font-semibold
  Color     #111827 text-primary
  Radius    10px    ⚠ no token
                    nearest: radius-md (8px)

“this is twelve, let’s make it sixteen”

Every value appears twice — raw, then token. That double column is the whole trick. Designers speak in pixels because that’s how eyes work; the system records in tokens because that’s what merges cleanly. And when a value has no token behind it, the inspector says so and names the nearest one — which turns “the radius looks off” into a drift report you can act on.

Output

Each utterance becomes a structured change with the quote that produced it, the element, the source file and line, the property, and the before/after — grouped into a report with counts of changes, drift, and notes. It’s a diff proposal, not a transcript.