Agent skill

Android UX

by rcosteira79 in rcosteira79/android-skills

A skill your agent uses when designing or reviewing Android UI — applies Material Design 3 UX principles covering touch targets, spacing, navigation patterns, accessibility, animation timing, and…

MITAuto-check passedFrontend & Design

Install Android UX

skills CLI
$ npx skills add rcosteira79/android-skills --skill android-ux -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install rcosteira79/android-skills android-ux --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/rcosteira79/android-skills.git skills-src && mkdir -p .claude/skills && cp -r skills-src/plugins/android-skills/skills/android-ux .claude/skills/android-ux && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
android-ux
GitHub stars
151
Token cost
~2.3k tokens
SKILL.md length
718 words
Files
1
Skills in repo
21
Repo updated
First seen
Licence
MIT

At a glance

A skill your agent uses when designing or reviewing Android UI — applies Material Design 3 UX principles covering touch targets, spacing, navigation patterns, accessibility, animation timing, and…

  • Works in 10 steps: Color tokens → Typography → Shape → …
  • Reviewing Android UI — applies Material Design 3 UX principles covering touch targets
  • SKILL.md covers Non-obvious platform facts and M3 Compliance Audit
  • Calls rg

What it does

Android UX is an agent skill from rcosteira79/android-skills. Use when designing or reviewing Android UI — applies Material Design 3 UX principles covering touch targets, spacing, navigation patterns, accessibility, animation timing, and platform conventions. Includes an M3 compliance audit that scores screens across 10 categories. Complements the compose skill with design-level decisions.

Its SKILL.md is about 2.3k tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.

It sits in Frontend & Design, covering Android development, Mobile UI design and Accessibility. It works with Android. The repository describes itself as: Claude Code skills for Android & KMP development. The licence is MIT.

When your agent uses it

  • Reviewing Android UI — applies Material Design 3 UX principles covering touch targets
  • Navigation patterns
  • Animation timing
  • Platform conventions

Example prompts

  • “/android-ux”

Workflow steps

10 steps, taken from the step headings in SKILL.md.

  1. Color tokens
  2. Typography
  3. Shape
  4. Elevation & surface
  5. Components
  6. Layout & spacing
  7. Navigation
  8. Motion
  9. Accessibility
  10. Theming consistency

What it can do on your machine

Read from SKILL.md and the folder at commit 0f9af5a. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    Shell commands in SKILL.md call:

    • rg

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Android UX loads about 2.3k tokens when it runs. Until then it costs about 85 tokens; SKILL.md has 718 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~85
When it runs · the whole SKILL.md, loaded when a task matches
~2.3k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from rcosteira79/android-skills at commit 0f9af5a, republished under its MIT licence (© rcosteira79). 718 words, ~2,323 tokens.

Download SKILL.mdSave it as .claude/skills/android-ux/SKILL.md (or your agent's skills folder).
name
android-ux
description
Use when designing or reviewing Android UI — applies Material Design 3 UX principles covering touch targets, spacing, navigation patterns, accessibility, animation timing, and platform conventions. Includes an M3 compliance audit that scores screens across 10 categories. Complements the compose skill with design-level decisions.

Android UX

This reference covers the non-obvious platform facts and reviewing an existing screen for M3 compliance, not the basics of building M3-correct UI.

Non-obvious platform facts

Foldable postures

Foldables introduce postures beyond window size classes. Detect them with WindowInfoTracker + FoldingFeature (Jetpack WindowManager), and never place interactive content or critical information across the hinge.

PostureDetectionLayout behavior
Flat (unfolded)no folding featureTreat as Medium/Expanded by width
Half-opened, horizontal fold (tabletop)HALF_OPENED + Orientation.HORIZONTALContent top half, controls bottom half
Half-opened, vertical fold (book)HALF_OPENED + Orientation.VERTICALList left, detail right
Folded (cover screen)—Treat as Compact
kotlin
@Composable
fun FoldAwareLayout() {
    val context = LocalContext.current
    val layoutInfo by WindowInfoTracker.getOrCreate(context)
        .windowLayoutInfo(context)  // accepts @UiContext — Activity, InputMethodService, or createWindowContext()
        .collectAsStateWithLifecycle(initialValue = WindowLayoutInfo(emptyList()))

    val fold = layoutInfo.displayFeatures.filterIsInstance<FoldingFeature>().firstOrNull()
    when {
        fold?.state == FoldingFeature.State.HALF_OPENED ->
            if (fold.orientation == FoldingFeature.Orientation.HORIZONTAL) TabletopLayout() else BookLayout()
        else -> StandardAdaptiveLayout()  // by window size class
    }
}
M3 contrast levels (user-controlled contrast)

Compose's dynamicLightColorScheme / dynamicDarkColorScheme read the system contrast setting automatically (SDK 34+) and expose no contrast parameter. To offer in-app contrast control (Standard 0.0 / Medium 0.5 / High 1.0 tonal distance), build the scheme from Hct + SchemeContent:

kotlin
// com.google.android.material:material (MDC-Android), package com.google.android.material.color.utilities
// Marked @RestrictTo(LIBRARY_GROUP) — internal API, may change between versions; re-check on version bumps.
val hct = Hct.fromInt(0xFF6750A4.toInt())
val scheme = SchemeContent(hct, /* isDark = */ false, /* contrastLevel = */ 1.0)
val colorScheme = lightColorScheme(
    primary = Color(scheme.primary),
    onPrimary = Color(scheme.onPrimary),
    // ... map remaining roles
)

For multiplatform or a stable public API, com.materialkolor:material-color-utilities is a KMP alternative.

Motion: duration tokens + reduced motion

Pair M3's duration ladder with easing (short* → FastOutSlowIn; medium* → Emphasized(De/Ac)celerate; long*/extraLong* → Emphasized) rather than arbitrary millis. Reach for MotionScheme (Compose M3 1.4+) where available; otherwise hold durations at one source of truth in the theme.

Token groupRangeTypical use
short1…short450–200msMicro-interactions, state changes (ripple, selection, switch)
medium1…medium4250–400msStandard transitions (screen enter/exit, expansion, reveal)
long1…long4450–600msContainer transforms, fade-through between large surfaces
extraLong1…extraLong4700–1000msShared-element / hero transitions on tablets/foldables

Animations must be interruptible and never block input. Respect reduced motion — Compose has no built-in LocalReducedMotion, so read ANIMATOR_DURATION_SCALE and provide one:

kotlin
val LocalReducedMotion = staticCompositionLocalOf { false }

@Composable
fun AppTheme(content: @Composable () -> Unit) {
    val context = LocalContext.current
    val reduceMotion = remember {
        Settings.Global.getFloat(context.contentResolver, Settings.Global.ANIMATOR_DURATION_SCALE, 1f) == 0f
    }
    CompositionLocalProvider(LocalReducedMotion provides reduceMotion) { MaterialTheme { content() } }
}

// at the call site
AnimatedVisibility(
    visible = isVisible,
    enter = if (LocalReducedMotion.current) EnterTransition.None else fadeIn() + slideInVertically(),
) { Content() }

(staticCompositionLocalOf + keyless remember read the setting once per Activity; for live updates switch to compositionLocalOf + a ContentObserver on ANIMATOR_DURATION_SCALE.)


M3 Compliance Audit

Use this when reviewing a screen or feature for Material Design 3 compliance — the part that's easy to skip from memory. Score each category Pass / Partial / Fail, then fix any Partial/Fail before shipping.

1. Color tokens
  • All colors reference MaterialTheme.colorScheme roles — no hardcoded hex/ARGB.
  • Correct role usage: primary for key actions, secondary/tertiary for less prominent / accents, error for errors; on* paired correctly; layered surfaces via surfaceContainerLow/High, not arbitrary grays.
  • Outlines: outline for interactive boundaries needing 3:1 (field borders, focus rings), outlineVariant for decorative dividers.
  • Dynamic color on Android 12+ with a static fallback.
2. Typography
  • All text from MaterialTheme.typography — no inline fontSize/fontWeight.
  • Correct scale: display* hero, headline* section headers, title* card/dialog titles, body* content, label* buttons/captions.
3. Shape
  • Corner radii from MaterialTheme.shapes, not hardcoded RoundedCornerShape.
  • Scale: extraSmall (4dp) chips, small (8dp) cards, medium (12dp) dialogs, large (16dp) sheets, extraLarge (28dp) FABs. Consistent shape language.
Show full SKILL.md (306 more words)Show less
4. Elevation & surface
  • Elevation via tonal color (surface containers), not drop shadows; shadow elevation reserved for dialogs/menus/FABs.
  • ElevatedCard/ElevatedButton over manual shadowElevation.
  • Container hierarchy monotonic by tone (surfaceContainerLowest < … < Highest) — if two adjacent layers render the same color in either theme, the elevation cue is broken.
5. Components
  • M3 components (androidx.compose.material3.*), no M2 (androidx.compose.material.*) and no M2/M3 mixing on a screen.
  • Used as intended: FloatingActionButton for the primary action, Card for grouped content, TopAppBar for screen-level actions.
Quick grep checks

Run from the project root — each hit is a category-1/3/5 violation to triage before human review:

bash
rg --type kt 'Color\(0x[0-9a-fA-F]{6,8}\)' --files-with-matches | head            # 1: hardcoded colors
rg --type kt 'RoundedCornerShape\(\s*\d+(?:\.\d+)?\s*\.dp\s*\)' --files-with-matches | head  # 3: hardcoded radii
rg --type kt 'import androidx\.compose\.material\.' --files-with-matches | head    # 5: Material 2 imports
6. Layout & spacing
  • 8dp grid for padding/margins; responsive compact/medium/expanded breakpoints; screen maps to a canonical layout (Feed, List-Detail, Supporting Pane).
  • Content width constrained on wide screens — cap body content at ~840–1040dp on Large and center it; full width is for navigation chrome, not paragraphs.
  • Foldable postures handled (no content across the hinge; tabletop/book layouts where relevant).
  • Dialogs centered (not full-screen) on Medium+; bottom sheets convert to side sheets on Expanded+.
7. Navigation
  • Navigation component matches width (Bottom Bar / Rail / Drawer); items have both icon and label; current destination indicated via selected + active indicator.
8. Motion
  • Transitions use M3 easing + duration tokens; shared elements use Emphasized at 300–500ms; enter/exit follow M3 (fade-through, container transform); interruptible and respect reduced motion.
9. Accessibility
  • Meaningful images/icons have contentDescription; contrast meets WCAG AA (4.5:1 body, 3:1 large text + UI components); touch targets ≥48dp.
  • Composite items merged with semantics(mergeDescendants = true) so TalkBack announces them as one unit (icon contentDescription = null when merged).
  • Section titles marked semantics { heading() } so screen-reader users can jump between sections.
  • Traversal order logical (semantics { traversalIndex } where needed). User-controlled contrast (Standard/Medium/High) considered if supported.
10. Theming consistency
  • Single MaterialTheme (no nested/conflicting themes); light + dark both tested; custom theme extensions via CompositionLocal, not globals; brand colors via a custom ColorScheme, not per-component overrides.
Audit summary template
Screen: [name]   Date: [date]

| # | Category            | Score   | Notes                  |
|---|---------------------|---------|------------------------|
| 1 | Color tokens        | Pass    |                        |
| 2 | Typography          | Partial | bodySmall hardcoded    |
| 5 | Components          | Fail    | M2 Scaffold still used |
| 6 | Layout & spacing    | Partial | No tablet breakpoint   |
| 9 | Accessibility       | Partial | Missing headings       |
…

Action items:
- [ ] ...

© rcosteira79, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

Just SKILL.md in plugins/android-skills/skills/android-ux of rcosteira79/android-skills.

Open the folder on GitHubat commit 0f9af5a

Compare with similar skills

Android UX next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Android UX compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Android UX this skillrcosteira79/android-skills151—~2.3kAutomated safety check: PassMIT
Android Mobile UI DesignModinMobileSTS/SlayTheAmethystModded402—~1kAutomated safety check: PassCustom licence
STS Amethyst Launcher Design SystemModinMobileSTS/SlayTheAmethystModded402—~1.7kAutomated safety check: PassCustom licence
Android AccessibilityMoustachauve/WLED-Android1693 repos~471Automated safety check: PassApache-2.0
Accessible Mobile DeveloperFerroxLabs/wayland608—~3.6kAutomated safety check: PassApache-2.0
Android UI AutomationOpenMinis/MinisSkills444—~1.6kAutomated safety check: PassMIT

Similar skills

  • Android Mobile UI Design

    ModinMobileSTS/SlayTheAmethystModded

    Designs and reviews Android screens with attention to touch ergonomics, adaptive layouts, accessibility, state handling and an implementation handoff.

    402 GitHub stars~1k tokensUpdated yesterday
    MobileAuto-check passed
  • STS Amethyst Launcher Design System

    ModinMobileSTS/SlayTheAmethystModded

    Design system imported from the SlayTheAmethyst Android Jetpack Compose launcher: Material 3 surfaces, user-selected seed colors, light and dark themes and typography rules.

    402 GitHub stars~1.7k tokensUpdated yesterday
    Frontend & DesignAuto-check passed
  • Android Accessibility

    Moustachauve/WLED-Android

    Expert checklist and prompts for auditing and fixing Android accessibility issues, especially in Jetpack Compose.

    169 GitHub starsUsed in 3 repos~471 tokens
    Frontend & DesignAuto-check passed
  • Accessible Mobile Developer

    FerroxLabs/wayland

    Mobile accessibility development expertise covering iOS VoiceOver and Android TalkBack integration, accessibility APIs for SwiftUI and Jetpack Compose, touch target sizing, gesture alternatives…

    608 GitHub stars~3.6k tokensUpdated 2 days ago
    MobileAuto-check passed
  • Android UI Automation

    OpenMinis/MinisSkills

    Automate Android apps that have no public API or web version by driving the UI layer through the Accessibility Service.

    444 GitHub stars~1.6k tokensUpdated yesterday
    MobileAuto-check passed
  • Configuring Test Dependencies

    skydoves/android-testing-skills

    A skill your agent uses to wire the correct Gradle dependency matrix for Jetpack Compose UI tests.

    333 GitHub stars~4.1k tokensUpdated 4 mo ago
    MobileAuto-check passed

More from rcosteira79/android-skills

All 21 skills in this repo
  • Guides writing correct, performant Compose and Compose Multiplatform UI across Android, desktop, iOS and web, from state and animation to design-to-code and crash fixes.

    151 GitHub stars~2.6k tokensUpdated 19 days ago
    Auto-check passed
  • Kotlin Multiplatform Boundaries

    rcosteira79/android-skills

    Helps choose how common Kotlin Multiplatform code reaches platform APIs: expect/actual, a common interface with platform bindings, or separate platform screens.

    151 GitHub stars~1.5k tokensUpdated 19 days ago
    Auto-check passed
  • Android Data Layer and Room in KMP

    rcosteira79/android-skills

    Sets out the repository pattern's error-propagation model for Android and Kotlin Multiplatform, plus the Room setup for commonMain.

    151 GitHub stars~1.2k tokensUpdated 19 days ago
    Auto-check passed
  • Android Debugging

    rcosteira79/android-skills

    Android and KMP debugging techniques for crashes, ANRs, memory leaks, R8 traces, Gradle failures and Compose recomposition, built on finding the root cause first.

    151 GitHub stars~2.6k tokensUpdated 19 days ago
    Auto-check passed
  • Android and KMP Baseline

    rcosteira79/android-skills

    Sets house defaults for Android and Kotlin Multiplatform work and routes to the right specialized skill for Compose, networking, testing or build tooling.

    151 GitHub stars~3k tokensUpdated 19 days ago
    Auto-check passed
  • Android Gradle Build Logic

    rcosteira79/android-skills

    Sets up Android Gradle convention plugins in a build-logic composite build, including the version catalog wiring and shared configuration that are easy to get wrong.

    151 GitHub stars~959 tokensUpdated 19 days ago
    Auto-check passed

Works with

Questions about Android UX

What does Android UX do?

A skill your agent uses when designing or reviewing Android UI — applies Material Design 3 UX principles covering touch targets, spacing, navigation patterns, accessibility, animation timing, and…. Android UX is an agent skill from rcosteira79/android-skills. Use when designing or reviewing Android UI — applies Material Design 3 UX principles covering touch targets, spacing, navigation patterns, accessibility, animation timing, and platform conventions.

When should I use Android UX?

Android UX fits situations like: reviewing Android UI — applies Material Design 3 UX principles covering touch targets; navigation patterns; animation timing; platform conventions.

How do I install Android UX in Claude Code?

Run `npx skills add rcosteira79/android-skills --skill android-ux -a claude-code`. Or copy the skill folder (plugins/android-skills/skills/android-ux in rcosteira79/android-skills) into .claude/skills/android-ux in your project. Claude Code loads it when a task matches its description.

How do I install Android UX in Codex?

Run `npx skills add rcosteira79/android-skills --skill android-ux -a codex`. Or copy the skill folder (plugins/android-skills/skills/android-ux in rcosteira79/android-skills) into .agents/skills/android-ux in your project. Codex loads it when a task matches its description.

Can I use Android UX in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add rcosteira79/android-skills --skill android-ux -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/android-ux, .gemini/skills/android-ux, .github/skills/android-ux and .opencode/skills/android-ux in your project.

What does Android UX need to run?

Going by SKILL.md and its folder, Android UX needs the command-line tools its instructions call (rg).

Does Android UX access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Android UX safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Android UX use?

Android UX is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Android UX use?

About 2.3k tokens (SKILL.md is roughly 9.3k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Android UX?

Skills that share tags, products or a category with Android UX: Android Mobile UI Design (ModinMobileSTS/SlayTheAmethystModded, 402 stars), STS Amethyst Launcher Design System (ModinMobileSTS/SlayTheAmethystModded, 402 stars), Android Accessibility (Moustachauve/WLED-Android, 169 stars) and Accessible Mobile Developer (FerroxLabs/wayland, 608 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Android UX?

rcosteira79 (a GitHub user) maintains it in rcosteira79/android-skills, which has 151 GitHub stars. The repository holds 21 skills in this directory. The repository was last updated on September 19, 2026.

Source: rcosteira79/android-skills on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.