Guide · Agent skill

How to use the Android Mobile Design agent skill

Updated 2026-10-29 · written with AI from the project's own documentation and checked against our catalogue data

The mobile-android-design skill is a set of reference instructions that tells an AI agent how to build native Android interfaces with Material Design 3 and Jetpack Compose. This guide explains what a skill is, how to install this one, how to trigger it with plain requests, and what your project needs so the generated code compiles. It is written for readers who have never used an agent skill before.

Android Mobile Designwshobson/agents · MIT Download the skill

Quick start

1Download the ZIP. Download the mobile-android-design ZIP from this page.
2Unzip into a skills folder. Unzip it into ~/.claude/skills/ for personal use, or into your project's .claude/skills/ folder for one project.
3Or upload in the Claude apps. In the Claude apps, go to Settings → Capabilities → Skills and upload the ZIP.
4Check your project. Confirm your Android project uses Jetpack Compose and the Material 3 libraries.
5Make a specific request. Ask for a named Compose screen, component, navigation setup or layout, and mention Android and Compose.
6Review the output. Compile, test and review the generated code before you rely on it.

What is an agent skill and what does this one do?

An agent skill is a folder of instructions and reference files that an AI agent loads when a task matches the skill's description. This skill is for Android UI work. Its description says it covers Material Design 3 and Jetpack Compose patterns for building native Android apps.

Once triggered, the agent can write Compose screens and components, apply Material 3 theming with dynamic colors, plan navigation, and make layouts adapt to phones, tablets, and foldables. The guidance also includes accessibility and performance tips.

Compose screens and reusable components
Material 3 theming with dynamic color
Navigation Compose setup and routes
Adaptive layouts using WindowSizeClass
Accessibility and state-handling checks

Install the mobile-android-design skill

Download the ZIP for this skill from this page. Then choose one of the two install locations below.

For a personal setup available across projects, unzip the download into ~/.claude/skills/. To limit it to one project, unzip it into that project's .claude/skills/ folder. The skill folder should contain SKILL.md and a references folder.

You can also upload the ZIP in the Claude apps under Settings → Capabilities → Skills.

Personal: ~/.claude/skills/
Single project: .claude/skills/ inside your project
Claude apps: Settings → Capabilities → Skills, then upload the ZIP

Trigger the skill with natural requests

You do not need a special command. The agent loads the skill when your request matches its description, which mentions designing Android interfaces, implementing Compose UI, or following Google's Material Design guidelines. Name the platform and the framework in your request so the match is clear.

Give the agent concrete context: the screen you want, the data it shows, and any constraints such as dark mode or tablet layouts.

Design a Material 3 settings screen for an Android app using Compose.
Write a Compose list card for a product item with a click handler and a trailing chevron.
Set up Navigation Compose with a home screen, a detail screen that takes an item ID, and a settings screen.
Make this Compose layout adapt to tablets and foldables using WindowSizeClass.
Review this Compose screen against Material 3 theming and accessibility practices.

Use the built-in patterns: a worked example

The skill's quick-start component is a clickable card. It uses a Card with a rounded shape, a Row with a 48dp circular icon container, and two Text items styled from MaterialTheme.typography. Colors come from MaterialTheme.colorScheme, which the skill recommends so dark mode works automatically.

Icons used for decoration set contentDescription to null, while interactive elements should have a description. The reference files also cover LazyColumn lists with stable keys and pull-to-refresh.

Colors come from MaterialTheme.colorScheme, not hard-coded values
Long lists use LazyColumn rather than Column
Touch targets are at least 48dp

@Composable
fun ItemListCard(
    item: Item,
    onItemClick: () -> Unit,
    modifier: Modifier = Modifier
) {
    Card(
        onClick = onItemClick,
        modifier = modifier.fillMaxWidth(),
        shape = RoundedCornerShape(12.dp)
    ) {
        Row(
            modifier = Modifier
                .padding(16.dp)
                .fillMaxWidth(),
            verticalAlignment = Alignment.CenterVertically
        ) {
            Text(
                text = item.title,
                style = MaterialTheme.typography.titleMedium
            )
        }
    }
}

Set up your project so the code compiles

The skill installs nothing. It provides instructions only, so the generated code needs an Android or Kotlin project that already includes Jetpack Compose and the Material 3 libraries. The navigation reference lists its dependencies in build.gradle.kts, for example androidx.navigation:navigation-compose and kotlinx-serialization-json for type-safe routes.

Versions in the reference files are examples from the source. Check the current library versions your project needs before adding them.

An Android/Kotlin project with Jetpack Compose enabled
Material 3 library dependency
navigation-compose and kotlinx-serialization-json if you use type-safe navigation

dependencies {
    implementation("androidx.navigation:navigation-compose:2.7.7")
    implementation("org.jetbrains.kotlinx:kotlinx-serialization-json:1.6.3")
}

Safety notes: scripts and network

According to the skill's assessment, this skill runs no scripts and uses no network. It is instruction and reference material only and does not add tools or execute anything itself.

Because the skill does not verify code, treat every generated screen as a draft. Compile it, run it on a device or emulator, and review it before shipping.

Runs scripts: no
Uses network: no
Adds no tools; the agent's output still needs compiling, testing and review

Tips for better results

Ask for one screen or component at a time. Share your existing theme file or screen code so the agent follows your conventions rather than inventing new ones.

Ask the agent to check common issues the skill lists, such as unstable lambdas causing recomposition, state loss on configuration changes, and missing handling for back press and deep links.

Paste your existing Theme or Color definitions into the request
Ask for @Preview functions with different configurations
Ask for rememberSaveable where state must survive rotation
Ask for state hoisting so components are reusable and testable

What people use it for

Scaffold a Compose list screen with LazyColumn, stable keys and pull-to-refresh.
Apply Material 3 theming with dynamic color on Android 12 and later.
Plan Navigation Compose routes between a home, detail and settings screen.
Adapt a layout for phones, tablets and foldables using WindowSizeClass.
Check an existing Compose screen against accessibility and state-handling tips.

Frequently asked questions

How do I install the mobile-android-design skill?

Download the ZIP from this page and unzip it into ~/.claude/skills/ for personal use, or into a project's .claude/skills/ folder. You can also upload the ZIP in the Claude apps under Settings → Capabilities → Skills.

Is the mobile-android-design skill free?

The skill is published under the MIT licence, as stated on this page. Check the repository licence for the full terms before reusing it.

What do I need to use this skill?

You need an Android or Kotlin project with Jetpack Compose and the Material 3 libraries for the code to compile. The skill itself installs nothing.

Does the skill run scripts or use the network?

According to this page, it runs no scripts and uses no network. It contains instructions and reference files only.

Does this skill work for iOS, web or cross-platform apps?

No. The guidance is Android-specific and targets Jetpack Compose, so it is not suited to iOS, web or cross-platform projects that do not use Compose.

Why isn't the skill triggering for my request?

Name Android and Jetpack Compose or Material Design in your request, since the skill loads when the request matches its description. Confirm the folder is in the correct skills location and contains SKILL.md.

New agent skills, repos and AI tools — every week

The best new skills and open-source projects, the fastest-growing repos, and one free prompt. Five minutes to read. Unsubscribe anytime.

Our verdict

Use this skill if you build Android apps with Jetpack Compose and want generated code that follows Material 3 conventions, theming and accessibility tips. Pick something else if your project is iOS, web or cross-platform without Compose, or if you need the code verified for Google design compliance, since you must still compile, test and review everything.

Download the skill