skills.rest
lionheartapp
lionheartappCOMMUNITY
Explore all skills by this author →
GitHub

mobile-design

Enforce mobile-first UX patterns across iOS and Android interfaces.

Updated Feb 14, 2026
Search Tags:#performance#accessibility#mobile#ios#android#ux#design-system
One-click install
npx skills add https://github.com/lionheartapp/lionheart-ops --skill mobile-design-lionheartapp
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: mobile-design
Source: https://github.com/lionheartapp/lionheart-ops/tree/main/.agents/skills/mobile-design
Command: npx skills add https://github.com/lionheartapp/lionheart-ops --skill mobile-design-lionheartapp

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

Mobile design discipline prevents desktop-centric thinking and ensures platform-appropriate UX across iOS and Android.

Core Features & Use Cases

  • Comprehensive mobile design thinking framework covering touch targets, offline behavior, performance budgets, typography, color, accessibility, and platform-specific patterns.
  • Practical decision trees, platform checklists, and anti-pattern guidance to accelerate mobile product work.
  • Real-world use cases include shipping mobile UI for consumer apps with robust offline support and accessible typography.

Quick Start

Apply the mobile design system to a new screen by auditing touch targets, ensuring dark mode support, and enforcing platform-appropriate navigation patterns before coding.

Frequently Asked Questions about mobile-design

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

FAQPage Schema
How do I enforce mobile-first UX patterns for both iOS and Android?▼

Enforce mobile-first UX patterns by auditing touch targets, navigation structures, and platform-specific interaction guidelines to align product interfaces with native iOS and Android conventions.

What's the best way to design offline behavior for mobile applications?▼

Design offline behavior by implementing robust offline support frameworks that cache critical data and maintain core functionality, aligning mobile product work with performance budgets and accessibility constraints.

How do I prevent desktop-centric thinking when designing mobile screens?▼

Prevent desktop-centric thinking by applying a comprehensive mobile design discipline framework that evaluates typography, color, and touch interactions against platform-specific checklists before coding begins.

Does this mobile design approach cover accessibility and performance budgets?▼

Yes, this mobile design approach explicitly satisfies requirements for performance optimization and accessibility, integrating performance budgets and accessible typography checks into the core architecture decision process.

What are the limitations of using a single cross-platform design system for mobile UI?▼

A single cross-platform design system risks violating platform conventions if it ignores distinct iOS and Android navigation patterns, requiring decision trees and anti-pattern guidance to enforce appropriate native interactions.

Can I use this framework to audit existing mobile screens for platform convention compliance?▼

Yes, you can audit existing mobile screens by applying practical platform checklists to evaluate touch targets, dark mode support, and platform-appropriate navigation patterns against established mobile design systems.

Related Skills

Explore More Design & Creative Skills→
HuijiroHuijiro

impeccable-adapt

Adapt existing designs across screen sizes and input methods.

Community
Advanced
joneqianjoneqian

ui-ux-pro-max

Translate design goals into UI systems with tokens, components, and guidelines.

Community
Advanced
josephblaisjosephblais

design-system

Validate design system tokens against WCAG AA/AAA accessibility standards.

Community
Advanced
StudentCristianStudentCristian

nw-ux-desktop-patterns

Design desktop UI patterns for native and cross-platform apps.

Community
Intermediate