kinetic-reels

Kinetic reels

Creas un reel como lo haría un motion designer, pero en código: una página HTML dibuja cualquier instante t del video, un navegador sin interfaz gráfica lo renderiza fotograma a fotograma a 30 fps, ffmpeg añade la voz y la música. La misma entrada, el mismo video, siempre.

SKILL significa la carpeta donde está este archivo. Ejecuta cada comando desde la carpeta del proyecto del usuario (donde están reels/ y .env). Usa python3 en Mac/Linux y python en Windows.

Antes del primer reel (una vez)

1. node "SKILL/scripts/doctor.mjs". Si imprime líneas FIX, ejecuta node "SKILL/scripts/setup.mjs" y luego haz lo que digan las líneas FIX restantes. No continúes hasta que imprima ALL GOOD.
2. El usuario necesita una clave de API de Gemini en .env (GEMINI_API_KEY=..., gratuita en https://aistudio.google.com/apikey). Nunca imprimas la clave, nunca subas .env al repositorio.
3. kinetic.config.json guarda su handle (la marca de agua), nombre y una foto cuadrada para la tarjeta final. new-reel.mjs lo crea la primera vez; pídele al usuario los tres valores y complétalos.

Hacer un reel (cada paso, en orden)

1. Tema y datos. Acuerda UN tema. Investígalo en fuentes de primera mano (documentación, el repositorio, la propia página del proveedor) y escribe cada afirmación en facts.md con la URL y la fecha en que la leíste. Sin dato, no hay afirmación.
2. Planifica los beats (muéstraselo al usuario antes de construir). 38 a 45 s para una lista de 5 a 7, hasta 60 s para un explicativo. Por escena: segundos, qué se dice, la imagen, el archivo exacto del recurso y de dónde viene. Si no se encuentra un recurso (un logotipo, una foto, una captura de pantalla), DETENTE y pídeselo al usuario. Nunca dibujes un logotipo falso, inventes una interfaz de usuario o generes una persona.
3. Inicia la carpeta: node "SKILL/scripts/new-reel.mjs" <slug> [--logo claude]. El logotipo de la esquina es el propio logotipo del tema (archivos en as/; añade el SVG real si falta).
4. Guion. Escribe tts.json (lo que dice la voz, dividido en partes de gancho / cuerpo / remate / CTA, cada una con su propio estilo) y script.txt (los subtítulos, las mismas palabras, el mismo orden). Reglas: references/SCRIPT.md. Etiquetas y estilos: references/VOICE.md.
5. Voz: python "SKILL/scripts/voice.py" reels/<slug> luego python "SKILL/scripts/tighten.py" reels/<slug> (pausas a 0.34 s, velocidad normal). Escucha la grabación o compruébala con cualquier transcriptor: si falta una línea o un nombre está mal, corrige el texto y ejecuta voice.py de nuevo.
6. Subtítulos + sincronización: python "SKILL/scripts/captions.py" reels/<slug> imprime DUR, SCN y CAPS. Pégalos en reel.js. Ajusta manualmente un ancla ([email protected]) si una palabra aparece antes o después.
7. Recursos reales: capturas de pantalla con node "SKILL/scripts/docshot.mjs" <url> reels/<slug>/as/<name>.png [--selector "css"], logotipos como SVG del proveedor o de SKILL/assets/logos. Cada recurso lleva una pequeña línea de fuente en pantalla. Detalles: references/ASSETS.md.
8. Construye reel.js. Lee primero examples/claude-code-shortcuts/reel.js: es el reel de oro y muestra todos los patrones. Piezas que puedes usar: references/COMPONENTS.md. Las imágenes viven en y 260 a 1100, los subtítulos ocupan y 1150 a 1570.
9. Evalúa: node "SKILL/engine/shot.cjs" reels/<slug> audit debe imprimir LAYOUT PASS. Luego node "SKILL/engine/shot.cjs" reels/<slug> prev 0 <un tiempo dentro de cada escena> y MIRA cada fotograma (abre los JPG). Corrige y repite. Verifica los 5 fotogramas del gancho en 0, 0.5, 1, 2, 3 s contra references/SCRIPT.md (reglas del gancho).
10. Sonido: edita mix.py (DUR, SCN, un sonido por cambio de imagen; references/SOUND.md), ejecuta python reels/<slug>/mix.py. Una banda diferente: python "SKILL/scripts/music.py" search "lofi chill" luego pull <id> reels/<slug> (solo CC0).
11. Renderiza: node "SKILL/engine/render.cjs" reels/<slug> luego python "SKILL/scripts/finish.py" reels/<slug> (debe imprimir PASS) y node "SKILL/engine/shot.cjs" reels/<slug> cover 0.6.
12. Entrega reels/<slug>/out/final.mp4 y out/cover.jpg, además de un pie de foto con las palabras clave del tema en la línea 1, 3 a 5 hashtags y las fuentes de facts.md.

Reglas que mantienen a la gente mirando (de resultados reales, no teoría)

• El remate va en la línea 1. "7 atajos de Claude Code que casi nadie usa" vence a "Hoy quiero mostrarte algo".
• Movimiento en el fotograma 0. Inicia las entradas en tiempos negativos (popV(t,-0.3,...)) para que el primer fotograma ya se esté moviendo. Nunca un primer fotograma en blanco o estático.
• Una misma apariencia del primer al último fotograma. Nunca empieces oscuro y cambies a claro: se lee como un video nuevo y la gente desliza.
• Para listas: un encabezado que cuente (ATAJO 3/7 + puntos), y un bucle abierto en la línea 2 ("y el número siete me ahorra horas") que se cierra al final.
• Una imagen nueva cada 0.8 a 1.5 s. Muestra el efecto, no lo describas.
• La voz está en primer plano. La música es suave (los valores por defecto en sfx.mix_reel están probados).
• La CTA está escrita para este reel solamente (guardarlo, enviarlo a la persona adecuada, o una pregunta real). Nunca "sígueme para más".

Cuando algo falla

references/TROUBLESHOOTING.md. Los problemas comunes: no hay ffmpeg en PATH, Chromium no instalado, 429 de la API de voz (límite gratuito por ahora, espera o activa la facturación), un CLIP del juez (texto más ancho que su tarjeta: acórtalo o ensancha la tarjeta hasta 920 px).