Overview
What it is
A ChatGPT prompt that converts a described or pasted Figma frame into a dev-ready spec with states, tokens, behavior, and accessibility notes.
When to use it
At design → engineering handoff for any non-trivial component.
Who it’s for
Designers preparing handoffs, and engineers consuming them.
Expected output
A markdown spec with states table, token references, interactions, and a11y notes.
Setup instructions
- Open ChatGPT.
- Paste the prompt as a project instruction.
- Drop in screenshots or frame descriptions.
Usage
Good inputs
- • Frame screenshot
- • List of states
- • Any motion or behavior notes
Example prompts
- Write a spec for this new MemberCard with default, hover, selected, and disabled states.
Expected outputs
- • A 1-page spec ready to attach to a Linear ticket.
Tips & limitations
- • Always reference design tokens, not raw hex.
- • Include keyboard interaction expectations.
Tags
#design
#handoff
#spec