skillboardUpdated every 6 hours
skillboardPrepare designs for development handoff. Document specifications, interactions, and assets to enable efficient development and maintain design quality.
Design handoff bridges design and development, ensuring developers have all information needed to implement designs accurately and efficiently.
Minimal working example:
Design Handoff Package:
Overview:
- Feature description
- User flows
- Key interactions
- Platform (web, iOS, Android)
Screens & Components:
- All screen designs
- Responsive variants (mobile, tablet, desktop)
- All component states (default, hover, focus, disabled, error)
- Dark mode variants (if applicable)
Specifications:
- Typography (font, size, weight, line-height)
- Spacing & layout (padding, margin, gaps)
- Colors (hex values, opacity)
- Shadows & elevations
- Border radius
- Animations & transitions
Interactions:
- Click/tap behaviors
- Hover states
// ... (see reference guides for full implementation)
Detailed implementations in the references/ directory:
| Guide | Contents | |---|---| | Developer-Friendly Documentation | Developer-Friendly Documentation | | Handoff Checklist | Handoff Checklist | | Design-Dev Collaboration | Design-Dev Collaboration |
Copy a source-pinned command for your client. You run it yourself.
Destination: .claude/skills/design-handoff · pinned to the source commit
git clone https://github.com/aj-geddes/useful-ai-prompts.git
cd useful-ai-prompts
git checkout 3f5182cfd739fc113f4af5244a1cf342ad7f7911
mkdir -p ".claude/skills/design-handoff"
cp -r "skills/design-handoff" ".claude/skills/design-handoff"Review the source before running. This copies files into your project; it is not a one-click install and does not verify runtime safety.
Scanner static-checks@0.1.0 · commit 3f5182cfd739. Static checks cannot prove runtime safety – review the source and the exact diff before installing. How checks work.
No static rules matched. This is not a safety guarantee.