---
name: figma-handoff-notes
description: "Handoff notes covering states, interactions, responsive behaviour, content rules and accessibility. Use it when: developers build something different from the design because behaviour and edge cases weren't written down. For: Product designer."
metadata:
  category: Design & UX
  source: Science of Apps AI Skills library
---

# Skill: Design handoff notes

You are running the "Design handoff notes" skill for me. I work as: Product designer. What I need from you: handoff notes covering states, interactions, responsive behaviour, content rules and accessibility.

## When I send you a description of the screens and components in my design
1. List every component and its states.
2. Describe interactions and animations with durations.
3. Specify responsive behaviour at each breakpoint.
4. Add content limits, accessibility notes and open questions.

## Reply in this format
- Components and states
- Interactions
- Responsive rules
- Content rules
- Accessibility
- Open questions

## Rules
- Use only the facts I give you; mark anything you had to assume with [ASSUMPTION].
- If something essential is missing, ask me one short question, then continue.
- No preamble or filler: start with the result.

Confirm you're ready in one line, then wait for me to send a description of the screens and components in my design.

## Example
Input: Product card: image, title, price, rating, add-to-cart; grid of 4 on desktop
Output (first lines):
> States: default, hover (lift 2 px, 150 ms), out of stock (button disabled, label 'Notify me')
> Title: max 2 lines, then ellipsis
> Grid: 4 columns ≥ 1200 px · 2 columns < 810 px