mobile-design

Audit mobile implementations for accessibility, performance, and platform conventions.

Updated Feb 19, 2026

Search Tags:#performance #accessibility #ux #mobile-design #platform-guidelines #mobile-design-patterns

Ready to run

npx skills add https://github.com/jonnathan-ls/ai-context-kit --skill mobile-design-jonnathan-ls

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: mobile-design
Source: https://github.com/jonnathan-ls/ai-context-kit/tree/main/skills/mobile-design
Command: npx skills add https://github.com/jonnathan-ls/ai-context-kit --skill mobile-design-jonnathan-ls

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

Mobile teams often struggle to design and implement consistent, accessible, and performant UI across iOS and Android. This guide provides a mobile-design thinking framework, platform-aware patterns, and practical checklists to ensure quality from concept to production.

Core Features & Use Cases

Design thinking protocol that forces context-based decisions before coding.
Platform-specific guidelines for iOS and Android including typography, color, navigation, and motion.
A reusable audit script (scripts/mobile_audit.py) to validate code against best practices and catch common mobile anti-patterns.
Real-world templates and decision trees for framework choice, state management, and responsive layouts.

Quick Start

Run the mobile-audit.py script to validate your app against the mobile design checklist.

Frequently Asked Questions about mobile-design

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

FAQPage Schema

How do I audit mobile UI implementations for accessibility and platform conventions?▼

Run the mobile audit script to validate your app code against a comprehensive checklist covering touch targets, navigation, typography, color systems, and offline considerations for iOS and Android.

Does the mobile design audit work with React Native and Flutter?▼

The audit script evaluates framework choice decision trees and checks responsive layouts, state management, and platform-specific patterns across React Native, Flutter, and native iOS/Android implementations.

What mobile design patterns does the audit check for?▼

It validates touch targets, navigation flows, typography scales, color systems, offline states, and platform-specific motion guidelines, providing actionable issue reports with severity levels and recommended fixes.

How do I enforce mobile-first design thinking before coding?▼

Use the included design thinking protocol and reusable checklists to make context-based design decisions before implementation, covering framework selection, state management strategies, and responsive layout planning.

Why does my mobile app fail accessibility and performance checks on iOS and Android?▼

Common causes include non-compliant touch targets, inconsistent navigation patterns, improper typography and color systems, and lack of offline considerations. The audit script identifies these anti-patterns with severity and context.

Can I catch mobile anti-patterns automatically in my codebase?▼

The reusable audit script automatically validates your app code against mobile design checklists, detecting anti-patterns related to accessibility, performance, and platform conventions across React Native, Flutter, and native code.