Design Handoff

This bridges the gap between design and development by helping you create complete handoff documentation. Use it when you're about to start implementation and need to document specs, interactions, and all component states. It walks you through the essentials: responsive variants, typography specs, spacing, colors, animations, and those edge cases developers always have to ask about anyway. The checklist format is practical, covering everything from export requirements to accessibility considerations. Honest take: if you've ever had a designer disappear after tossing mockups over the wall, or been that designer who got pinged constantly during dev, this gives you the structure to do it right the first time.

skills.sh installs: 450
GitHub stars: 379
last updated: Aug 21, 2026

View on GitHub

Install

$ npx -y skills add aj-geddes/useful-ai-prompts --skill design-handoff --agent claude-code

Installs into .claude/skills of the current project.

Files

Overview

Design handoff bridges design and development, ensuring developers have all information needed to implement designs accurately and efficiently.

When to Use

Before development starts
Feature completion in design
Component library updates
Design system changes
Iterative refinement handoff

Quick Start

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

SKILL.md on GitHub

Details

Repository: github.com/aj-geddes/useful-ai-prompts
Categories: Code Review & Quality, AI & Agent Building, Design & UI/UX
First seen: Jun 3, 2026

huashu-weread-advisoralchaincyf/huashu-weread微信读书高阶顾问。在底层 weread skill 的原子 API 之上，提供四类工作流：基于已读做个性化进阶推荐（advisor）、给方向规划入门到前沿的阶梯书单（path）、把零散划线想法提炼成读书笔记总结（alchemy）、做季度/年度阅读复盘并生成可发朋友圈/公众号的文章（review）。核心方法是「书架 + 447skills.sh installs

kiro-skillfeiskyer/claude-code-settingsInteractive feature development workflow from idea to implementation. Creates requirements (EARS format), design documents, and task lists. Triggers: "kiro", ".442skills.sh installs

web-design-guidelinesvercel-labs/agent-evalReview UI code for Web Interface Guidelines compliance. Use when asked to "review my UI", "check accessibility", "audit design", "review UX", or "check my site 440skills.sh installs

database-schema-designsecondsky/claude-skillsDatabase schema design for PostgreSQL/MySQL with normalization, relationships, constraints. Use for new databases, schema reviews, migrations, or encountering m437skills.sh installs

ios-designpproenca/dot-skillsSwiftUI interface implementation patterns aligned with the iOS 26 / Swift 6.2 clinic modular MVVM-C architecture, grounded in Creative Selection and Design Like436skills.sh installs

wordpress-plugin-fundamentalsbobmatnyc/claude-mpm-skillsModern WordPress plugin development with PHP 8.3+, OOP architecture, hooks system, database interactions, and Settings API434skills.sh installs

Design Handoff

Install

Files

Design Handoff

Table of Contents

Overview

When to Use

Quick Start

Details

More from aj-geddes/useful-ai-prompts

Recommended