hyperframes
heygen-com · Apache-2.0 · 60,170 estrellasEscribe HTML y renderiza vídeo. Línea de tiempo con búsqueda libre, fotogramas deterministas y un estudio de edición. Es el motor sobre el que se construye MotionKit.
Directorio · revisado el 10 de octubre de 2026
Skills de movimiento de código abierto para Claude Code y Codex
No hace falta pagar a nadie para crear vídeo con un agente de programación. Estos son los proyectos de código abierto que conviene conocer, en qué destaca cada uno y la licencia con la que se distribuye.
Son proyectos independientes de sus propios autores. MotionKit no está afiliado a ninguno de ellos ni incluye su código. Los enlazamos porque son buenos. El número de estrellas y las licencias son los que figuraban en GitHub el 10 de octubre de 2026; consulta el repositorio antes de fiarte de cualquiera de los dos datos.
Motores
Los renderizadores que convierten código en vídeo. La mayoría de las skills de abajo se apoyan en uno de ellos.
remotion
remotion-dev · Remotion License · 63,004 estrellasCrea vídeos con componentes de React. Tiene su propia licencia: gratuita para particulares y equipos pequeños, de pago para empresas más grandes, así que lee los términos antes de un uso comercial.
Estilos editoriales y explicativos
Texturas de papel, recortes y ritmo de documental.
vox-explainer-skill
CK42BB · MIT · 110 estrellasUna skill de Claude Code que toma un tema y genera un vídeo explicativo de estilo editorial: guion, fotogramas clave, animación, locución y música.
vox-style-animation
Cele-san · MIT · 2 estrellasUn estilo de motion graphics editorial empaquetado como style pack de HyperFrames, con un método para capturar un estilo en tu propio pack.
Leslie-vox-style.skill
Ai-Leslie · MIT · 0 estrellasSkills de Codex para narrativa documental, collage editorial y motion graphics de estilo explicativo.
motion-skill
LunaAI519 · MIT · 0 estrellasConvierte una imagen de referencia en un corto de estilo scrapbook retro, usando modelos de imagen y de vídeo para los fotogramas. Incluye una autocomprobación de derechos de autor. Documentación en chino.
Animación dibujada a mano y de personajes
Para cuando un diagrama debe parecer un boceto o un personaje tiene que actuar.
ClaudeAnimationBase
JohnHeibel · MIT · 1,000 estrellasUn kit de inicio para animación de dibujos animados pintados a mano con p5.js: un personaje con 31 emociones interpretadas y una guía para el modelo.
HandDraw-Skill
ToBeWin · MIT · 3 estrellasUn motor determinista de vídeo dibujado a mano basado en SVG, Remotion y FFmpeg: explicaciones en pizarra dibujadas trazo a trazo.
Vídeos de producto y de lanzamiento
Recetas de planos, storyboards y formatos promocionales.
video-shotcraft
Vincentwei1021 · Apache-2.0 · 11,138 estrellasVídeos de producto con estética cinematográfica creados con Remotion para Claude Code y Codex: una amplia biblioteca de tarjetas con recetas de planos y vistas previas de movimiento.
make-awesome-video
NewTurn2017 · MIT · 4 estrellasUn flujo de dirección para vídeos de lanzamiento: analiza referencias, escribe tres storyboards, genera imágenes fijas, renderiza y después da notas de dirección.
brewreel
Finderchangchang · Apache-2.0 · 161 estrellasVídeos promocionales en formato vertical a partir de un briefing de producto, pensados para funcionar con modelos de bajo coste. Incluye recetas por sector y una revisión de la normativa publicitaria. Documentación en chino.
html-animation
acelera-agency · MIT · 9 estrellasLogotipos animados, tipografía cinética y vídeos de marca con precisión de fotograma en un único archivo HTML, que luego se exporta a vídeo.
Principios y elementos básicos
No es un estilo, sino el conocimiento que hace que cualquier estilo se mueva bien.
motion-design-skill
LottieFiles · MIT · 2,075 estrellasPrincipios de motion design escritos para agentes de IA: tiempos, easing, coreografía y los principios clásicos de la animación adaptados a las interfaces.
skills
VideoZero · Apache-2.0 · 73 estrellasUna colección de skills para generar vídeo estructurado, al estilo de diagramas, basada en Motion Canvas.
Cómo elegir
- ¿Quieres un estilo concreto? Empieza por una skill de estilo de los grupos editorial o dibujado a mano.
- ¿Quieres entender el oficio? Lee primero la skill de principios de motion design. Mejora todo lo demás.
- ¿Vas a crear la tuya? Elige un motor. HyperFrames es HTML puro y Apache-2.0; Remotion es React con su propia licencia.
Dónde encaja MotionKit
MotionKit es un paquete de pago sobre HyperFrames. Lo que pagas es lo que el código abierto no ofrece gratis: 24 estilos terminados con un ejemplo completo cada uno, presentaciones interactivas y PowerPoint a partir del mismo contenido, créditos de locución y enlaces para compartir alojados. Si los proyectos gratuitos de arriba cubren lo que necesitas, úsalos.
¿Conoces un proyecto que debería estar aquí? Escribe a support@motionforclaude.com.
Crea tu primer vídeo con animación esta noche
Un comando y después le pasas un documento a tu agente.