---
title: "Android Mobile Design"
type: skill
id: "wshobson-agents/frontend-ui/mobile-android-design"
category: "Design"
publisher: "Seth Hobson"
license: "MIT"
source: "https://github.com/wshobson/agents/tree/7e2fb55"
canonical: "https://labs.pho.chat/en/skills/wshobson-agents/frontend-ui/mobile-android-design"
open_in_pho: "https://pho.chat/customize?item=wshobson-agents%2Ffrontend-ui%2Fmobile-android-design&utm_source=labs&utm_medium=skill-page&utm_campaign=skills-library"
---

# Android Mobile Design

Master Material Design 3 and Jetpack Compose patterns for building native Android apps. Use when designing Android interfaces, implementing Compose UI, or following Google's Material Design guidelines.

Source: Seth Hobson (MIT), copied at a pinned commit. Free to use. Part of the Phở Skills library (https://labs.pho.chat/en/skills).
Skill set: Frontend and UI design (https://labs.pho.chat/en/skills/wshobson-agents/frontend-ui.md).

## What it covers
- When to Use This Skill
- Detailed section: Core Concepts
- Quick Start Component
- Best Practices
- Common Issues

## Other skills in this set
- [Accessibility Compliance](https://labs.pho.chat/en/skills/wshobson-agents/frontend-ui/accessibility-compliance.md): Implement WCAG 2.2 compliant interfaces with mobile accessibility, inclusive design patterns, and assistive technology support. Use when auditing accessibility, implementing ARIA patterns, building…
- [Design System Patterns](https://labs.pho.chat/en/skills/wshobson-agents/frontend-ui/design-system-patterns.md): Build scalable design systems with design tokens, theming infrastructure, and component architecture patterns. Use when creating design tokens, implementing theme switching, building component…
- [Interaction Design](https://labs.pho.chat/en/skills/wshobson-agents/frontend-ui/interaction-design.md): Design and implement microinteractions, motion design, transitions, and user feedback patterns. Use when adding polish to UI interactions, implementing loading states, or creating delightful user…
- [iOS Mobile Design](https://labs.pho.chat/en/skills/wshobson-agents/frontend-ui/mobile-ios-design.md): Master iOS Human Interface Guidelines and SwiftUI patterns for building native iOS apps. Use when designing iOS interfaces, implementing SwiftUI views, or ensuring apps follow Apple's design…
- [React Native Design](https://labs.pho.chat/en/skills/wshobson-agents/frontend-ui/react-native-design.md): Master React Native styling, navigation, and Reanimated animations for cross-platform mobile development. Use when building React Native apps, implementing navigation patterns, or creating…
- [Responsive Design](https://labs.pho.chat/en/skills/wshobson-agents/frontend-ui/responsive-design.md): Implement modern responsive layouts using container queries, fluid typography, CSS Grid, and mobile-first breakpoint strategies. Use when building adaptive interfaces, implementing fluid layouts, or…
- [Visual Design Foundations](https://labs.pho.chat/en/skills/wshobson-agents/frontend-ui/visual-design-foundations.md): Apply typography, color theory, spacing systems, and iconography principles to create cohesive visual designs. Use when establishing design tokens, building style guides, or improving visual…
- [Web Component Design](https://labs.pho.chat/en/skills/wshobson-agents/frontend-ui/web-component-design.md): Master React, Vue, and Svelte component patterns including CSS-in-JS, composition strategies, and reusable component architecture. Use when building UI component libraries, designing component APIs…
- [Next.js App Router Patterns](https://labs.pho.chat/en/skills/wshobson-agents/frontend-ui/nextjs-app-router-patterns.md): Master Next.js 14+ App Router with Server Components, streaming, parallel routes, and advanced data fetching. Use when building Next.js applications, implementing SSR/SSG, or optimizing React Server…
- [React Native Architecture](https://labs.pho.chat/en/skills/wshobson-agents/frontend-ui/react-native-architecture.md): Build production React Native apps with Expo, navigation, native modules, offline sync, and cross-platform patterns. Use when developing mobile apps, implementing native integrations, or…
- [React State Management](https://labs.pho.chat/en/skills/wshobson-agents/frontend-ui/react-state-management.md): Master modern React state management with Redux Toolkit, Zustand, Jotai, and React Query. Use when setting up global state, managing server state, or choosing between state management solutions.
- [Tailwind Design System (v4)](https://labs.pho.chat/en/skills/wshobson-agents/frontend-ui/tailwind-design-system.md): Build scalable design systems with Tailwind CSS v4, design tokens, component libraries, and responsive patterns. Use when creating component libraries, implementing design systems, or standardizing…
- [Screen Reader Testing](https://labs.pho.chat/en/skills/wshobson-agents/frontend-ui/screen-reader-testing.md): Test web applications with screen readers including VoiceOver, NVDA, and JAWS. Use when validating screen reader compatibility, debugging accessibility issues, or ensuring assistive technology…
- [WCAG Audit Patterns](https://labs.pho.chat/en/skills/wshobson-agents/frontend-ui/wcag-audit-patterns.md): Conduct WCAG 2.2 accessibility audits with automated testing, manual verification, and remediation guidance. Use when auditing websites for accessibility, fixing WCAG violations, or implementing…

## Use it
- In Phở: open https://pho.chat/customize?item=wshobson-agents%2Ffrontend-ui%2Fmobile-android-design&utm_source=labs&utm_medium=skill-page&utm_campaign=skills-library and press Try, or add it so Phở loads it whenever a request matches. Phở works with your own API key (OpenAI, Anthropic, Google and others).
- Full instructions (original SKILL.md, unchanged): https://labs.pho.chat/skills/raw/wshobson-agents/frontend-ui/skills/mobile-android-design/SKILL.md
- Original files: https://github.com/wshobson/agents/tree/7e2fb55 (MIT).
- Full machine-readable index: https://labs.pho.chat/skills.json