skills.rest
ceorkm
ceorkmCOMMUNITY
Explore all skills by this author →
GitHub

mobile-app-ui-design

Translate mobile app UI/UX problems into structured specifications for screens, flows, and components.

216|21|Updated Feb 15, 2026
Search Tags:#react-native#ui-design#flutter#design-system#mobile-ui#emotional-design
One-click install
npx skills add https://github.com/ceorkm/mobile-app-ui-design --skill mobile-app-ui-design
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: mobile-app-ui-design
Source: https://github.com/ceorkm/mobile-app-ui-design/tree/main
Command: npx skills add https://github.com/ceorkm/mobile-app-ui-design --skill mobile-app-ui-design

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This skill guides teams to design high-quality, intuitive, and visually coherent mobile app interfaces, reducing guesswork and misalignment between design and implementation.

Core Features & Use Cases

  • 5-step design process guiding context, structure, visuals, emotion, and polish
  • Industry conventions and emotional-design references for cross-domain apps
  • Implementation guidance for React, Tailwind, and component patterns
  • Use cases: designing screens, onboarding flows, navigation, and reusable UI components

Quick Start

Ask the skill to design a mobile app screen and generate a complete UI/UX spec and reusable component patterns.

Frequently Asked Questions about mobile-app-ui-design

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

FAQPage Schema
What is the best way to structure a mobile app UI design specification?▼

Designing mobile app onboarding flows requires mapping user context into structured navigation paths and reusable UI components. This skill guides the creation of cross-platform flow specifications with emotional-design references to ensure intuitive user journeys.

Can I use this to generate UI component patterns for React Native and Flutter?▼

Yes, you can generate reusable component patterns for React Native, Flutter, and SwiftUI. The skill provides implementation guidance for typography, color, spacing, and visuals to ensure visually coherent interfaces across these frameworks.

How do I apply emotional design to a cross-domain mobile app interface?▼

Applying emotional design to mobile interfaces involves integrating industry conventions with specific visual and interaction polish. This skill provides reference patterns to inject emotional resonance into your UI specs during the final design stages.

Does this skill help with accessibility and spacing guidelines for mobile UI?▼

Yes, it addresses accessibility and consistency by providing implementation guidance for typography, color, and spacing. These rules are embedded within the structured UI specification to align design and implementation without guesswork.

Related Skills

Explore More Design & Creative Skills→
infinith4infinith4
1

ui-spec

Generate UI screen specifications in Markdown from design goals and component requirements.

Community
Advanced
sitharaj88sitharaj88
1

generate-screen

Generate mobile screens for Jetpack Compose, SwiftUI, React Native, and Flutter.

Community
Advanced
sandalsoftsandalsoft

clean-web-design

Standardize React/Tailwind frontend design with token-based dark-mode-ready UI primitives.

Community
Advanced
bughqbughq
2

stacks-imagegen-mobile

Generate platform-aware mobile app screen mockups and user flow visualizations.

Official
Advanced