Skills
.Work. You
Rest

ui-design-handoff-annotation

Community

Streamline UI design handoff.

Design & Creative#design system#ui design#ui ux#developer handoff#design handoff#asset annotation
Authorjunchenghuo
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill automates the process of preparing UI design assets for development, ensuring clarity and consistency in design handoffs.

Core Features & Use Cases

  • Asset Specification: Generates clear specifications for slicing, naming conventions, and export settings.
  • State & Interaction Annotation: Adds necessary annotations for component states and user interactions.
  • Developer Handoff: Outputs guides for front-end integration and design token mapping.
  • Use Case: A UI designer can use this skill to quickly generate a comprehensive handoff package for a new set of app screens, including all necessary specifications and annotations, ensuring developers have all the information they need to implement the design accurately.

Quick Start

Use the ui-design-handoff-annotation skill to generate design specifications for the provided UI mockups.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: ui-design-handoff-annotation
Download link: https://github.com/junchenghuo/openclaw-biz-agent/archive/main.zip#ui-design-handoff-annotation

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.