skills.rest
ntdev204
ntdev204COMMUNITY
Explore all skills by this author →
WebsiteGitHub

mobile-design

Guide mobile-first design for iOS and Android with React Native and Flutter.

Updated Aug 23, 2026
Search Tags:#ui#mobile design#ios#android#flutter#react native#ux
One-click install
npx skills add https://github.com/ntdev204/rai_ws --skill mobile-design-ntdev204
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: mobile-design
Source: https://github.com/ntdev204/rai_ws/tree/main/.agent/skills/mobile-design
Command: npx skills add https://github.com/ntdev204/rai_ws --skill mobile-design-ntdev204

SYSTEM DOCUMENTATION & REQUIREMENTS

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

What problem does it solve?

This Skill addresses the complexities of mobile-first design, ensuring applications are intuitive, performant, and adhere to platform conventions for iOS and Android.

Core Features & Use Cases

  • Platform-Specific Design: Tailors design decisions for iOS (HIG) and Android (Material Design).
  • Performance Optimization: Guides on efficient rendering, animations, and memory usage.
  • Interaction Design: Focuses on touch targets, gestures, and user psychology (Fitts' Law, Thumb Zone).
  • Use Case: When building a new React Native app, use this Skill to ensure the navigation, touch targets, and performance optimizations are correctly implemented for both iOS and Android users.

Quick Start

Use the mobile design skill to audit the design principles for a React Native app targeting both iOS and Android.

Frequently Asked Questions about mobile-design

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

FAQPage Schema
What are mobile-first design principles for touch interaction?▼

Mobile-first design principles for touch interaction focus on Fitts' Law and thumb zone accessibility to ensure touch targets, gestures, and user psychology are correctly optimized for mobile device screens.

How do I apply iOS and Android platform-specific design conventions?▼

To apply iOS and Android platform-specific design conventions, tailor design decisions to match iOS Human Interface Guidelines (HIG) and Android Material Design standards for navigation and UI rendering.

What is the best way to optimize React Native app performance and UI rendering?▼

The best way to optimize React Native app performance is by applying efficient UI rendering techniques, memory usage management, and animation optimizations tailored for both iOS and Android platforms.

How do I design navigation for a Flutter app targeting both iOS and Android?▼

Design navigation for a Flutter app by implementing platform-specific conventions and performance optimization techniques to ensure intuitive user experience and efficient rendering across both mobile platforms.

Does this mobile design guidance cover both iOS and Android UI conventions?▼

Yes, this mobile design guidance covers both iOS and Android UI conventions by comprehensively addressing platform-specific design rules, touch interaction psychology, and performance optimization for mobile devices.

Why should I use thumb zone accessibility when building a mobile UX?▼

Use thumb zone accessibility when building a mobile UX because it ensures touch targets and interaction points are easily reachable, improving overall application usability and adhering to touch interaction psychology.

Related Skills

Explore More Design & Creative Skills→
Andrejr82Andrejr82

mobile-design

Guide mobile-first design for iOS and Android with React Native and Flutter.

Community
Advanced
Harmitx7Harmitx7
3

mobile-design

Guide mobile UI design with iOS and Android platform conventions.

Community
Advanced
xaderlagguixaderlaggui
3

app-ui-design

Design accessible mobile UI systems for iOS and Android.

Community
Advanced
heaptracetechnologyheaptracetechnology
13

mobile-ui

Build platform-adaptive mobile UI components across React Native, Flutter, and SwiftUI.

Community
Advanced