What is the mobile-android-design skill?
The mobile-android-design skill is a SKILL.md in wshobson/agents, inside the ui-design plugin. It guides an AI coding agent writing native Android screens with Material Design 3 and Jetpack Compose, covering theming, adaptive layouts for phones, tablets and foldables, navigation, accessibility and the usual Compose pitfalls.
In this skill, the SKILL.md body is short on purpose. Its core concepts section was moved into references/details.md to fit an 8 KB cap noted in the file, so the agent reads the main file first and the detail file when needed.
The folder also holds android-navigation.md, compose-components.md and material3-theming.md. Together they cover Material Design 3, also called Material You, and the Jetpack Compose patterns used to build modern, adaptive Android apps.
What your agent does differently
- Colors come from MaterialTheme.colorScheme, so dark mode follows the theme automatically.
- Dynamic color is enabled on Android 12 and up for personalization.
- Layouts adapt with WindowSizeClass instead of one fixed phone layout.
- Interactive elements get a contentDescription and a minimum 48dp touch target.
- State is hoisted out of components, and remember or rememberSaveable is chosen deliberately.
Where it fits and where it does not
Good fit
- Compose screens for phones, tablets and foldables.
- Material 3 theming with dynamic colors.
- Navigation Compose flows, including back press and deep link handling.
- Teams that want accessibility rules applied from the first draft.
Poor fit
- iOS apps. This skill is Android only. Related page: design mobile apps.
- Flutter projects, since the skill targets Jetpack Compose. Related page: Flutter responsive layouts.
- Web or WordPress front ends, since the skill targets native Android apps.
Use it with UiChemy
This skill is for native Android code and has no WordPress step. If the same brand also needs a website, UiChemy Figma to WordPress converts a Figma design into an editable page. Click Get Started on uichemy.com. Related page: fixing accessibility.
How to install Android Design Skill: Material 3 and Jetpack Compose
gh skill install wshobson/agents mobile-android-designConfirm GitHub CLI 2.90 or later
The repo README gives this as the requirement for the gh skill installer, which adds one skill without the plugin's agents, commands or hooks.
Install by name
Run
gh skill install wshobson/agents mobile-android-designand choose your coding tool at the prompt. The README demonstrates the same form with another skill.Manual alternative
Clone with
git clone https://github.com/wshobson/agents.gitand copy plugins/ui-design/skills/mobile-android-design, keeping the references folder, to your agent's skills location.Plugin marketplaces
The README also lists plugin marketplace routes for Claude Code, Codex CLI and Cursor. This skill lives in the ui-design plugin folder.
Check that it loaded
Ask your agent for a Compose list item with a title, subtitle and chevron. Expect Card, MaterialTheme.colorScheme values, a Preview annotation and no hardcoded colors.
Key features
- Material Design 3 focusThe skill frames its guidance around Material Design 3 and Material You, with a dedicated material3-theming.md reference for color schemes and dynamic color.
- Jetpack Compose quick startIncludes an ItemListCard composable built from Card, Row, Box and Column, styled with primaryContainer, titleMedium and onSurfaceVariant theme values.
- Adaptive layoutsTells the agent to use WindowSizeClass for responsive designs across phones, tablets and foldables.
- Dynamic colorRecommends enabling dynamic color on Android 12 and up so the app picks up the user's palette.
- Navigation ComposeCovers Android navigation patterns, with a separate android-navigation.md reference and a reminder to handle back press and deep links properly.
- Accessibility rulesRequires contentDescription on interactive elements and a minimum 48dp touch target.
- State hoistingAsks for state to be hoisted so components stay reusable and testable, and for remember and rememberSaveable to be used correctly.
- Preview annotationsSuggests adding @Preview with different configurations so each composable can be checked in several states.
- Common Compose issuesLists fixes for unstable lambdas, state loss on configuration changes, Column versus LazyColumn on long lists, theme leaks, navigation crashes and coroutine leaks.
Frequently asked questions
What is the mobile-android-design skill?
It is a skill folder in the wshobson/agents repository that gives an AI coding agent guidance on Material Design 3 and Jetpack Compose. It covers theming, adaptive layouts, navigation, accessibility, state handling and typical Compose problems, with four reference files alongside SKILL.md.
How do I install mobile-android-design?
Use gh skill install wshobson/agents mobile-android-design with GitHub CLI 2.90 or later, then pick your coding tool. Without GitHub CLI, clone the repository and copy the plugins/ui-design/skills/mobile-android-design folder into wherever your agent loads skills.
Which coding agents does it work with?
The repository README lists Claude Code, Codex CLI, Cursor, OpenCode, Antigravity CLI, GitHub Copilot and Pi, each with its own setup route. The README says generated copies for some tools split long skill bodies into reference files, which matches how this skill is organized.
Does the skill support foldables and tablets?
Its description and use list name phones, tablets and foldables, and its best practices recommend WindowSizeClass for responsive designs. The reference files in the folder, including details.md, may hold more depth, so open them if foldable handling matters for your app.
Why is the main SKILL.md so short?
The file says its core concepts section was originally 9201 bytes and moved to references/details.md to fit Codex's 8 KB skill body cap. The agent still gets the detail, but loads it from the reference file when the main body is not enough.
What should I use for iOS instead?
This skill covers Android only, so it is the wrong fit for iOS screens. Its description names Android interfaces, Compose UI and Material Design guidelines. Related pages: design mobile apps and building native UI.
What license does it use?
The wshobson/agents repository is MIT licensed. The README states that external plugins listed in its catalog have their own licenses, while this skill belongs to the repository's local ui-design plugin.