# Android Motion Animations

> Use when creating advanced Compose animations, shared element transitions, or physics-based motions for Android.

- **Type:** Skill
- **Install:** `agentstack add skill-prasad-vennam-awesome-android-ai-agent-skills-android-motion-animations`
- **Verified:** Yes — security-reviewed for prompt injection and unsafe behavior
- **Seller:** [prasad-vennam](https://agentstack.voostack.com/s/prasad-vennam)
- **Installs:** 0
- **Category:** [Agent Skills](https://agentstack.voostack.com/c/agent-skills)
- **Latest version:** 0.1.0
- **License:** MIT
- **Upstream author:** [prasad-vennam](https://github.com/prasad-vennam)
- **Source:** https://github.com/prasad-vennam/Awesome-Android-AI-Agent-Skills/tree/main/skills/android-motion-animations

## Install

```sh
agentstack add skill-prasad-vennam-awesome-android-ai-agent-skills-android-motion-animations
```

Requires the [AgentStack CLI](https://agentstack.voostack.com/docs/cli). Works with Claude Code, Cursor, and any MCP-compatible agent.

## About

# Android Motion & Animations 🎭✨

Expert strategies for building fluid, high-performance, and delightful user experiences using the Jetpack Compose animation system.

## ⚡ When to Use
- **Screen Transitions**: Implementing Shared Element Transitions (Compose 1.7+).
- **Interactive UI**: Creating elastic or physics-based movements.
- **Dynamic Layouts**: Animating content size changes or visibility.
- **Micro-interactions**: Adding subtle "magic" to buttons, icons, or cards.
- **Lottie/Rive**: Integrating complex vector-based animations.

## 🏗️ The 4 Layers of Compose Animation

### 1. High-Level (Simple)
- `AnimatedVisibility`: Slide/Fade in and out.
- `AnimatedContent`: Transition between different UI states.
- `Modifier.animateContentSize()`: Smoothly resize a container as children change.

### 2. Intermediate (Transition)
- `updateTransition`: Manage multiple animation states (e.g., Expanded/Collapsed).
- `rememberInfiniteTransition`: For looping animations (e.g., Shimmer).

### 3. Low-Level (Control)
- `Animatable`: Precise control over a single value (Float, Color).
- `AnimationSpec`: Customizing `spring`, `tween`, or `keyframes`.

### 4. Layout-Level (Lookahead)
- Use **LookaheadLayout** (now built into Compose) to calculate intermediate positions for complex reordering or morphing.

## 🚀 Premium Motion Patterns

### 1. Shared Element Transitions (The Gold Standard)
- Use `SharedTransitionLayout` to morph an image from a list into a detail view.
- **Rule**: Give each shared element a unique `key`.

### 2. Physics-Based Motion (Springs)
- Avoid rigid `tween` (linear/ease). Use `spring` for a natural feel.
- **Damping Ratio**: `Spring.DampingRatioLowBouncy` for personality.
- **Stiffness**: `Spring.StiffnessMedium` for responsiveness.

### 3. Content Shimmer
- Use a `Brush.linearGradient` with an infinite transition to create skeleton loading effects.

## 📦 Performance & Tips

- [ ] **State Read Isolation**: Prefer "Lambda modifiers" (e.g., `Modifier.graphicsLayer { ... }`) to avoid excessive recompositions during high-frequency animations.
- [ ] **Avoid Clipping**: Use `clip = false` on parents if elements need to overlap during transitions.
- [ ] **Hardware Acceleration**: Always use `graphicsLayer` for translations, rotations, and scale to ensure GPU rendering.

## 📏 Design Best Practices

- **Duration**: Keep UI transitions between **200ms and 400ms**.
- **User Control**: Ensure animations can be skipped or disabled via system accessibility settings.
- **Purpose**: Every animation should serve a purpose (e.g., providing feedback or guidance).

## 🧪 Verification & Checklist

- [ ] **No Jank**: Check for dropped frames using the "Profile GPU Rendering" tool.
- [ ] **Accessibility**: Does the animation obey "Reduce Motion" settings?
- [ ] **Recomposition**: Does the animation cause the whole screen to recompose? (Optimize!)
- [ ] **Edge Cases**: What happens if the animation is interrupted?

## 🔗 Related Resources
- [Compose Animation Guide](https://developer.android.com/jetpack/compose/animation)
- [Shared Element Transitions](https://developer.android.com/jetpack/compose/animation/shared-elements)
- [Lottie for Android](https://github.com/airbnb/lottie-android)

## Source & license

This open-source skill is cataloged on AgentStack and links to its original source — we do not rehost the code.

- **Author:** [prasad-vennam](https://github.com/prasad-vennam)
- **Source:** [prasad-vennam/Awesome-Android-AI-Agent-Skills](https://github.com/prasad-vennam/Awesome-Android-AI-Agent-Skills)
- **License:** MIT

Install and usage instructions live in the source repository linked above.

## Pricing

- **Free** — Free

## Security capabilities

Automated source analysis of v0.1.0 — what this tool can access:

- **Network access:** no
- **Filesystem access:** no
- **Shell / process execution:** no
- **Environment & secrets:** no
- **Dynamic code execution:** no

*"Yes" means the capability is present in the source — more access means more to trust, not that it is unsafe.*


## Versions

- **0.1.0** — security scan: passed — Imported from the upstream source.

## Links

- Listing page: https://agentstack.voostack.com/l/skill-prasad-vennam-awesome-android-ai-agent-skills-android-motion-animations
- Seller: https://agentstack.voostack.com/s/prasad-vennam
- Browse the marketplace: https://agentstack.voostack.com/browse

---
Listed on AgentStack — the marketplace for AI agent skills and MCP servers. Every listing is security-reviewed. Creators keep 70%.