Design Handoff
Skill AktivGenerate 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.
Funktionen
- 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
Anwendungsfälle
- 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.
Nicht-Ziele
- 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.
Installation
Zuerst Marketplace hinzufügen
/plugin marketplace add anthropics/knowledge-work-plugins/plugin install design@knowledge-work-pluginsQualitätspunktzahl
Vertrauenssignale
Ähnliche Erweiterungen
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 Design Guidelines
100Apple Human Interface Guidelines für Mac. Verwenden Sie diese, wenn Sie macOS-Apps mit SwiftUI oder AppKit erstellen, Menüleisten, Symbolleisten, Fensterverwaltung oder Tastenkombinationen implementieren. Löst bei Aufgaben aus, die sich auf Mac-Benutzeroberflächen, Desktop-Apps oder Mac Catalyst beziehen.
Type Audit
100Typography-only audit covering font selection, type scale, readability, hierarchy, performance
Component Audit
100Component consistency audit covering state coverage, hierarchy, patterns