Can I use this for both web and mobile apps?

Yes, it intelligently adapts prompts based on the target platform, whether it is a native mobile app or a responsive web application.

Does it handle accessibility and edge cases?

Yes, comprehensive output includes WCAG compliance guidelines, screen reader considerations, and states for loading or error handling.

What design systems does this skill support?

The skill supports iOS Native (HIG), Material Design 3, WeChat Work (WeUI), and Ant Design Mobile, allowing for platform-specific accuracy.

How does this improve the code Claude generates?

By providing Claude with structured specifications, component names, and design tokens, the generated code is significantly more accurate and adheres to professional design standards.

Can I customize the level of detail in the prompt?

Yes, you can request three different verbosity levels: Brief for quick references, Standard for development, and Comprehensive for full documentation.

UI Prototype Prompt Generator

Name: UI Prototype Prompt Generator
Author: chaorenex1

bychaorenex1

•

Design Tools

Generates structured, production-ready UI/UX design prompts for various mobile and web design systems including iOS, Material Design, and Ant Design.

About

The UI Prototype Prompt Generator is a specialized tool for Claude Code designed to bridge the gap between high-level application concepts and production-grade frontend implementation. It automates the creation of comprehensive design briefs, providing detailed specifications for component hierarchies, interaction states, and design tokens across multiple systems like WeChat Work, iOS Native, Material Design 3, and Ant Design Mobile. This skill is essential for developers and designers who need consistent, high-fidelity UI documentation and structured AI prompts that lead to accurate code generation.

Key Features

Comprehensive generation of design tokens, including color scales and typography
1 GitHub stars
Adjustable verbosity levels from brief references to comprehensive technical specs
Automated component mapping across different design frameworks
Detailed documentation of user flows, edge cases, and accessibility requirements
Multi-system support for iOS HIG, Material Design 3, WeChat Work, and Ant Design

Use Cases

Rapidly prototyping cross-platform mobile interfaces with design system consistency
Generating detailed design handoff documentation for development teams
Creating high-fidelity AI prompts for frontend code generation

About

Key Features

Comprehensive generation of design tokens, including color scales and typography
1 GitHub stars
Adjustable verbosity levels from brief references to comprehensive technical specs
Automated component mapping across different design frameworks
Detailed documentation of user flows, edge cases, and accessibility requirements
Multi-system support for iOS HIG, Material Design 3, WeChat Work, and Ant Design

Use Cases

Rapidly prototyping cross-platform mobile interfaces with design system consistency
Generating detailed design handoff documentation for development teams
Creating high-fidelity AI prompts for frontend code generation