Pular pro conteúdo

Expo Animation skill

O Claude decide primeiro se vale animar e depois escreve a animação do jeito que não engasga, nem em Android de três anos atrás.

por ExpoPublicada pela própria empresa

instalações
15,4 mil
estrelas no GitHub
3.021
No skills.sh desde
agosto de 2026
Licença
MIT

Atualizada no GitHub em 24 de outubro de 2026. Dados conferidos em 26 de outubro de 2026, no skills.sh e no GitHub.

O que ela faz

Segue uma ordem fixa de decisões. Primeiro, se deve animar: o que a pessoa vê mais de 100 vezes por dia, como troca de aba, não anima. Depois vêm o propósito, a ferramenta mais barata que resolve, as propriedades, mola ou curva de tempo, e como fica com o movimento reduzido ligado.

Escreve com Reanimated, Gesture Handler, Expo Router e expo-haptics. Roda o movimento na thread de interface, longe do JavaScript do app, anima só transform e opacity e usa as molas e curvas da tabela, sem valor no chute. Prefere o que o sistema já tem pronto, como a sheet nativa e a barra de abas nativa.

Traz receitas prontas de toque com resposta, sheet que fecha arrastando, arrastar pro lado pra apagar, cabeçalho que encolhe, entrada de lista, tela que acompanha o teclado e indicador de aba. No fim, diz o que testar no aparelho, num build de produção.

Nas palavras de quem fez

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…

Expo, no SKILL.md

Quando usar

  • Dar resposta ao toque nos botões do app
  • Fazer uma sheet que fecha quando a pessoa arrasta pra baixo
  • Arrumar uma animação que engasga no celular
  • Pôr vibração no momento certo de um gesto
  • Criar a transição entre telas no Expo Router

Depois de instalar, é só pedir assim

  • Faz o card da lista sumir arrastando pro lado, com vibração quando passar do ponto de apagar
  • Essa animação do carrinho trava no Android, descobre por quê e corrige
  • Põe um efeito de toque nos botões do app inteiro

Segurança

Gen Agent Trust Hub, Socket e Snyk leem o código da skill atrás de comando perigoso, dado vazando e instrução escondida. Alerta não é reprovação: quer dizer que vale ler o que a skill faz antes de instalar.

  • Gen Agent Trust HubPassou
  • SocketPassou
  • SnykPassou

Perguntas

Como instalar a Expo Animation no Claude Code?

Toca em Levar, aqui nesta página, e deixa seu nome, e-mail e WhatsApp (é uma vez só). Aparece uma frase pronta: cola ela no Claude Code, que ele mesmo instala a Expo Animation, e a skill passa a valer na próxima conversa. A mesma frase serve no Codex. Se preferir fazer na mão, o passo a passo está em como instalar skills no Claude Code.

O que precisa pra funcionar?

Um app em Expo ou React Native com a Nova Arquitetura, que o Reanimated 4 exige. As bibliotecas entram com npx expo install. Pra saber se ficou bom, a própria skill manda testar num build de produção no celular, não no Expo Go nem no simulador.

Serve pra animação de site?

Não. É só pra apps em React Native e Expo. Pra animação na web, o SKILL.md indica outra skill, a animate.

Roda no Codex e no Antigravity?

Sim. É texto com regras, tabelas e receitas de código, sem chave nem serviço pago.

Levar essa skill

1x expo-animationR$ 0,00

TotalR$ 0,00

A skill sai aqui mesmo, na hora. Seus dados eu uso pra falar com você sobre o MazyOS.

Levar precisa do JavaScript ligado. O código da skill está no GitHub: github.com/expo/skills

Aprenda a usar

Mais da loja Expo

Ver a loja Expo