skills.rest
majiayu000
majiayu000COMMUNITY
Explore all skills by this author →
GitHub

app-ui-design

Provide mobile app UI design guidance for iOS and Android.

258|26|Updated Dec 9, 2025
Search Tags:#ui#accessibility#iOS#mobile#Android#wcag#design-system
One-click install
npx skills add https://github.com/majiayu000/claude-arsenal --skill app-ui-design
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: app-ui-design
Source: https://github.com/majiayu000/claude-arsenal/tree/main/skills/app-ui-design
Command: npx skills add https://github.com/majiayu000/claude-arsenal --skill app-ui-design

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Designing mobile interfaces that are accessible, platform-native, and visually consistent is challenging. This Skill provides guidelines for iOS and Android, accessibility, and design system fundamentals.

Core Features & Use Cases

  • Platform guidelines: Consistent iOS and Android patterns.
  • Accessibility-first: WCAG 2.2 AA alignment and inclusive design.
  • Design system foundation: Tokens, typography, spacing, and components.

Quick Start

Define a design system with color tokens, typography scale, and a reusable Button component for both iOS and Android.

Frequently Asked Questions about app-ui-design

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I design accessible mobile interfaces that meet WCAG 2.2 AA standards?▼

WCAG 2.2 AA accessibility for mobile requires meeting contrast ratios (4.5:1 for text), touch targets of at least 44×44 dp, semantic color usage, and keyboard navigation support. This Skill provides audits and guidance to align iOS and Android designs with these standards, ensuring inclusive experiences across both platforms.

What's the best way to build a design system for iOS and Android?▼

A tokenized design system defines reusable components, typography scales, spacing rules, and color tokens once, then applies them consistently across iOS and Android. This approach ensures platform-native adherence to Material Design 3 and Human Interface Guidelines while reducing duplication and maintenance overhead.

How do I align my mobile UI with Material Design 3 and Apple's Human Interface Guidelines?▼

Material Design 3 and Human Interface Guidelines set platform-specific patterns for navigation, typography, elevation, and interaction. This Skill maps design decisions to each platform's standards, covering dark mode, color semantics, and spacing conventions so your iOS and Android apps feel native and consistent.

Can I use the same design tokens and components for both iOS and Android?▼

Yes. Tokenized design systems separate platform-agnostic values (colors, spacing, typography) from platform-specific implementations. You define tokens once, then customize component behavior and visual treatment per platform, ensuring consistency while respecting Material Design 3 and HIG conventions.

What accessibility issues should I audit before launching a mobile app?▼

Mobile accessibility audits check contrast ratios, touch-target sizes, color-only information indicators, keyboard support, and semantic structure. This Skill guides WCAG 2.2 AA audits for iOS and Android, identifying common failures in typography, spacing, and interactive elements.

How do color theory and 2025 design trends apply to mobile UI?▼

Modern mobile design leverages color psychology for usability, accessibility-compliant palettes, and semantic meaning. This Skill incorporates current 2025 trends alongside timeless principles, ensuring your iOS and Android interfaces remain both accessible and visually current.

Related Skills

Explore More Design & Creative Skills→
tyronerosstyroneross
1

mobile-web-ui

Enforce responsive design and touch target accessibility for mobile web interfaces.

Community
Intermediate
erichowenserichowens
181

web-design-expert

Generate distinctive web designs and brand identities with WCAG accessibility.

Community
Advanced
MarcoAntoliniMarcoAntolini
1

prototype

Prototype business logic and UI designs through interactive terminal tools.

Community
Intermediate
gelsonsimoesgelsonsimoes

mobile-design

Provide mobile design guidelines for iOS and Android UX and accessibility.

Community
Advanced