Design Handoff
技能 活跃Generate developer handoff specs from a design. Use when a design is ready for engineering and needs a spec sheet covering layout, design tokens, component props, interaction states, responsive breakpoints, edge cases, and animation details.
To streamline the process of translating design into actionable developer specifications, ensuring clarity and completeness for engineering teams.
功能
- Generate visual specifications (measurements, tokens, breakpoints)
- Generate interaction specifications (clicks, states, animations)
- Generate content specifications (limits, truncation, states)
- Detail edge cases and accessibility notes
- Output structured markdown specification
使用场景
- Use when a design is ready for engineering handoff.
- Use when needing to document component props, interaction states, and responsive behavior.
- Use when converting Figma designs or descriptions into detailed spec sheets.
- Use to ensure all states (loading, error, empty) are clearly defined for developers.
非目标
- Creating the design itself.
- Writing the actual code based on the spec.
- Managing the project tracking or ticketing system (though it can link to them).
Trust
- warning:Issues AttentionIn the last 90 days, 29 issues were opened and 4 were closed, indicating a slow response rate from maintainers.
安装
请先添加 Marketplace
/plugin marketplace add anthropics/knowledge-work-plugins/plugin install design@knowledge-work-plugins质量评分
类似扩展
Ornament Style Modern
100Design ornamental patterns using modern and speculative aesthetics with colorblind-accessible color scales. Breaks free from historical period constraints to explore cyberpunk, solarpunk, biopunk, brutalist, vaporwave, and other contemporary genres. Includes CVD (Color Vision Deficiency) awareness and perceptually uniform scales (viridis, cividis, inferno). Use when creating ornamental designs in modern or genre-specific aesthetics, designing patterns that must be colorblind-accessible, or exploring hybrid motifs combining historical ornament with contemporary visual language.
Design Workflow
100Anti-AI-generic design guidelines. Use when creating UI prototypes, reviewing designs for generic AI patterns, or setting up a project design system.
Macos Design
100Design and build native-feeling macOS application UIs. Use this skill whenever the user asks to create a desktop app, macOS app, Mac-style interface, Apple-style UI, system utility, or anything that should look and feel like a native Mac application. Also trigger when users mention "native feel", "desktop app design", "Apple design patterns", "sidebar layout", "traffic lights", or want to build tools/utilities that feel like they belong on macOS. This skill covers layout, composition, interaction patterns, animations, light/dark mode, and all the subtle details that make an app feel like Apple built it.
MacOS 设计指南
100Apple Human Interface Guidelines for Mac。用于构建使用 SwiftUI 或 AppKit 的 macOS 应用、实现菜单栏、工具栏、窗口管理或键盘快捷键时使用。在涉及 Mac UI、桌面应用或 Mac Catalyst 的任务上触发。
Type Audit
100Typography-only audit covering font selection, type scale, readability, hierarchy, performance
Component Audit
100Component consistency audit covering state coverage, hierarchy, patterns