threejs-animation
Cria animações em 3D usando a biblioteca Three.js. Permite animar objetos, misturar movimentos e dar vida a modelos 3D em projetos web.
O que ela faz
Esta ferramenta ajuda a criar animações em 3D usando a biblioteca Three.js. Ela permite animar objetos, personagens (com esqueletos) e até mesmo expressões faciais, além de misturar diferentes animações.
Quando usar
- ✓Quando você quer que objetos em uma cena 3D se movam.
- ✓Ao usar modelos 3D que já vêm com animações (como arquivos GLTF).
- ✓Para criar movimentos que não são pré-definidos, mas gerados pelo código.
Exemplo do que pedir para a IA
“Crie uma animação para um cubo que gira e muda de cor em Three.js.”
Quer saber mais? Abra as seções abaixo.
Como usar
O jeito mais fácil: copie a mensagem abaixo e cole no Claude, ChatGPT, Cursor ou outra IA. Ela lê a skill e segue as instruções.
Link da skill
Mensagem pronta para colar
Como funciona
A ferramenta usa um sistema chamado 'keyframe animation' onde você define os estados de um objeto em diferentes momentos. Ela também pode lidar com animações mais complexas de personagens e misturar várias animações para criar movimentos fluidos.
Instalação
Jeito mais fácil: copie o link da skill e cole no Claude, ChatGPT ou Cursor pedindo para seguir as instruções.
No terminal (Claude Code, Codex, Cursor), na pasta do projeto:
npx skills add sickn33/agentic-awesome-skills --skill threejs-animationOu baixe só o arquivo:
curl -L https://raw.githubusercontent.com/sickn33/agentic-awesome-skills/main/plugins/agentic-awesome-skills-claude/skills/threejs-animation/SKILL.md -o SKILL.mdConteúdo técnico (SKILL.md)
Tradução do texto original do autor no GitHub. Os comandos e códigos estão como no original.
Animação com Three.js
Guia Detalhado
Leia o guia detalhado antes de executar esta habilidade. Ele contém o procedimento completo e o material de referência. Considere seus requisitos de segurança, pré-requisitos e validação como obrigatórios. Para um trabalho focado, carregue as seções relevantes; para um trabalho de ponta a ponta, leia o guia completamente.
Quando Usar
- Você precisa animar objetos, rigs, morph targets ou animações GLTF importadas no Three.js.
- A tarefa envolve mixers, clips, keyframes, movimento procedural ou mistura de animações.
- Você está construindo comportamento de movimento em uma cena Three.js em vez de apenas renderização estática.
Limitações
- Use esta habilidade apenas quando a tarefa corresponder claramente ao escopo descrito acima.
- Não trate a saída como substituta para validação específica do ambiente, testes ou revisão especializada.
- Pare e peça esclarecimentos se os inputs necessários, permissões, limites de segurança ou critérios de sucesso estiverem ausentes.
Perguntas frequentes
O que são 'keyframes'?
São como 'fotos' importantes em uma animação. Você diz como algo deve estar em um 'keyframe' (por exemplo, posição e cor) e a ferramenta calcula os movimentos entre eles.
O que é 'animação de esqueleto'?
É uma técnica usada para animar personagens ou objetos complexos. O objeto tem um 'esqueleto' interno, e animar o esqueleto move as partes do objeto.
Posso usar animações de outros programas?
Sim, especialmente se forem arquivos no formato GLTF, que são comumente usados para modelos 3D com animações.
Detalhes
Descrição original do autor
Three.js animation - keyframe animation, skeletal animation, morph targets, animation mixing. Use when animating objects, playing GLTF animations, creating procedural motion, or blending animations.
Popularidade
- Estrelas no GitHub
- 48 mil
- Posição no ranking
- #4370
- Licença
- MIT
- Atualizada em
- 15/10/2026
Comentários
- …
Mais skills deste repositório
00-andruia-consultant
Ajuda seu agente a iniciar ou melhorar projetos de IA. Ele analisa código, sugere ferramentas e cria planos de ação em espanhol.
sickn33/agentic-awesome-skills
007
Faz seu agente realizar auditorias de segurança e modelagem de ameaças. É útil para proteger projetos contra ataques e vulnerabilidades.
sickn33/agentic-awesome-skills
10-andruia-skill-smith
Ajuda seu agente a criar ou melhorar ferramentas de IA. Ele define como as ferramentas funcionam, escreve a documentação e valida a estrutura.
sickn33/agentic-awesome-skills
20-andruia-niche-intelligence
Faz seu agente criar um resumo sobre um setor específico. É útil para entender o contexto, regras, padrões de uso e riscos de um projeto, usando fontes confiáveis.
sickn33/agentic-awesome-skills
Skills parecidas
blender-motion-state-inspection
Permite inspecionar detalhes de animações em 3D. É útil para verificar poses, movimentos e o alinhamento de personagens em animações.
affaan-m/ECC
manim-video
Faz seu agente criar vídeos explicativos animados. Ele usa o Manim para gerar gráficos e diagramas claros para conceitos técnicos.
affaan-m/ECC
remotion-video-creation
Orienta seu agente na criação de vídeos usando React com a biblioteca Remotion. Ele cobre boas práticas para animações, áudio, legendas e outros elementos visuais.
affaan-m/ECC