ui-ux-component-design
CommunityDesign mobile UI components
Design & Creative#ui#accessibility#material design#mobile development#component design#ux#human interface guidelines
AuthorFutureAtoms
Version1.0.0
Installs0
System Documentation
What problem does it solve?
This Skill streamlines the process of designing mobile UI components by providing a structured framework and detailed specifications for both Material Design 3 and Apple HIG.
Core Features & Use Cases
- Component Design Framework: Offers a systematic approach to defining component anatomy, variants, states, and visual specifications.
- Platform Adaptation: Provides guidance on adapting designs for iOS and Android.
- Accessibility Focus: Integrates accessibility checklists and considerations throughout the design process.
- AI/Voice Component Examples: Includes detailed specifications for chat bubbles, voice buttons, audio players, and more.
- Use Case: A developer needs to design a custom "rating" component for a mobile app. They can use this Skill to generate a detailed specification covering its states (empty, filled, half-star), interaction (tap to select), accessibility (screen reader labels), and platform-specific visual treatments.
Quick Start
Generate a complete component specification for a 'user profile card'.
Dependency Matrix
Required Modules
None requiredComponents
references
💻 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-ux-component-design Download link: https://github.com/FutureAtoms/claude-skills-backup/archive/main.zip#ui-ux-component-design Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.