mromidev/corto-3d-dibujos

Corto animado 3D tipo dibujo (three.js + Remotion)

Ejemplo probado: The Bridge That Fell for a Song. Es un corto original de 67 segundos sobre el puente de Broughton de 1831 y 74 soldados marchando al paso.

• Código: src/videos/bridge/ de tu proyecto Remotion (composición BridgeShort, 1080x1920, 30 fps).
• Guion, voz y sonido: ~/bridge-short/.
• Investigación de estilo: references/.

La referencia de estilo es un canal estudiado de forma privada (references/: STYLE_BIBLE.md, reports/*.md, frames/).

• Esos videos son material de estudio privado. Nunca subas, publiques ni los envíes.
• Nunca copies sus guiones, personajes o tomas. La historia, los personajes y la voz son SIEMPRE NUESTROS.
• Nunca digas el nombre del canal en una voz en off o descripción.

Reglas de usuario que aplican:

• Sin subtítulos ni etiquetas en el video.
• Solo inglés.
• Voz: un tono constante.
• Los chistes son hechos reales investigados.
• Mezcla estándar: música +3 dB, SFX -6 dB, voz sin cambios.
• Exportación final 2K vertical: 1440x2560, --scale 1.3333.
• Opus max verifica cada paso.
• Guarda después de cada paso.
• "Solo hazlo" una vez que el guion esté aprobado.

Pipeline

1. Tema y hechos. Elige una historia sorprendente real con causa y efecto físico (que sea visual) y una analogía cotidiana simple que la explique.
   • Escribe los hechos con su fuente al inicio de SCRIPT.md.
2. Guion (~3.7 palabras/s, 55-70 s). Fórmula de ritmo del corto del puente:
   • Gancho: el hecho absurdo en una línea ("Setenta y cuatro soldados derribaron un puente de hierro solo con caminar sobre él.").
   • Contexto: año, lugar, orgullo.
   • Acción: escalada en tres o cuatro ritmos, cada uno un poco más grande.
   • Golpe: el momento en que se rompe.
   • Línea doble inexpresiva: "Por suerte... / Por desgracia...".
   • Explicación: una idea de física a través de una analogía cotidiana (el niño en un columpio).
   • Consecuencia: la regla que creó.
   • Giro final: el desenlace.
   • Nunca describas en pantalla lo que el espectador ya ve.
3. Voz. Graba o genera voice.wav, luego crea sus tiempos de palabra words.json (cualquier transcripción con tiempos de palabra).
   • Ponlos en la carpeta del proyecto, por ejemplo ~/bridge-short/voice/.
   • Corrige manualmente los tiempos de palabra. Todo se temporiza con words.json.
4. Plan de tomas en story.ts: copia templates/bridge/ (el código fuente final del puente, el mismo que src/videos/bridge/ de tu proyecto Remotion) a src/videos/<nombre>/, registra una nueva composición al lado de BridgeShort en src/Root.tsx, y renómbrala.
   • SHOTS: id, fotogramas a/b, luz día/dorada, modo multitud, tau tiempo de historia.
   • XFADE: encadenados en cambios de lugar/tiempo.
   • FLASH_AT: un destello blanco después del gancho.
   • CAMS: claves por toma {f, dur?, cut?, s: f => {pos, look, fov, roll}}.
   • KICKS: sacudidas de impacto.
   • DOF/dofAt: desenfoque de lente por ritmo.
   • FOREGROUND: accesorios de encuadre cercano.
   • Cada reacción visual llega 0-3 fotogramas antes de su palabra.
5. Mundo.
   • lights.ts: LUCES más el LOOK de cielo/río/nube por luz.
   • shade.ts: sombreado de dos tonos y untone().
   • build.ts: ciudad, casas y accesorios del kit CC0 de Kenney, recoloreados, con eliminación de línea de visión de todo lo que bloquee una cámara.
   • paint.ts: texturas pintadas en HD Canvas2D con costuras pintadas como tintes oscuros.
   • world.ts: shader de cielo, niebla = color del horizonte, río, pose por fotograma, sol congelado por toma y relativo a la cámara.
6. Personajes.
   • toon.ts: la API de dibujo Pen de Canvas2D, lienzo de diseño 600x1000, suelas en y = 975, cabezas de frijol, extremidades de palo, contorno de ciruela de ancho variable, biblioteca de rostros.
   • cast.ts: carteles orientados a la cámara, multitudes, tarjetas de efecto, parpadeos, ciclos de caminata. Todos los carteles van en la capa NOINK.
   • cardshade.ts: tarjetas iluminadas por la luz de la escena, sin emisivo.
7. Postprocesado (Bridge.tsx + ink.ts + lensblur.ts + grade.ts).
   • Orden del compositor: tinta → pre lente → lente principal → bloom → mapeo de tonos NEUTRO → gradación (MSAA 4).
   • Cada parámetro de píxel escala con la altura de salida / 1920.
8. Sonido (~/bridge-short/audio/: timeline.py, sfx_gen.py, sfx.py, music.py, instruments.py, dsp.py, mix.py).
   • Tabla de eventos → SFX sintetizados más una partitura original con ducking debajo de la voz.
   • Salida: mix.wav (48 kHz, duración exacta), stems y cues.md.
   • Bloquea las constantes de tiempo del video antes de hacer el sonido. Cualquier cambio de temporización posterior implica volver a ejecutar el sonido.
9. Verificaciones de aspecto. Ejecuta node scripts/bridge-stills.mjs out/<nombre>/x_ 100,400 0.5.
   • Establece BRIDGE_ENTRY=src/sandboxes/<n>/index.tsx para renderizar una copia sandbox.
   • Haz comparaciones lado a lado con fotogramas de referencia usando python scripts/sbs_sheet.py out.jpg --ours ... --ref ....
   • Envíalos a un verificador Opus max: 1-3 imágenes, un veredicto de ≤200 palabras.
10. Renderizado final.
    • npx remotion render src/index.ts <Comp> out/<nombre>/video.mp4 --codec h264 --crf 16 --scale 1.3333
    • Mezcla con -map 0:v:0 -map 1:a:0 (Remotion escribe una pista de audio silenciosa).
    • QA: python scripts/short_qa.py final.mp4 out/<nombre>/qa shots.json verifica cada fotograma en busca de negro, blanco, congelado y fotogramas de salto, además de volumen y hojas.
    • Arregla cualquier cosa que encuentre, luego ejecuta una auditoría Opus profunda.
11. Entrega. Envía el mp4 final con SendUserFile, actualiza la memoria, escribe notas.

Valores finales del aspecto (puente después de 4 rondas de verificador; todos en templates/bridge/)

Comienza cada nuevo corto desde templates/bridge/ (copia a src/videos/<nombre>/): el aspecto vive en estos valores, la historia vive en story.ts / build.ts layout / cast.ts roles. Puntuaciones Opus max al final: color día 7, dorado 5-6, iluminación 5-6, tinta 6, texturas 5-6, personajes 7, profundidad 6-7, composición 6-7 (desde 5/3/4/5/4/7/4/6 al inicio).

• Preajustes de luz (lights.ts, sol relativo a la cámara y congelado por toma):
  • día: az 75 / el 48, iluminado [1.58,1.5,1.33], sombra [.30,.29,.36], elevación [.05,.06,.11] (tinte frío SOLO en sombra), cielo superior #3e7fd2 → horizonte #b8d0ec, niebla = horizonte, 25→300 m, uSat 1.08, ~15 % neblina azul más allá de 60 m.
  • dorado: az 6 / el 7 (sol bajo contraluz), clave hacia #FFB36B ×1.5, sombra violeta-azul (fachada ≈ #444380), cielo #ffc47c → #8a6f8a, niebla melocotón solo más allá de 50 m, disco solar #ffcf9e + bloom, gotas de contacto + sombras reales de tarjetas.
• Albedos (paint.ts/build.ts): ladrillo apagado / crema / ocre / casas terracota con zócalo, cornisa, alféizares, capuchas, escalón de puerta, chimenea + maceta, alturas 7 / 8.4 / 9.8 m; piedra gris cálido/beige (saturación −35 % de "cuento"); cubierta de madera ocre C* ~51-58 con costuras casi negras; hierro oscuro y desaturado. Nunca limón, nunca caras iluminadas lavanda.
• Tinta (ink.ts): #030303, 5.1 px cerca (6 m) → 3.3 px lejos (90 m) a 1080x1920, arrugas ×0.8 desde 35°, saltos de profundidad desde 1 %, tinte de niebla 0.3 solo lejos; tarjetas de personajes en capa NOINK (llevan su propia tinta ciruela).
• Lente (lensblur.ts + dofAt en story.ts): cInf px a 1080: gancho/río primer plano 15-16, primeros planos 12-14, plano medio 10-12, parque 7, balanceo dorado 5, planos generales/aéreos 0. Enfoque en los ojos de la primera fila.
• Postprocesado (Bridge.tsx): tinta → pre lente → lente principal → bloom (umbral 1.0, int .5, 6 niveles, radio .6) → mapeo de tonos NEUTRO → gradación; MSAA 4. El grano de película existe pero está DESACTIVADO (la referencia no mide grano; cuadruplica el tamaño del archivo).
• Personajes (toon.ts/cast.ts/cardshade.ts): cabezas de frijol h/an .94, tinta ciruela #241726, ojos separados .26 W, sin colorete, 14 expresiones; adultos 3.5 cabezas de altura; balanceo de caminata 5 %, inclinación 1-7°, paso fijo 0.8 m; parpadeos 0.5-2.3 s; sombra de contacto ajustada ~.5 debajo de los pies + cola de dirección solar de día; borde dorado solo interior (nunca una copia exterior desplazada).
• Cámara (story.ts): cortes en saltos grandes, deslizamientos smootherstep 18-40 f, cada sostenido se mueve (sin sostenido estático ≥4 f), sacudidas de impacto que se desvanecen en 7 f, giros de 4-4.6°, accesorios de primer plano (FOREGROUND) en aproximadamente 1/3 de las tomas.

Objetivos de aspecto (medidos desde la referencia; ver references/reports/)

• Tinta:
  • Líneas del mundo: aproximadamente 3 px a 1080 de ancho, casi negro #0b0a0c, casi constante con la distancia. Solo siluetas, saltos de profundidad y arrugas normales. Sin línea en uniones de pared/suelo ni en el horizonte. Las tarjetas de personajes nunca están delineadas por la tinta del mundo.
  • Tinta de personajes: ciruela oscura #201628-#2f1d28, más gruesa en el lado inferior/sombra.
• Color:
  • Luma mediana de día ~.57. No tinta p5 ~.23 (sin negros aplastados). Croma iluminada C* p90 ~55. Cielo de día superior ~#5e93d9, horizonte 1.28x más brillante.
  • Dorado: horizonte melocotón #ffd08a, sombras violeta-azul (nunca marrón), sol contraluz.
• Profundidad:
  • DOF aproximadamente en 1/3 del tiempo de pantalla (primer plano, plano medio, insertos), cInf 10-16 px a 1080, enfoque en los ojos. Los planos generales y abiertos se mantienen nítidos.
  • Niebla = color del horizonte, 25→420 m de día, 20→360 m dorado.
  • Bloom solo en emisivos HDR: umbral 1.0.
• Cámara:
  • Cortes duros en saltos grandes. Todo lo demás es un deslizamiento smootherstep de 18-40 f, pico ≤ 25 px/f a 720p.
  • Cada sostenido avanza 0.15-0.35 %/f, con 0.6 %/f en palabras de énfasis.
  • Giros de 4-5°.
  • Sin flotación de cámara en mano. Las sacudidas de impacto invierten el signo cada fotograma y se desvanecen en 7 f.
• Personajes:
  • Aproximadamente 3.5 cabezas de altura, piernas 1.4 HH.
  • Extremidades de palo aproximadamente 0.055 del ancho de la cabeza, manos de punto de tinta.
  • Cabeza de frijol (h/an ~0.93, barbilla más estrecha, coronilla más puntiaguda).
  • Sin colorete ni reflejos en los ojos. Rostros con brillo ~.93.
  • Balanceo de caminata 3-7 %, inclinación 1-7°, pies fijos.
  • Parpadeos cada 0.5-2.3 s, con duración de 4 f.

Bucle de ajuste de aspecto (cómo se alcanzó el aspecto del puente; reutilizar para cualquier pase de "haz que se vea como X")

1. Mide la referencia primero. Un agente de análisis por tema (movimiento, profundidad, texturas, personajes, iluminación, contornos, gradación), cada uno escribiendo números, no adjetivos, a references/reports/<tema>.md. Brief compartido: compare/CONTEXT.md. Los informes son la fuente de verdad para cada agente posterior.
2. Sandboxes, un propietario por archivo. Copia la carpeta del proyecto a src/videos/<nombre>_{cam,world,mat,char,post} con entradas src/sandboxes/<n>/index.tsx (el mismo index.tsx que el principal, solo la ruta de importación cambiada). Propiedad utilizada para el puente:
   • cam: story.ts (claves de cámara, cortes, sacudidas, tabla DOF, accesorios de primer plano)
   • world: world.ts, lights.ts, shade.ts, grade.ts (sol, cielo, niebla, río, color, gradación)
   • mat: paint.ts, build.ts (texturas pintadas, edificios, accesorios)
   • char: toon.ts, cast.ts, cardshade.ts (dibujo de personajes, poses, iluminación de tarjetas, tarjetas de efectos)
   • post: ink.ts, Bridge.tsx, lensblur.ts (pase de contorno, compositor, desenfoque de lente, bloom) Los agentes solo editan sus propios archivos en su propio sandbox y renderizan imágenes fijas con BRIDGE_ENTRY=src/sandboxes/<n>/index.tsx node scripts/bridge-stills.mjs out/<nombre>/<n>/x_ <fotogramas> 0.5.
3. Fusiona con python scripts/bridge_merge.py [cam,world,mat,char,post] (hace copia de seguridad del principal en backup/bridge_<hora>/, copia solo los archivos de propiedad). Luego npx tsc --noEmit (filtra a la carpeta del proyecto), luego resincroniza cada sandbox desde el principal (cp -f src/videos/<nombre>/* src/videos/<nombre>_<n>/) antes de la siguiente ronda.
4. Verifica con un nuevo agente Opus max: hojas lado a lado (python scripts/sbs_sheet.py out.jpg --ours a b --ref r1 r2), puntúa cada área sobre 10 (color día / dorado, iluminación, tinta, texturas, personajes, profundidad, composición) más una lista numerada de correcciones con números de fotograma. Asigna cada corrección al propietario del archivo y reanuda el agente de ese propietario con SendMessage (mantiene su contexto). Puntuaciones del puente: ronda 1 5/3/4/5/4/7/4/6 → ronda 2 5/4/5/6/4/7/6/6 → ronda 3 ver notas.
5. Los contratos entre propietarios viven en constantes exportadas (por ejemplo, capa NOINK de ink.ts, dofAt/FOREGROUND de story.ts, LIGHTS/LOOK de lights.ts). Cambiar un contrato significa informar a cada propietario que lo lee.

Problemas comunes

• Los materiales del kit de naturaleza de Kenney son verde azulado: recoloréalos por nombre de material en build.ts.
• Las cámaras terminan dentro de las casas: el eliminador de línea de visión en build.ts/world.ts elimina cualquier cosa que bloquee cualquier rayo de cámara.
• La tinta en el mismo pase de efecto fusionado que DOF se sobrescribe. La tinta debe ser su propio pase antes del desenfoque.
• Los parámetros de post de tamaño de píxel deben escalar con la resolución: las imágenes fijas son a 0.5, el final a 1.333. R3F fija dpr a ≥ 1, por lo que las imágenes fijas --scale 0.5 aún renderizan un búfer de 1080x1920.
• Disco: cada paquete de Remotion copia public/ (~1.3 GB) en la carpeta temporal remotion-webpack-bundle-* y nunca lo elimina. 60+ GB llenaron la unidad del sistema durante los pases del puente y una renderización murió con ENOSPC. Siempre renderiza con export TEMP='<unidad grande>/remotion-tmp' TMP='<unidad grande>/remotion-tmp' (bridge-stills.mjs lo establece por sí mismo) y pide al usuario antes de eliminar carpetas antiguas del paquete en la carpeta temporal compartida (el modo automático bloquea la limpieza). /remotion-tmp también se llena (~500 carpetas / 110 GB después de 4 rondas del puente): cuando un proyecto está terminado y no se está renderizando nada, elimina sus carpetas remotion-webpack-bundle-* y puppeteer_dev_chrome_profile-* allí.
• En cadenas JS escribe "<unidad grande>/remotion-tmp", nunca "<unidad grande>\remotion-tmp" (\r se convierte en un retorno de carro).
• Remotion escribe una pista de audio silenciosa: mezcla con -map 0:v:0 -map 1:a:0.
• Los subagentes no pueden escribir archivos de informe en este entorno: pídeles un mensaje final de ≤150 palabras y guárdalo tú mismo en out/<nombre>/<n>/REPORT.md.
• Los archivos .ts temporales dentro de out/ rompen tsc: nómbralos .txt.
• Las renderizaciones 2K se ejecutan a ~4 fps (≈10 min para 67 s). Las imágenes fijas a 0.5 toman 3-8 s cada una después de un paquete de ~40 s.
• El grano de película al 2.5% hizo que el archivo 2K tuviera 910 MB en lugar de ~250 MB y se convertirá en una masa amorfa en YouTube; la referencia no tiene ninguno. Mantenlo desactivado.

Trampas de legibilidad que el verificador detectó (verifica cada nuevo accesorio/toma para detectar estas)

• Un columpio dibujado como una sola cuerda que desaparece detrás del niño se lee como un AHORCADO. Siempre dos cuerdas a una tabla ancha con el niño entre ellas (swingKid en toon.ts), y un marco cuyas patas despejan el arco (marco en A en cada extremo).
• Los accesorios o restos flotantes más cerca de ~2 m de una lente se convierten en manchas enormes recortadas en el borde del fotograma. Cuando una cámara se mueve, vuelve a verificar cada accesorio cerca de su nueva posición (las cámaras del río se movieron hacia los sombreros flotantes).
• Un arbusto en primer plano cortado por el borde del fotograma se lee como una "bola verde"; un accesorio en primer plano debe ser reconocible o desaparecer.
• Banderas: roja + estrella/diamante amarillo se lee como la de Vietnam. Usa una bandera correcta para la época (cruz de San Jorge para Inglaterra 1831).