make-2d-video

estudio make-2d-video: pipeline completo de video

Convierte una voz en off (más un guion opcional) en un MP4 terminado donde cada fotograma es dibujado por código (HTML canvas + Three.js), capturado fotograma por fotograma en Chromium sin cabeza y codificado con ffmpeg. No se usan modelos generativos de imagen o video, por lo que los personajes se mantienen consistentes y el texto se ve nítido. Inventa los visuales nuevos para cada guion; solo el estilo es fijo.

Recursos incluidos (directorio base de esta habilidad):

• kit/: el estudio probado (motor de renderizado, herramientas, audio, el proyecto de referencia examples/reaction-time). Instálalo en el espacio de trabajo como make-2d-video-studio/ (ver references/install.md).
• references/install.md: instalación, tabla de dependencias, diagnóstico, autoevaluación.
• references/style-bible.md: el aspecto (personajes, escenarios, iluminación, cámara, edición, gráficos, reglas 9:16, prohibiciones). Léelo completamente antes de diseñar cualquier plano.
• references/style-bible-toon.md: el aspecto para el elenco toon (cast: "toon"). Cuando el elenco es toon, síguelo en lugar de las partes de style-bible.md que entren en conflicto (luz de borde, sin contornos, siluetas negras).
• references/story-breakdown.md: escritura de story/bible.md y story/shots.json, más reglas de ritmo.
• references/engine-api.md: la API de escena, configuración y esquemas de shots.json, y la referencia de los tres kits.
• references/sound-design.md: el plan de música, biblioteca de SFX, ambiente y niveles.
• references/render-qc.md: vista previa y renderizado final, guía de velocidad, lista de control de calidad, solución de problemas.

Los comandos de etapa de este plugin vuelven a ejecutar una etapa: /new-video (etapas 1–4), /video-styles (5), /render-video (6 y 8), /video-sound (7). Al ejecutar de principio a fin, sigue este archivo y carga las referencias según las necesite cada etapa.

Reglas de oro

0. Pregunta primero el idioma del video. Antes de cualquier otra pregunta, instalación, archivo o edición, pregunta al usuario en qué idioma está el video (Etapa 0). Cada paso posterior usa ese idioma. Háblale al usuario en el idioma en que escribe.
1. Mantén la narración intacta. Nunca reescribas, añadas, elimines o reordenes palabras habladas. Cada plano ilustra las palabras que se dicen mientras está en pantalla.
2. Mismo estilo, imágenes nuevas. Inventa escenarios, accesorios, personajes y acciones a partir de este guion. Usa examples/reaction-time solo para aprender la API.
3. Muestra lo que se dice, literal y específicamente. Las líneas abstractas se convierten en metáforas visuales, diagramas o primeros planos de reacciones.
4. Boceto, mira, corrige, luego renderiza. Abre las hojas de contactos y las imágenes fijas tú mismo (lee los PNG) antes de cualquier renderizado completo. Renderizar es lento; mirar es rápido.
5. Tres puntos de control del usuario: opciones de configuración, elección de estilo a partir de muestras renderizadas, y la vista previa antes del renderizado final. Si el usuario no está, toma los valores predeterminados, indica lo que se asumió y continúa.
6. Los archivos son la verdad. Cada video vive en make-2d-video-studio/projects/<slug>/, y story/shots.json posee toda la sincronización. Un video = una carpeta autocontenida: config.json, input/, assets/ (+ assets/_raw/ para imágenes de IA no seleccionadas), scenes/, story/ (incl. plan.md notas de traspaso), timeline/, jobs/ (+ jobs/logs/), build/ (temporal, seguro de eliminar), out/ (solo entregables). Nunca coloques archivos por video en la raíz del estudio o en una carpeta separada _jobs/.
7. Solo las personas que aparecen en la historia aparecen en pantalla (videos de noticias/explicativos). Sin mascotas del canal o personajes de narrador/presentador (por ejemplo, nhoc, ongdo) a menos que el usuario los solicite. Cada persona nombrada en las noticias tiene su propio toon (peinado característico, gafas, vestimenta, según las reglas de caricatura en style-bible-toon.md) más una etiqueta con nombre, no una figura genérica o una silueta. Las personas privadas o sin nombre (sospechosos no confirmados, familiares) permanecen anónimas: un toon anónimo genérico o una silueta con una etiqueta de rol.

Valores predeterminados del canal (channel.json)

Antes de la Etapa 0, busca channel.json junto a make-2d-video-studio/ (la carpeta del espacio de trabajo que contiene el estudio), luego en la carpeta actual, luego en el directorio base de esta habilidad (la copia que viaja con la habilidad; en una máquina nueva, cópiala junto al estudio una vez instalado). Puede contener name, lang, aspect, resolution, fps, style, cast (stick | 3d | toon), captions, shotsPerMin y music. Cada clave presente es el valor predeterminado para este video: omite las preguntas que responde (idioma, aspecto, resolución, fps, subtítulos, elección de estilo en la Etapa 5) y confírmalas en UNA línea, por ejemplo: "Kênh Tí Tò Mò: tiếng Việt, 9:16, 1080p, 30 fps, dusk, có phụ đề." Pregunta solo lo que aún se desconoce (voz en off, guion, título). name es el nombre del canal para las tarjetas finales.

Los tres estilos de dibujo (elige UN elenco por video)

cast	Aspecto	Motor	Biblia de estilo
stick (predeterminado)	Figuras de palo negras con luz de borde, escenarios 2.5D cinemáticos y atmosféricos	rig2d.js (+ three-kit.js para planos de establecimiento 3D)	style-bible.md
3d	Elenco 3D: cabezas planas blancas, cuerpos de pera, extremidades de fideo	rig3d.js, rig3d-cast.js (kind: '3d', rig3d: true)	style-bible.md → "2D cast or 3D cast"
toon	Dibujo animado 2D plano con contornos: cabezas redondas color piel, cuerpos de frijol, extremidades de palo, contornos gruesos, línea hirviente, texto cómic, gags visuales, caricaturas de figuras públicas; accesorios 3D opcionales con sombreado toon y brillo	toon.js, toon3d.js	style-bible-toon.md

channel.json → cast decide; de lo contrario, pregunta una vez en la Etapa 1 (una línea por estilo). Para toon, el estilo de color predeterminado es paper (los grados cinematográficos también funcionan pero oscurecen los colores planos). Estudia examples/toon-demo/ antes de escribir planos toon.

Modo explicativo de noticias (elenco toon, formato principal del canal)

Cuando el usuario solicita un explicativo de noticias / finanzas / tecnología / multimillonarios / activos de inversión, sigue kit/CLAUDE.md (instalado como make-2d-video-studio/CLAUDE.md). Reemplaza las etapas 1–8 a continuación con un flujo de trabajo controlado: 0 selección de tema (3–5 candidatos con solidez de fuente, riesgo y vida útil) ✋ → 1 guion con fuentes + 3 títulos + concepto de miniatura ✋ → 2a voz y 2b manifiesto de activos (story/assets.md: qué dibujar, cantidad, hecho con Flow / imagen AI del usuario / código toon / three.js + bloom) ✋ → 3 imágenes + hojas de personajes ✋ → 4 sincronización + escenas → 5 hoja de contacto de todos los planos + demo de 30 s ✋ → 6 renderizado completo → 7 paquete (miniatura, descripción con fuentes, capítulos, lista de enlaces obsoletos) ✋ → 8 subida ✋ → 9 revisión de estadísticas. Imágenes de escena: sin personas, sin texto, sin logotipos. Miniaturas: pueden contener personas (estilizadas, nunca falsas fotorrealistas de personas reales) y ≤ 4 palabras de texto. Nunca subas a través de la API de datos de YouTube desde un proyecto no auditado (las subidas se bloquean como privadas); sube a través del sitio web de YouTube Studio, guardado como Privado/Programado, y publica solo con la autorización explícita del usuario. En una sesión local de Claude Code, ejecuta cada comando tú mismo; escribe trabajos .bat solo cuando no tengas shell de Windows.

Etapa 0: Idioma del video (siempre primero)

Si channel.json proporciona lang, confírmalo en el resumen de una línea anterior en lugar de preguntar. De lo contrario, antes de preguntar cualquier otra cosa, crear archivos, instalar o editar, haz exactamente una pregunta en el idioma del usuario, por ejemplo: "¿Qué idioma usa este video? (ej.: Español, English, 日本語…)". Usa AskUserQuestion cuando esté disponible. Espera la respuesta, luego asígnala a un código ISO 639-1 (es, en, ja, ko, vi, pt, de, fr, hi, …). Si el usuario ya nombró el idioma del video anteriormente en esta conversación, confírmalo en una línea en lugar de preguntar de nuevo.

El código de idioma impulsa todo el pipeline:

• --lang <code> en tools/new_project.py (almacenado en config.json → lang). tools/transcribe.py lo lee de la configuración.
• Todo el texto en pantalla (tarjetas de título, etiquetas, unidades, letreros, leyendas de gráficos, subtítulos quemados) se escribe en este idioma, corto y con ortografía correcta con diacríticos completos. Nunca traduzcas ni cambies la narración hablada.
• Fuentes: el motor de renderizado carga glifos latinos, latín extendido y vietnamitas; para vi la fuente del título cambia a Nunito automáticamente para que los acentos se rendericen en una fuente consistente. Para escrituras que las fuentes incluidas no cubren (japonés, coreano, chino, árabe, hindi, tailandés…), informa al usuario y verifica cuidadosamente las imágenes fijas de texto durante el control de calidad.

Etapa 1: Recepción

Después de que se conozca el idioma, pregunta una vez (AskUserQuestion cuando esté disponible) por:

• Archivo de voz en off (requerido). ¿Aún no hay grabación? Haz una con VieNeu (si sus herramientas MCP están conectadas): sintetiza UN clip por oración (01.wav, 02.wav, … en una carpeta), escribe las oraciones una por línea en sentences.txt (marcadores opcionales de pausa |0.8 o ralentización |cham, las etiquetas de emoción como [cười] permanecen en la línea), luego python -I tools/join_segments.py <clip_dir> sentences.txt voiceover.wav. Une los clips con pausas fijas (VieNeu fusiona oraciones cortas y elimina pausas cuando se le da un guion completo) y escribe voiceover.wav.script.txt, el texto limpio para pasar como --script.

• Guion: con marcas de tiempo (SRT/VTT/JSON/TXT con [mm:ss]), texto plano (mejor: alineado con el audio, manteniendo la redacción exacta), o ninguno (transcrito).

• Aspecto: 16:9 o 9:16.

• Resolución: 720p / 1080p (recomendado) / 1440p / 2160p (4K). Menciona que las resoluciones más altas tardan mucho más en renderizar.

• Subtítulos: activados por defecto para 9:16, desactivados para 16:9.

• Música: generada, archivo propio del usuario, o ninguna. SFX: activados o desactivados.

• Título.

• Elenco (estilo de dibujo): stick / 3d / toon, a menos que channel.json proporcione cast.

No preguntes aún sobre el estilo de color. Valores predeterminados (cuando channel.json no lo dice): 16:9, 1080p, 24 fps, música generada + SFX, elenco stick, estilo dusk (paper para toon).

Etapa 2: Instalar o verificar el estudio

Sigue references/install.md: copia kit/ a make-2d-video-studio/ en el espacio de trabajo (omite si ya está presente), instala dependencias, ejecuta python tools/verify_kit.py y python tools/doctor.py, luego ejecuta la autoevaluación de ejemplo. Informa qué se instaló en una lista corta. En Windows, si el doctor encuentra ffmpeg solo en la carpeta winget, escribe make-2d-video-studio/env.sh y env.ps1; antepone los comandos de renderizado y mezcla con source env.sh && (un shell iniciado antes de la instalación no ve el nuevo PATH).

Etapa 3: Proyecto + línea de tiempo

Ejecuta dentro de make-2d-video-studio/. Usa python3 donde python no sea Python 3.

Windows sin una terminal utilizable (el uso de la computadora solo puede hacer clic en el Explorador de archivos): coloca cada paso largo en un trabajo que el usuario haga doble clic. Copia tools/jobs/templates/full.ps1 + 2-full.bat en projects/<slug>/jobs/; cada trabajo .ps1 comienza con $JobDir = $PSScriptRoot y hace dot-source de ..\..\..\tools\jobs\common.ps1 (proporciona $P, Run, Py, Say, Fail, Done, y escribe jobs/logs/<name>.log + <name>.status = RUNNING / OK / FAILED para que Claude lo lea). Ayudantes compartidos: tools/jobs/set_duration.py (duración de config.json a partir de la voz en off), tools/jobs/make_srt.py (out/<title>.en.srt a partir de timeline/sentences.json). Instalación/reparación del estudio en Windows: tools/jobs/setup-studio.bat.

python tools/new_project.py --name <slug> --voice "<ruta de voz en off>" [--script "<ruta de guion>"] --aspect 16:9 --resolution 1080p --fps 24 --style dusk --title "<título>" --lang <código> [--captions]

• Guion con marcas de tiempo: python tools/parse_script.py --project projects/<slug> --script projects/<slug>/input/script.<ext>
• Guion sin marcas: python tools/transcribe.py --project projects/<slug> --script projects/<slug>/input/script.txt --lang <código> --model small. La coincidencia debe ser ≥ 90%; si es menor, informa al usuario que el guion y el audio difieren.
• Sin guion: python tools/transcribe.py --project projects/<slug> --lang <código> --model small (base en máquinas lentas, large-v3 para audio difícil).

Verifica timeline/transcript.txt (su final debe estar cerca de la duración de la voz en off), luego ejecuta python tools/beats.py --project projects/<slug> para obtener la hoja de ritmos y un borrador de story/shots.json.

Etapa 4: Desglose narrativo

Lee references/style-bible.md (o references/style-bible-toon.md para el elenco toon) y references/story-breakdown.md. Escribe story/bible.md (logline, elenco con un color característico cada uno, ubicaciones con estados de ánimo y luces clave, motivos, plan de música, y si el elenco son figuras de palo 2D o personajes 3D). Escribe scenes/cast.js. Reescribe story/shots.json: planos contiguos, cortes en límites de frase 0.1–0.2 s antes, un plano de establecimiento por cada nueva ubicación, y una descripción concreta de scene para cada uno. Ritmo: los cortos 9:16 tienen 30–40 planos por minuto (mediana 1.5–2 s); los explicativos largos 16:9 tienen 15–25 (mediana 2–3.5 s). channel.json → shotsPerMin anula ambos. Envía al usuario un resumen del plan de 5–10 líneas y continúa a menos que objete.

Etapa 5: Elección de estilo

Si channel.json fija style, úsalo y omite la cuadrícula de comparación a menos que el usuario la solicite. Construye los 1–2 decorados más usados más 3 planos representativos (un plano general con ≥ 2 personajes, un primer plano bigFace, un plano de datos/plano o 3D). Luego renderiza:

node render.mjs --project projects/<slug> --styles dusk,midnight,golden,neon,storybook --at <t1>,<t2>,<t3> --scale 0.5

Abre build/styles/style_grid.png, luego muéstralo con una línea por estilo: dusk (sombras malva, clave ámbar, borde crema), midnight (azul marino frío, bordes azul-blancos, luces prácticas de sodio), golden (naranja y verde azulado cálidos), neon (negros profundos, magenta y verde azulado), storybook (pastel suave, bajo contraste). Guarda la elección en config.json → style. Para ajustes, agrega una entrada personalizada a STYLES en engine/styles.js (anulaciones de estados de ánimo más la grade de elevación/gamma/ganancia, saturación, contraste, viñeta, grano, bloom) y vuelve a renderizar esa fila.

Etapa 6: Construir cada plano

Lee references/engine-api.md y las escenas de ejemplo en examples/reaction-time/scenes/ una vez. Trabaja en lotes de 8–12 planos:

1. Escribe scenes/sets/<location>.js (reutilizable, anclado a GY = E.H * V(0.8, 0.68) y CX = E.W/2, con paredes, piso y cielo extendidos más allá del encuadre) y scenes/shots/NN_<name>.js con registerShot('<id>', {...}) para los ids en shots.json.
2. Ejecuta node render.mjs --project projects/<slug> --sheet --scale 0.5 para obtener una hoja de contactos de todos los planos del lote; revísala y corrige los problemas antes de continuar.
3. Cuando todos los planos estén listos, ejecuta node render.mjs --project projects/<slug> --preview --scale 0.5 para un video de vista previa (baja resolución). Muéstraselo al usuario y aplica los cambios solicitados.

Etapa 7: Sonido

1. Lee references/sound-design.md y references/engine-api.md → sección de audio.
2. Genera la música: node tools/musicgen.mjs --project projects/<slug> --style <estilo> (bucle de 10-30 s). Si el usuario proporcionó un archivo de música, colócalo en assets/music.wav y configúralo en config.json.
3. Genera efectos de sonido: node tools/sfx.mjs --project projects/<slug> (biblioteca de SFX, ambiente por ubicación).
4. Mezcla: python tools/mix.py --project projects/<slug> (produce out/<title>_mix.wav).
5. Verifica la mezcla con --preview si es necesario.

Etapa 8: Renderizado final + empaquetado

1. Renderizado final: node render.mjs --project projects/<slug> --final --output out/<title>.mp4 (alta resolución, todos los fotogramas).
2. Combina con la mezcla: python tools/finalize.py --project projects/<slug> --video out/<title>.mp4 --audio out/<title>_mix.wav (produce out/<title>_final.mp4).
3. Opcional: genera subtítulos quemados: python tools/burn_captions.py --project projects/<slug> --video out/<title>_final.mp4.
4. Entrega el archivo final al usuario.

Solución de problemas común

• El renderizado es muy lento: reduce la resolución a 720p o usa --scale 0.5 para pruebas.
• Los personajes no se ven bien: verifica scenes/cast.js y la hoja de personajes; ajusta colores o posiciones.
• El audio y el guion no coinciden: vuelve a ejecutar la transcripción con un modelo más grande (large-v3) o ajusta manualmente las marcas de tiempo.
• ffmpeg no se encuentra en Windows: ejecuta tools/setup-ffmpeg.bat o agrega manualmente la carpeta de ffmpeg al PATH.

Referencias clave

• references/install.md: instrucciones de instalación detalladas.
• references/style-bible.md: guía completa del estilo visual.
• references/engine-api.md: documentación de la API del motor de escenas.
• examples/reaction-time/: proyecto de ejemplo para aprender la API.