Skip to content
UX Atlas
WorkflowCraft conventionIntermediate

Design Handoff

Getting a design built correctly, which works better as a conversation than as a document.

Definition

Handoff is the transfer of design intent to implementation. The strongest predictor of a good outcome is whether engineers were involved before the design was finished, not the quality of the specification afterwards.

Craft convention. True because the industry converged on it. Breaking it costs familiarity, not correctness.

On this page
  1. Definition
  2. What a design has to specify beyond the happy path
  3. Reducing rework
  4. Continue from here

What a design has to specify beyond the happy path

  • Every interactive state: hover, focus, active, disabled, loading, selected, error.
  • Empty, loading and error states for every data-driven region.
  • Behaviour at the smallest and largest supported widths.
  • What happens with the longest realistic content, and with text that has been translated.
  • Keyboard behaviour and focus order for anything custom.
  • Motion: what animates, for how long, and what happens under reduced motion.
  • Which existing components and tokens should be used, so nothing is rebuilt.

Reducing rework

  • Review the implementation in the browser, not against a screenshot.
  • Agree who decides when the two disagree, before it happens.
  • Design with real content and real data, so length and edge cases surface early.
  • Keep the design source and the implementation referencing the same tokens.

Continue from here

Each link says what the connection is, so you can tell a principle from an alternative from a thing people mix this up with.

Often used with

These usually appear in the same screen or the same decision.

Short definition

The one-paragraph version, for when that is all you need.

Related concept

Connected closely enough to change how you apply this.