emilkowalski/skills

animate-expo

Build animations in React Native and Expo, making the decisions in the order that determines whether they feel right — should it animate, which thread it runs on, which properties, spring or timing, how the gesture hands off, how it degrades. Writes the implementation with Reanimated, Gesture Handler, Expo Router and expo-haptics. Use when animating anything in an Expo app, adding gestures, sheets, screen transitions, press feedback or haptics, or fixing motion that stutters on device. For web animation use `animate`.

28K installs 35K starsUpdated Aug 21, 2026License: MIT

Install

npx skills add emilkowalski/skills@animate-expo

Runs in your terminal. Adds the skill globally for Claude Code, Cursor, Codex and others; add -g -y to skip prompts.

What it does

Building Animations in Expo A construction skill for React Native. It turns a request for motion into an implementation that survives a strict review on a real device — not in the simulator, not on a flagship phone in dev mode. Mobile changes three things about animation, and everything in this skill follows from them: 1. There is no hover. Every affordance the web puts in hover has to live in press, position, or nothing. 2. There are two runtimes. Worklets (Reanimated 4) makes this explicit: the React Native runtime, where React renders and your app logic runs, and the UI runtime, where…

Excerpt from the skill's own SKILL.md. Read the full file on GitHub before installing: skills run with your agent's permissions.

View source on GitHub

Before you install

Skills are plain text instructions the agent follows, sometimes with scripts. Check the source, prefer repositories with many installs and stars, and read any script it ships.

Categories

Related skills

  • emil-design-eng

    emilkowalski/skills

    This skill encodes Emil Kowalski's philosophy on UI polish, component design, animation decisions, and the invisible details that make software feel great.

    246K installs 35KDesign & UIAnimationReact & Next.js
  • review-animations

    emilkowalski/skills

    Reviews animation and motion code against a high craft bar derived from Emil Kowalski's design engineering philosophy. Default to flagging; approval is earned.

    136K installs 35KDesign & UIAnimationCode review
  • animation-vocabulary

    emilkowalski/skills

    Reverse-lookup glossary that turns a vague description of a web animation or motion effect into its exact term ("the bouncy thing when a popover opens" → Pop in; "the iOS rubber-band scroll" → Rubber-banding). Use when the user asks "what's it called when…", or describes a motion effect without knowing its name and wants the right word to prompt an AI or designer with. For naming an effect, not designing or building one.

    124K installs 35KAnimationAI & agentsMobile
  • apple-design

    emilkowalski/skills

    Apple's approach to interface design and fluid, physical motion, translated for the web. Use when building or reviewing gesture-driven UI, spring animations, drag/swipe/sheet interactions, momentum and interruptible transitions, translucent materials and depth, typography (optical sizing, tracking, leading), reduced-motion, or the design foundations (feedback, spatial consistency, restraint) behind Apple-style interfaces.

    117K installs 35KDesign & UIAnimation
  • improve-animations

    emilkowalski/skills

    Survey a codebase's animation and motion code as a senior motion advisor, then produce a prioritized audit and self-contained implementation plans for other agents (or cheaper models) to execute. Read-only on source code — it plans improvements, it does not apply them. Use when the user asks to "improve the animations", "audit the motion", "make this app feel better", or wants a roadmap of animation fixes rather than a review of a single diff.

    108K installs 35KDesign & UIAnimationResearch
  • find-animation-opportunities

    emilkowalski/skills

    Search a codebase or UI for places that don't animate but should, and reject everything that shouldn't. Read-only; it proposes motion with exact values, it does not implement it. Use when the user asks "what could be animated here?" or wants to "make this feel more alive". For fixing existing animations, use improve-animations or review-animations instead.

    96K installs 35KDesign & UIAnimationCode review

Search skills

/skills/emilkowalski/skills/animate-expo/