skills.rest
zester4
zester4COMMUNITY
Explore all skills by this author →
GitHub

mobile-android-design

Implement Material Design 3 interfaces and Jetpack Compose UI patterns for Android apps.

2|1|Updated Jun 9, 2026
Search Tags:#theming#navigation#ui design#android#kotlin#jetpack compose#material design 3
One-click install
npx skills add https://github.com/zester4/zilmate --skill mobile-android-design-zester4
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: mobile-android-design
Source: https://github.com/zester4/zilmate/tree/main/.agents/skills/mobile-android-design
Command: npx skills add https://github.com/zester4/zilmate --skill mobile-android-design-zester4

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Building native Android interfaces that follow Google's Material Design 3 guidelines requires deep knowledge of Jetpack Compose, theming, navigation, and adaptive layouts, which is time-consuming to get right from scratch. ## Core Features & Use Cases - Jetpack Compose Components: Ready-to-use patterns for lists, forms, dialogs, bottom sheets, loading states, and animations. - Material 3 Theming: Dynamic color, custom color schemes, typography scales, shapes, and elevation following Material You guidelines. - Navigation Patterns: Type-safe Navigation Compose with bottom navigation, drawers, navigation rail, deep links, and nested graphs. - Use Case: When building an Android app screen, ask for a Compose implementation of a settings page with switches, dropdowns, and a modal navigation drawer that adapts to tablets using window size classes. ## Quick Start Use the mobile-android-design skill to build a Jetpack Compose home screen with bottom navigation and Material 3 dynamic theming.

Frequently Asked Questions about mobile-android-design

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

FAQPage Schema
How do I implement bottom navigation in Jetpack Compose?▼

Use NavigationBar with NavigationBarItem entries inside a Scaffold, wired to a NavHostController. Configure popUpTo, launchSingleTop, and restoreState on navigation to preserve back stack state correctly.

How to enable Material 3 dynamic color on Android?▼

Call dynamicDarkColorScheme or dynamicLightColorScheme with LocalContext on Android 12 (API 31) and above, passing the result to MaterialTheme. Fall back to custom light and dark color schemes on older versions.

Does Navigation Compose support type-safe routes?▼

Yes, Navigation Compose 2.7+ supports type-safe navigation using Kotlinx Serialization. Define routes as @Serializable objects or data classes and retrieve arguments with backStackEntry.toRoute().

How do I make Compose layouts adapt to tablets and foldables?▼

Use WindowSizeClass to switch between compact, medium, and expanded layouts, such as bottom navigation on phones and navigation rail or permanent drawers on larger screens. FoldingFeature state handles half-opened foldable postures.

Why does my Compose list perform poorly with many items?▼

Using Column for long lists composes every item eagerly, causing performance issues. Switch to LazyColumn or LazyVerticalGrid, provide stable item keys, and avoid unstable lambdas that trigger unnecessary recomposition.

Related Skills

Explore More Software Engineering Skills→
BENYEKHLEF-AnouarBENYEKHLEF-Anouar

architecte-contenu

Generate sitemap.md, content-strategy.md, and Markdown wireframes from a project brief.

Community
Intermediate
cycling02cycling02

android-testing-master

Guide Android unit, integration, and UI testing with Kotlin and Jetpack Compose.

Community
Advanced
siddhantparadoxsiddhantparadox

android-accessibility

Audit Android Jetpack Compose UI components for WCAG AA accessibility compliance.

Community
Intermediate
PostalocityPostalocity
1

mobile-developer

Guide iOS and Android development with Swift, Kotlin, and cross-platform frameworks.

Official
Intermediate