skills.rest
leogallego
leogallegoCOMMUNITY
Explore all skills by this author →
𝕏@leogallegoredGitHub

compose-expert

Guide writing CMP-aware Compose UI across Android, Desktop, iOS, and Web.

1|Updated Apr 2, 2026
Search Tags:#ui#architecture#design-system#compose#motion#multiplatform
One-click install
npx skills add https://github.com/leogallego/ansible-jane --skill compose-expert-leogallego
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: compose-expert
Source: https://github.com/leogallego/ansible-jane/tree/main/skills/compose-expert
Command: npx skills add https://github.com/leogallego/ansible-jane --skill compose-expert-leogallego

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Compose is complex across Android, Desktop, iOS, and Web CMP. This skill provides practical guidance to write correct, performant Compose code with a CMP-aware mindset.

Core Features & Use Cases

  • Non-opinionated, actionable patterns for runtime state, UI, animations, and design-to-code workflows.
  • Review-focused guidance for Compose code quality, stability, and migration paths across CMP targets.
  • Atomic design system concepts and CMP-specific tokens to enforce theming, accessibility, and reusability.

Quick Start

Generate a ready-to-run Compose component example that demonstrates a simple atom/molecule/organism, using Material3 tokens and a CMP-compatible motion spec, with a slot for content.

Frequently Asked Questions about compose-expert

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

FAQPage Schema
How do I structure a Compose Multiplatform UI using atomic design principles?▼

Structure Compose Multiplatform UI by building scalable atoms, molecules, and organisms. This approach enforces reusability and theming, using CMP-specific tokens to translate design into correct, performant code across Android, Desktop, iOS, and Web.

What is the best way to manage state patterns in Jetpack Compose across multiple platforms?▼

Manage state patterns in Jetpack Compose using non-opinionated, actionable runtime state guidance. This ensures UI stability and correct performance across CMP targets, providing review-focused patterns for code quality and migration paths.

How do I implement CMP-compatible motion specs and Material3 tokens in Compose UI?▼

Implement CMP-compatible motion specs and Material3 tokens by applying design system concepts to your Compose components. This enforces accessibility and theming considerations while generating ready-to-run UI with content slots.

Does Compose Multiplatform support performant animations across Android, Desktop, iOS, and Web?▼

Yes, Compose Multiplatform supports performant animations across Android, Desktop, iOS, and Web. Apply CMP-aware motion schemes and animation patterns to ensure correct UI performance and seamless design-to-code translation.

Can I use Compose to translate design mockups into scalable code across different platforms?▼

Yes, you can use Compose to translate design mockups into scalable code across platforms. Follow a CMP-aware workflow that covers layout, accessibility, and theming considerations to build correct, performant UI components.

Related Skills

Explore More Software Engineering Skills→
Vivekmano27Vivekmano27

kmp-patterns

Generate a Kotlin Multiplatform project skeleton with a shared module.

Community
Advanced
GGEduGGEdu

compose-multiplatform-patterns

Implement shared Compose Multiplatform UI patterns across Android, iOS, Desktop, and Web.

Community
Advanced
Aks-4125Aks-4125
5

kmp-glassmorphism-ui

Implement glassmorphism UI components across Kotlin Multiplatform targets.

Community
Advanced
heaptracetechnologyheaptracetechnology
13

mobile-ui

Build platform-adaptive mobile UI components across React Native, Flutter, and SwiftUI.

Community
Advanced