Repolode
AbubakrChan

AbubakrChan/product-launch-motion

Una skill de Claude Code que convierte la URL de un sitio web en un video de lanzamiento de producto a 60 fps, creado con HTML, efectos de sonido sincronizados con la música y desenfoque de movimiento.

Estrellas
322
Forks
47
Issues abiertos
0
Último commit
hace 5 días

¿Qué es?

Product Launch Motion es una skill de Claude Code que recibe la URL de un sitio web de producto y dirige, crea y renderiza un video de lanzamiento corto. Claude analiza el sitio, escribe la historia, distribuye cada escena en una cuadrícula de tiempos basada en una pista musical y genera un MP4 a 60 fps con efectos de sonido sincronizados.

Cada fotograma es HTML calculado como una función pura del tiempo, por lo que los renders son deterministas y se pueden comprobar compás a compás. Playwright captura subfotogramas y ffmpeg aplica el desenfoque de movimiento. La animación utiliza resortes amortiguados de forma cerrada, y un único elemento en pantalla cambia de estado mediante una transformación gradual en lugar de cortes bruscos. La skill requiere Claude Opus 5.5 y necesita Node 20+, Playwright, FFmpeg y Python 3 con numpy.

El repositorio también conserva la skill anterior v1, que crea películas narradas con GSAP y HyperFrames, en una carpeta legacy.

Funciones clave

  • 01Crea un video de lanzamiento a partir de la URL de un sitio web, sin necesidad de edición manual.
  • 02Sitúa el movimiento y los efectos de sonido en una cuadrícula de tiempos basada en una pista musical.
  • 03Renderiza el video a 60 fps con desenfoque de movimiento de ffmpeg.
  • 04Usa resortes de forma cerrada y un único elemento que se transforma gradualmente, en lugar de cortes bruscos.
  • 05Admite un paso opcional de vidrio en WebGL para efectos de formas 3D.

Casos de uso

  • Crear un video de lanzamiento de producto para una landing page de SaaS sin usar un editor de video.
  • Producir películas promocionales cortas con sonido sincronizado a partir de un sitio web existente.
  • Prototipar ideas de diseño de movimiento como HTML determinista renderizado a video.

Inicio rápido

  1. 1

    Instala la skill

    npx skills add AbubakrChan/product-launch-motion
  2. 2

    En Claude Code, pide un vídeo e incluye la URL de tu sitio

Antes de usarlo

  • Necesitas Claude Code. El README recomienda Opus 5.5, ya que los modelos más pequeños pasan por alto muchos detalles.
  • Para renderizar, necesitas Node 20+, Playwright, FFmpeg y Python 3 con numpy, todo instalado localmente.
  • Los vídeos de muestra se crearon para Cheerful y no tienen licencia para reutilizarse, aunque la skill tenga licencia MIT.

Temas

Preguntas frecuentes

¿Qué es product-launch-motion?
Una skill de Claude Code que convierte la URL de un sitio web en un video de lanzamiento de producto a 60 fps, creado con HTML, efectos de sonido sincronizados con la música y desenfoque de movimiento. Product Launch Motion es una skill de Claude Code que recibe la URL de un sitio web de producto y dirige, crea y renderiza un video de lanzamiento corto. Claude analiza el sitio, escribe la historia, distribuye cada escena en una cuadrícula de tiempos basada en una pista musical y genera un MP4 a 60 fps con efectos de sonido sincronizados.
¿product-launch-motion es gratuito? ¿Qué licencia tiene?
product-launch-motion es open source bajo la licencia MIT. Revisa los términos de la licencia antes de usarlo en productos comerciales.
¿product-launch-motion sigue mantenido?
Mantenimiento activo. El último commit de product-launch-motion fue el 15 oct 2026.
¿Para qué puedo usar product-launch-motion?
Crear un video de lanzamiento de producto para una landing page de SaaS sin usar un editor de video. Producir películas promocionales cortas con sonido sincronizado a partir de un sitio web existente. Prototipar ideas de diseño de movimiento como HTML determinista renderizado a video.
¿Cómo se instala product-launch-motion?
Instala la skill: npx skills add AbubakrChan/product-launch-motion En Claude Code, pide un vídeo e incluye la URL de tu sitio
¿Dónde consigo product-launch-motion?
El código fuente y las instrucciones de instalación están en GitHub: https://github.com/AbubakrChan/product-launch-motion

Resumen generado por IA a partir del README del proyecto. Las estadísticas de GitHub se actualizan a diario.

Proyectos relacionados