compose
installsforks
How to install compose?
rcosteira79/android-skills/compose
$npx -y skills add rcosteira79/android-skills --skill composeCompose and Compose Multiplatform expert for UI development across Android, Desktop, iOS, and Web. Covers state management, composition, animations, navigation, performance, design-to-code workflows, and production crash patterns, backed by source analysis from androidx/androidx
SKILL.md
| 1 | # Compose Expert Skill |
| 2 | |
| 3 | Non-opinionated, practical guidance for writing correct, performant Compose code — |
| 4 | across Android, Desktop, iOS, and Web. Covers Jetpack Compose and Compose Multiplatform. |
| 5 | Backed by analysis of actual source code from `androidx/androidx` and |
| 6 | `JetBrains/compose-multiplatform-core`. |
| 7 | |
| 8 | ## Workflow |
| 9 | |
| 10 | When helping with Compose code, follow this checklist: |
| 11 | |
| 12 | ### 1. Understand the request |
| 13 | - What Compose layer is involved? (Runtime, UI, Foundation, Material3, Navigation) |
| 14 | - Is this a state problem, layout problem, performance problem, or architecture question? |
| 15 | - Is this Android-only or Compose Multiplatform (CMP)? |
| 16 | |
| 17 | ### 2. Analyze the design (if visual reference provided) |
| 18 | - If the user shares a Figma frame, screenshot, or design spec, consult `references/design-to-compose.md` |
| 19 | - Decompose the design into a composable tree |
| 20 | - Transcribe, don't adapt — copy, casing, punctuation and number format come across exactly; resolve each value to the token that matches it exactly, and add a token the theme lacks rather than substituting the nearest (`references/design-to-compose.md`) |
| 21 | - Map design tokens to MaterialTheme, spacing to CompositionLocals |
| 22 | - Identify animation needs — `references/animation.md` (contentKey, phase rule, M3 motion tokens), `references/animation-recipes.md` (shimmer/loading-crossfade + choreography), or `references/animation-advanced.md` (shared-element, predictive back, `drawBehind`-for-color) |
| 23 | |
| 24 | ### 3. Consult the right reference |
| 25 | Read the relevant reference file(s) from `references/` before answering: |
| 26 | |
| 27 | | Topic | Reference File | |
| 28 | |-------|---------------| |
| 29 | | State-hoisting boundary (UI-value-drives-business-logic), `derivedStateOf`-capture trap, cross-phase back-writing, durable-state-over-events, `@ReadOnlyComposable` | `references/state-management.md` | |
| 30 | | Slot / content-API authoring — receiver scopes (`RowScope`), optional (nullable) slots, `XxxDefaults`, slot-vs-boolean-flag | `references/view-composition.md` | |
| 31 | | Screen/content split (private content composable), framework-state-stays-in-UI (not hoisted to the ViewModel) | `references/screen-structure.md` | |
| 32 | | Modifier-as-API-contract rules (no hardcoded placement on a reusable root, caller-modifier-first) + chain ordering | `references/modifiers.md` | |
| 33 | | Effects (`LaunchedEffect`/`DisposableEffect`/`SideEffect`), lifecycle effects (`LifecycleResumeEffect`), effect anti-patterns | `references/side-effects.md` | |
| 34 | | `compositionLocalOf` vs `staticCompositionLocalOf` (recomposition scope), custom locals, no-mutable-State-in-a-local | `references/composition-locals.md` | |
| 35 | | LazyList perf traps — `indexOf()`-O(n²), no-new-objects-in-key, `animateItem`, `ReportDrawnWhen`, infinite-scroll trigger | `references/lists-scrolling.md` | |
| 36 | | Navigation 3 (`NavDisplay`, back-stack-as-state, compose-shape guardrails); type-safe `@Serializable` routes | `references/navigation.md` | |
| 37 | | `AnimatedContent` contentKey-on-shape, defer-reads-to-latest-phase (lambda modifiers), M3 motion/easing tokens | `references/animation.md` | |
| 38 | | Animation recipes (shimmer/loading-crossfade), sequential/parallel/staggered choreography | `references/animation-recipes.md` | |
| 39 | | Shared-element transitions (`sharedBounds`/`sharedElement`/`skipToLookaheadSize`), `drawBehind`-for-animated-color, predictive back | `references/animation-advanced.md` | |
| 40 | | Extending the theme beyond M3's three slots — custom design tokens via `CompositionLocal` | `references/theming-material3.md` | |
| 41 | | Touch targets, spacing, canonical layouts, foldables, M3 compliance audit | `android-skills:android-ux` | |
| 42 | | Recomposition skipping, stability, baseline profiles, benchmarking | `references/performance.md` | |
| 43 | | Traversal order (`traversalIndex` / `isTraversalGroup`), live-region mode (`Polite` vs `Assertive`) | `references/accessibility.md` | |
| 44 | | `FocusRequester`, `focusable()`, `focusProperties`, key events, D-pad, TV, keyboard, focus restoration | `references/focus-navigation.md` | |
| 45 | | Removed/replaced APIs, migration paths from o |
People who liked this also viewed
6 picksType
- hyperframes-cliUse the HyperFrames CLI development loop: init, add, catalog, capture, lint, check, snapshot, compare, grade-compare, preview, play, present, beats, keyframes, single or batch render, publish, cloud, SkillsJul 2026
- request-refactor-planSkills for Real Engineers. Straight from my .agents directory.SkillsJul 2026
- analyze-projectRigor Analyze / Rigor Audit read-only skill for deep learning research repositories. Use when the user wants to read and understand a repository, inspect model structure and training or inference entrSkillsMay 2026
- explore-codeRigor Improve implementation leaf skill for auditable candidate implementation in deep learning research repositories. Use when the researcher explicitly authorizes exploratory work on an isolated braSkillsMay 2026
- ubiquitous-languageSkills for Real Engineers. Straight from my .agents directory.SkillsJul 2026
- scaffold-exercisesSkills for Real Engineers. Straight from my .agents directory.SkillsJul 2026
