mobile-design

Guide mobile app design decisions for iOS, Android, and cross-platform products.

Updated Apr 4, 2026
One-click install
npx skills add https://github.com/capaas2/Site-teste --skill mobile-design-capaas2
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: mobile-design
Source: https://github.com/capaas2/Site-teste/tree/main/.agent/skills/mobile-design
Command: npx skills add https://github.com/capaas2/Site-teste --skill mobile-design-capaas2

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill helps you make better mobile product and UX decisions without falling back on generic desktop assumptions. It guides you to design for touch, battery, offline use, platform conventions, and real-world device constraints.

Core Features & Use Cases

  • Mobile-first design thinking: Forces context-based decisions instead of memorized defaults.
  • Platform-specific guidance: Helps you adapt behavior for iOS, Android, or cross-platform apps.
  • Performance and navigation best practices: Covers list virtualization, animation efficiency, back behavior, deep linking, and state management.
  • Use Case: Use this Skill when planning a React Native, Flutter, SwiftUI, or Kotlin app and you need to choose navigation patterns, storage strategy, and interaction models that fit mobile constraints.

Quick Start

Apply the mobile-design skill to review my app idea for platform choice, navigation, touch interactions, performance risks, and offline considerations.

Frequently Asked Questions about mobile-design

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

FAQPage Schema
How do I design navigation patterns for a cross-platform mobile app?

Design mobile navigation by selecting patterns that respect platform conventions for iOS and Android, ensuring back behavior, deep linking, and state management fit cross-platform frameworks like React Native and Flutter.

What is mobile-first design thinking and when do I need it?

Mobile-first design thinking forces context-based UX decisions for touch, battery, and offline use instead of generic desktop assumptions. You need it when planning mobile apps to respect real-world device constraints.

How do I handle mobile app performance risks like list virtualization and animation efficiency?

Address mobile app performance by applying platform-aware choices for list virtualization and animation efficiency. Optimize touch interactions and state management to respect real-world hardware limits on iOS and Android.

Does this mobile design approach work for both React Native and Flutter?

Yes, this mobile design approach works for React Native and Flutter by providing platform-specific guidance. It helps adapt behavior, navigation, and offline constraints for both cross-platform frameworks and native SwiftUI or Kotlin apps.

What's the best way to plan offline behavior and storage strategy for mobile apps?

Plan offline behavior by choosing storage strategies and interaction models that fit mobile constraints. Design backend constraints and device-specific UX to ensure the app functions properly without constant connectivity.

Why does my mobile app UX feel like a desktop application?

Your mobile app UX feels like a desktop application because of generic assumptions. Apply mobile-first design thinking to make context-based decisions for touch interactions, platform conventions, and real-world hardware limits.