mobile-design

Guide mobile-first UI decisions for iOS and Android apps.

Updated Mar 24, 2026
One-click install
npx skills add https://github.com/Icebane84/Synarche_Workshop --skill mobile-design-icebane84
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: mobile-design
Source: https://github.com/Icebane84/Synarche_Workshop/tree/main/.agent/skills/design/mobile-design
Command: npx skills add https://github.com/Icebane84/Synarche_Workshop --skill mobile-design-icebane84

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires python, and includes scripts (resource) and references (resource) components.

What problem does it solve?

This skill prevents mobile UX from becoming an unreliable, AI-default “desktop in disguise” by enforcing touch-first thinking and performance-aware design decisions for iOS and Android.

Core Features & Use Cases

  • Touch-first interaction design: thumb zone placement, touch target sizing, gesture discoverability, and haptic feedback guidance.
  • Mobile performance decisioning: list virtualization, animation constraints (transform/opacity, native driver), and memory/battery considerations.
  • Platform-convention alignment: iOS Human Interface Guidelines and Android Material 3 norms for typography, color, navigation, and components.

Quick Start

Use the mobile-design skill to plan and validate an iOS/Android mobile screen by answering the required questions for platform, framework, navigation, state, offline needs, and target devices.

Frequently Asked Questions about mobile-design

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

FAQPage Schema
How do I design mobile UX that feels native on both iOS and Android?

Designing native-feeling mobile UX requires aligning with iOS Human Interface Guidelines and Android Material 3 conventions for typography, color, and navigation. This skill enforces platform-specific UI decisions and touch-first interaction patterns to prevent desktop-like interfaces.

What is touch-first interaction design and how does it affect thumb zone placement?

Touch-first interaction design prioritizes thumb zone placement, touch target sizing, and gesture discoverability. It ensures mobile screens are operable with one hand by enforcing proper haptic feedback guidance and touch psychology principles.

How do I plan mobile screens for React Native or Flutter projects?

Plan mobile screens by answering required questions for platform, framework, navigation, state, offline needs, and target devices. This skill provides a checklist-style workflow that validates mobile UX decisions across React Native, Flutter, and native projects.

Does this skill handle mobile performance constraints like list virtualization and animation?

Yes, mobile performance decisioning covers list virtualization, animation constraints using transform/opacity with native drivers, and memory/battery considerations. These constraints ensure mobile apps remain fast and responsive under heavy interaction loads.

Do I need Python to use the mobile design skill?

Yes, Python is a required dependency for running the skill's scripts. The skill uses Python-based components to generate operational instructions and validate mobile UX checkpoints.