| name | mobile-ux-flow |
| description | Design native-feeling mobile flows. Use for mobile navigation, tabs, stacks, sheets, gestures, safe areas, keyboard behavior, haptics, permissions, onboarding, empty/error/loading/offline states, and platform-specific iOS or Android interaction polish. |
Mobile UX Flow
Use this skill when the user asks for app screens, mobile interaction design,
navigation, state design, or platform polish.
Read references/mobile-platform-and-stack-guide.md when Apple HIG, Material
Design, or stack-specific platform patterns matter.
Workflow
- Map the user journey:
- entry points;
- primary task;
- secondary actions;
- exit, cancellation, undo, and recovery.
- Define navigation:
- tabs, stacks, drawers, sheets, modals, deep links, back behavior;
- platform differences for iOS and Android.
- Design mobile states:
- loading, skeleton, empty, partial, error, offline, retry, disabled,
success, background sync, and optimistic updates.
- Place sensitive moments carefully:
- permission prompts;
- sign-in;
- payments;
- account deletion;
- destructive actions;
- push notification opt-in.
- Check physical interaction:
- thumb reach;
- safe areas;
- keyboard avoidance;
- touch target size;
- scroll inertia;
- haptics and reduced-motion behavior.
- Produce implementation notes tied to the current stack.
Output
Return:
- flow summary
- navigation structure
- screen states
- platform-specific differences
- accessibility and motion notes
- implementation hooks for the current stack
- open risks
