
Compose Motion
Jetpack Compose animation foundations - animate*AsState, AnimatedVisibility, Crossfade...
Install
npx skills add AThevon/genjutsu --skill compose-motion -g -a claude-code -y- Repository
- AThevon/genjutsu721
- Category
- Design
- Updated
- 3d ago
- License
- See repository
- Context cost
- Mediumabout 3,000 tokens
- Runs scripts
- No, instructions only
What it does
Jetpack Compose animation foundations - animate*AsState, AnimatedVisibility, Crossfade, updateTransition, SharedTransitionLayout, gestures.
Version-sensitive. Every API name, SDK gate and browser-support claim below was verified on 2026-09-08 against primary sources. What against, and when, is in
_jutsu/VERSIONS.md. If that date is old, re-verify before acting on a version number.
Compose Motion - Sub-skill
Jetpack Compose animation core. Loaded for Android Compose and Compose Multiplatform projects. Concise rules here. Deep-dive in
references/. Baseline: Jetpack Compose 1.12 (1.12.1 current stable, Sep 2026) - i.e. Compose BOM 2026.09.00. Modern stable APIs only - noswipeable, noanimateContentSizehacks whereAnimatedContentis correct. Anything below flagged 'Compose 1.x+' is a since marker, not the target.
API Decision Tree
| Need | API |
|---|---|
| Single value over time | animateFloatAsState, animateDpAsState, animateColorAsState, etc. |
| Visibility / mount-unmount | AnimatedVisibility(visible) { ... } |
| Crossfade between states | Crossfade(target) { state -> ... } |
| Multi-state coordinated | updateTransition(target).animateFloat { ... } |
| Manual control / interruption | Animatable(initialValue) + animateTo(...) |
| Looping / infinite | rememberInfiniteTransition().animateFloat(...) |
| Shared elements | SharedTransitionLayout + Modifier.sharedElement(...) (Compose 1.7+) |
| Layout swap with anim | AnimatedContent(target) { ... } |
| Drag / swipe | Modifier.draggable + Animatable.snapTo/animateTo, or Modifier.anchoredDraggable for snap-points |
Rule: climb the ladder only when needed. animate*AsState covers 70% of cases. Reach for Animatable only when you need to interrupt, chain, or read velocity.


