What is the Compose Multiplatform Patterns skill?

It is a specialized set of instructions for Claude Code that provides best practices and implementation patterns for building cross-platform UIs using Jetpack Compose and Kotlin Multiplatform.

Can it help optimize app performance?

Yes, it provides guidance on using stable types, proper keying in lazy lists, and derivedStateOf to minimize unnecessary recompositions.

Does this skill support type-safe navigation?

Yes, it includes modern patterns for type-safe navigation (Compose Navigation 2.8+) using @Serializable objects for routes.

Is platform-specific UI supported?

Absolutely. It uses the expect/actual pattern to handle platform-specific UI elements like status bars or system-level interactions across Android and iOS.

How does it handle state management?

The skill promotes the ViewModel + Single State Object pattern, using StateFlow and collectAsStateWithLifecycle for predictable and lifecycle-aware UI updates.

Compose Multiplatform Patterns

Name: Compose Multiplatform Patterns
Author: affaan-m

byaffaan-m

•

156,032

•

Mobile Development

Implements professional-grade UI patterns for cross-platform apps using Jetpack Compose and Compose Multiplatform.

This skill equips Claude with specialized knowledge for building shared UI across Android, iOS, Desktop, and Web using Kotlin Multiplatform (KMP). It focuses on architectural excellence, providing standardized patterns for reactive state management with ViewModels, type-safe navigation, and performance-optimized composable design. By leveraging this skill, developers can ensure their cross-platform applications follow industry best practices for recomposition efficiency, Material 3 theming, and platform-specific UI implementation using the expect/actual pattern.

Key Features

01156,032 GitHub stars

02Type-safe navigation implementation for multi-platform projects

03Slot-based API design for reusable UI components

04Platform-specific UI handling with expect/actual patterns

05Reactive state management using ViewModels and StateFlow

06Performance optimization via stable types and skippable recomposition

Use Cases

01Optimizing recomposition performance in complex Compose layouts

02Implementing type-safe navigation in multi-module KMP projects

03Building shared UI codebases for Android and iOS apps

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add affaan-m/everything-claude-code compose-multiplatform-patterns

For use in Claude.ai and ChatGPT

Key Features

01156,032 GitHub stars

02Type-safe navigation implementation for multi-platform projects

03Slot-based API design for reusable UI components

04Platform-specific UI handling with expect/actual patterns

05Reactive state management using ViewModels and StateFlow

06Performance optimization via stable types and skippable recomposition

Use Cases

01Optimizing recomposition performance in complex Compose layouts

02Implementing type-safe navigation in multi-module KMP projects

03Building shared UI codebases for Android and iOS apps

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add affaan-m/everything-claude-code compose-multiplatform-patterns

For use in Claude.ai and ChatGPT