skills.rest
apptolast
apptolastOFFICIAL
Explore all skills by this author →
WebsiteGitHub

mobile-design

Audit mobile UX and performance for iOS and Android apps.

10|1|Updated Jun 22, 2023
Search Tags:#design#architecture#performance#mobile#ios#android#ux
One-click install
npx skills add https://github.com/apptolast/FamilyFilmApp --skill mobile-design-apptolast
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: mobile-design
Source: https://github.com/apptolast/FamilyFilmApp/tree/main/.agents/skills/mobile-design
Command: npx skills add https://github.com/apptolast/FamilyFilmApp --skill mobile-design-apptolast

SYSTEM DOCUMENTATION & REQUIREMENTS

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

What problem does it solve?

This Skill addresses the common pitfalls in mobile development where desktop-centric design patterns lead to poor performance, frustrating touch interactions, and platform-inconsistent user experiences.

Core Features & Use Cases

  • Mobile-First UX Audit: Evaluates touch targets, thumb zone accessibility, and gesture logic to ensure apps feel native and intuitive.
  • Performance Optimization: Provides rigorous patterns for 60fps rendering, memory management, and battery-conscious design in React Native and Flutter.
  • Platform-Specific Guidance: Offers deep dives into iOS Human Interface Guidelines and Android Material Design 3 to ensure your app respects platform conventions.
  • Use Case: Use this Skill when you are unsure whether to use a Drawer or Tab navigation for a new cross-platform app, or when you need to debug list performance issues in a complex feed.

Quick Start

Run the mobile audit script on your current project directory to identify potential UX and performance bottlenecks.

Frequently Asked Questions about mobile-design

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

FAQPage Schema
How do I optimize mobile app performance to maintain 60fps rendering in React Native and Flutter?▼

To optimize mobile app performance for 60fps rendering, apply rigorous patterns for memory management and battery-conscious design in React Native and Flutter. This Skill provides specific strategies to debug complex feed list performance issues and eliminate rendering bottlenecks.

What is the best way to choose between Drawer and Tab navigation for a cross-platform mobile app?▼

Choosing between Drawer and Tab navigation requires evaluating touch-psychology standards, thumb zone accessibility, and platform-specific UI conventions. This Skill facilitates decision-making for cross-platform apps by comparing navigation patterns against iOS Human Interface Guidelines and Android Material Design 3.

Does this mobile design guidance support both iOS Human Interface Guidelines and Android Material Design 3?▼

Yes, this mobile design guidance supports both iOS Human Interface Guidelines and Android Material Design 3. It offers deep dives into platform-specific UI conventions to ensure your cross-platform app respects native touch interactions and platform consistency.

How do I audit my current project for mobile-first UX and touch target accessibility issues?▼

To audit your project for mobile-first UX issues, run the provided mobile audit script on your project directory. This evaluates touch targets, thumb zone accessibility, and gesture logic to identify potential UX bottlenecks and ensure apps feel native.

Why does my desktop-centric design pattern cause poor performance and frustrating touch interactions on mobile?▼

Desktop-centric design patterns cause poor performance and frustrating touch interactions because they ignore mobile-first UX principles and touch-psychology standards. This Skill addresses these common mobile development pitfalls by enforcing touch-first architecture and battery-efficient practices.

Related Skills

Explore More Software Engineering Skills→
LowyShinLowyShin
33

mobile-app

Guide cross-platform mobile app development with React Native, Flutter, and Expo.

Community
Advanced
tuyenhttuyenht

react-native-performance

Optimize React Native and Expo apps for 60fps performance and crash prevention.

Community
Advanced
benaorbenaor

react-performance

Profile React Native apps to identify and optimize rendering, startup, and memory bottlenecks.

Community
Advanced
parallax-ai-llcparallax-ai-llc
29

orchestrator-designer

Generate platform-aware design specifications and JSON design tokens for the Claude Orchestrator UI.

Official
Advanced