mcpField
M
mobile-app-design

mobile-app-design

github.com/podoDesign & UI29186 installsUpdated 1d ago
Repository

About mobile-app-design

mobile-app-design is a design skill with guidance for cross-platform mobile UI and UX decisions. It covers iOS, Android, accessibility, React Native, touch sizing, thumb ergonomics, and adaptive layouts.

Key features

  1. 01iOS Human Interface Guidelines
  2. 02Android Material 3
  3. 03Mobile accessibility guidance
  4. 04React Native practices
  5. 05Touch targets and thumb zones
  6. 06Adaptive phone and tablet layouts

Use cases

  1. 01Reviewing cross-platform mobile layouts
  2. 02Checking mobile accessibility decisions
  3. 03Choosing touch target sizes
  4. 04Planning phone and tablet adaptations

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/podo/design-agent-skills --skill mobile-app-design

After installing, type/mobile-app-designin Claude Code to confirm it loaded.

Bundled filesstub.yaml

Details

From the project README

mobile-app-design

Catalogue stub — full skill: awesome-skills/mobile-app-design

Decision tree

  1. Is the full skill already installed? Check whether the skill at this location still has a das: block:

    • Global: grep -q "^das:" ~/.agents/skills/mobile-app-design/SKILL.md 2>/dev/null && echo "pointer" || echo "installed"
    • Project: grep -q "^das:" .agents/skills/mobile-app-design/SKILL.md 2>/dev/null && echo "pointer" || echo "installed"
    • No das: block → full skill installed, invoke it and proceed
    • das: block present → go to step 2

  2. Detect scope, then install:

    To detect scope:

    [ -e ~/.agents/skills/mobile-app-design ] && echo "global" || echo "project"

    Global (installed with -g):

    npx skills add awesome-skills/mobile-app-design --skill mobile-app-design -g -y

    Project (installed without -g):

    npx skills add awesome-skills/mobile-app-design --skill mobile-app-design -y

    Claude Code: send either command as a chat message starting with ! to run it without leaving the conversation.

Invoke after install

  • Skill name: mobile-app-design
  • Triggers: "mobile app design", "iOS design", "Android design", "touch targets", "thumb zones"

What it does

26,000+ words of mobile UI/UX design guidance. Covers Apple iOS Human Interface Guidelines, Android Material 3, WCAG mobile accessibility, React Native implementation best practices, correct touch target sizing, thumb-zone ergonomics, and adaptive layout patterns for phones and tablets. Use for any cross-platform mobile design decision.

When NOT to use

  • Apple HIG-only work — use apple-hig-skills
  • SwiftUI-specific implementation — use swiftui-patterns
  • Professional mobile UI craft patterns — use mobile-app-ui-design

Comments

Markdown supported