Skip to content

Expo Motion Animation Builder

Builds smooth, device-tested React Native and Expo animations, gestures and haptics.

Stars
49,023
Licence
MIT
Files
2 files

What it does

When installed, the agent acts as a mobile animation engineer for React Native and Expo apps. Before writing code it checks whether an animation is worth adding at all, names its purpose, and picks the cheapest tool that works, such as native navigation, CSS-style transitions, or gesture-driven shared values running on the UI thread. It aims for motion that runs smoothly on a real release build on slower phones, with reduced-motion fallbacks included from the start.

Great for

  • React Native or Expo developers building press feedback, sheets, gestures or onboarding motion
  • Teams who want animations that stay smooth on mid-range Android devices
  • Developers who want guidance on when not to animate

Skip it if

  • Web-only projects, since the guidance is specific to mobile and hover-free interaction
  • Teams not using Expo or React Native, where the library and navigation advice would not apply
  • Anyone expecting a quick visual preset; the skill often recommends writing no animation at all, which may frustrate some requests

Try asking

  • “Add a smooth swipe-to-dismiss gesture to this card in my Expo app”
  • “Animate the bottom sheet for my settings modal using the native form sheet”
  • “Make the success checkmark after checkout feel delightful without slowing the app”
  • “Add pull-to-refresh with haptic feedback to my feed screen”
Step-by-step guide: how to use Expo Motion Animation BuilderInstall, first run, examples, tips and FAQs

Install in 3 steps

  1. 1

    Download the skill

    The ZIP contains the 2 original files, the MIT licence and an attribution note.

    animate-expo.zip
  2. 2

    Add it to your agent

    Claude Code (all projects)

    mkdir -p ~/.claude/skills && unzip animate-expo.zip -d ~/.claude/skills/

    Claude Code / Agent SDK (this project only)

    mkdir -p .claude/skills && unzip animate-expo.zip -d .claude/skills/

    Claude apps (web/desktop): Settings → Capabilities → Skills → Upload skill, and choose the ZIP.

  3. 3

    Ask for the task

    No special command needed — the agent reads the skill's description and loads it when your request matches. Try one of the prompts above.

Get better results

  • Give the agent your project's Expo SDK version so it can pick matching package versions with npx expo install
  • Describe the purpose of the motion (feedback, state change, delight) so the gate step can judge whether it is needed
  • Test the result on a release build on your slowest supported device, as the skill itself requires

What's inside

  • RECIPES.md
  • SKILL.md

Redistributed unmodified from sickn33/agentic-awesome-skills under the MIT licence. The assessment was drafted with AI from the skill's files on 2026-11-02. Skills can instruct your agent to run code — read SKILL.md and any scripts before installing.