How do you hand off designs to engineering?

Direct answer

What a strong answer covers

How it works

Handoff works when it is a conversation that starts before the design is final and continues until the feature ships. The designer provides linked flows rather than isolated screens, responsive behaviour at the agreed breakpoints, references to design-system components and tokens instead of raw values, every state including empty, loading, error, and edge cases, real content and copy, accessibility notes such as focus order and labels, exported assets, and acceptance examples engineers can test against. Engineers review the design early for feasibility, the designer reviews the implementation as soon as a build exists, and deviations are decided together and recorded.

Example

For a new onboarding flow the designer shared a Figma prototype with all six steps linked, annotations mapping each element to the system’s components, an empty state for users with no data, an error state for a failed import, copy in the file, and a checklist of acceptance examples. The engineer flagged in the first review that step four needed an API that did not exist, and the flow was reordered. The designer reviewed the staging build twice and logged three spacing deviations, two of which were accepted as tokens the system lacked.

Common mistakes

• Handing over static screens and disappearing until launch.
• Specifying raw pixel values that ignore the design system.
• Omitting empty, loading, and error states and leaving engineers to invent them.

A useful answer structure

Answer from your own work.

Do not memorise a script: use only examples you can explain honestly in follow-up questions.