Kambaxon/Kambax-tiktok

Doku-3D-Videos (TikTok, Alemán)

Todo se construye en código: HyperFrames más Three.js. Lee primero la skill hyperframes, allí están el contrato, check, snapshot y render. Idioma: siempre alemán. Esto aplica para guion, voz, título, subtítulos y para las respuestas al usuario.

El formato (medido de tres videos de referencia)

• Técnica: 1080×1920, 30 fps.
• Duración: ESTÁNDAR 60–90 segundos (deseo expreso del usuario; ~150–200 palabras, 10–14 planos). Más corto solo si se solicita explícitamente.
• Perspectiva: El espectador ERES TÚ. „Vas a la playa.“ „Estás sentado en un búnker cerca de Moscú.“ „Suena tu despertador.“
• Estructura de cuenta regresiva: El tiempo es la columna vertebral. „En 3 horas“ → „Faltan 2,5 h“ → „Faltan 30 min“ → „Hora 0“ → „+40 min“. Alternativamente „Minuto 0/25/100/160“ o „Día 1/3/7/10“. El punto de inflexión es „Hora 0“ o „Minuto 0“.
• Estructura:
  1. Inicio tranquilo (idílico o cotidiano), fecha y lugar en la línea superior.
  2. Señales y escalada, cada plano un salto en el tiempo.
  3. Catástrofe o punto de inflexión.
  4. Balance con una cifra dura, preferiblemente en un mapa estilizado („≈ 230.000“, números rojos en caso de alarma).
  5. Sección explicativa „… de media“ / „Warum?“ con panel oscuro y gráfico esquemático plano, subtítulo „ESQUEMA, NO A ESCALA“.
  6. Final: una lección o una pregunta para „ti".
• Corte: cortes directos entre planos (cada 2–4 s). Dentro de cada plano, la cámara se mueve lentamente, como un dolly o push-in, con smooth() durante todo el plano.

Diseño

Mundo 3D (Three.js r149, assets/vendor/three.min.js, cargar en el <template> de la escena):

• Mundo low-poly estilizado y suave con materiales lisos (roughness ~0.8), sol cálido y sombras suaves (PCFSoft, mapa de 1024).
• Cielo como textura degradada, más niebla. Tonemapping ACES con exposición ~0.62, de lo contrario todo se ve pálido.
• Figuras = muñecos articulados: piernas, torso y brazos en cápsula, cabeza esférica, capuchón de pelo, ropa de un solo color, sin rostros. Función auxiliar person(seed, {top, pants, scale}), animación con idle() / walk(), fases nunca sincronizadas.
• Accesorios a partir de caja, cilindro y esfera, detalles mediante canvasTex() (esferas de reloj, carteles, ventanas).
• Escenas nocturnas con ventanas emisivas; luz apagada = emissiveIntensity escalonado según la distancia.
• Cada plano es W.<id> = {scene, camera, update(tLokal, T)}, SHOTS define los tiempos. Se renderiza mediante un proxy GSAP (onUpdate → renderAt) y adicionalmente a través de hf-seek.
• Plantilla: templates/beispiel-keiner-arbeitet/welt.html, con estas escenas: dormitorio + despertador, oficina tipo open space, parada de autobús, supermercado, pasillo de hospital, calle con basura + ratas, ciudad de noche (luces apagadas), cocina con vela, ventana/balcón. Copiar helpers, escenas y renderizador, reutilizar o reemplazar escenas.
• El encuadre del retrato es estrecho (~27° horizontal): colocar la cámara más lejos de lo que se piensa y situar las figuras en el centro de la imagen.
• Planos fijos bajo paneles: { id, t0, t1, hold: true } renderiza la escena en su estado final.

Bloque de título arriba a la izquierda (scripts/titel.py, datos en titel.json), Open Sans, blanco, sombra suave:

• Línea superior, 32 px, 600, mayúsculas espaciadas, ej. „26. DICIEMBRE 2004, ≈ 10:00 HORAS“.
• Título, 132 px, 700, ej. „Faltan 30 min“, „Minuto 0“, „Día 7". En caso de alarma puede ser rojo ("farbe":"#ff4b3e").
• Línea inferior, 32 px, 600, mayúsculas, ej. „EL MAR SE RETIRA“.
• Posición: izquierda 72 px, arriba 228 px. Cambia con cada corte (blur-in 0.2 s).

Subtítulos (scripts/untertitel.py):

• Open Sans 700 cursiva, 54 px, centrados en y ≈ 1210.
• Aparece una frase (hasta el signo de puntuación o máximo 5 palabras). Las palabras aún no pronunciadas están atenuadas (0.5) y se iluminan al ser habladas.
• Palabras clave en azul claro #6cc0ff (--blau "Mar,Ola").

Mapa de balance (plantilla bilanz.html, rutas de europa-paths.json o Natural Earth):

• Mapa plano: mar #123f73, tierra beige #e9dfc6, país objetivo más claro con borde blanco, puntos de ciudad amarillos.
• Anillos blancos pulsan desde el centro, un número grande en el bloque de título cuenta hacia arriba y se vuelve rojo.

Sección explicativa (plantillas erklaerung.html = cadena, vorrat.html = dos fases en la misma banda):

• Escena muy oscurecida (rgba(20,26,38,.97) arriba, un poco de visión debajo).
• Bloque de título „LA CAUSA / ¿Por qué? / ESQUEMA, NO A ESCALA“.
• Una banda de imagen clara (y 640–1040) con ilustración plana (corte transversal, cadena, cámaras…) y etiquetas en mayúsculas.
• Frase de estado en cian #5fd0e8 debajo de la banda.
• Cruz roja o marca de verificación verde como iconos (OpenMoji).

Sonido: La voz es el reloj. Usar SFX con moderación:

• whoosh-short en los cortes
• impact-bass en el punto de inflexión
• error/pop en caso de cruz o alarma

Música solo si el usuario proporciona un archivo.

Procedimiento (sin preguntas, si se menciona un tema)

1. bash scripts/setup.sh (una vez por contenedor), luego bash scripts/projekt.sh <slug>.
2. Escribir skript.txt: una línea por plano, segunda persona, frases cortas.
   • Duración: 60 s ≈ 150 palabras, 70 s ≈ 165, 90 s ≈ 210 (Piper ~2.5 palabras/s incluyendo pausas).
   • Escribir los números para la voz, mostrar con doce{12}.
   • Datos solo si son fiables; estimaciones con „aproximadamente“/„cerca de", experimentos mentales en subjuntivo o como escenario.
3. python3 scripts/voice.py skript.txt assets/audio --speed 1.08 --gap 0.45
   • Resultado: voice.wav y words.json, cortar planos según lines[].start.
   • La grabación propia del usuario tiene prioridad.
4. titel.json → python3 scripts/titel.py titel.json compositions/titel.html
5. python3 scripts/untertitel.py assets/audio/words.json compositions/untertitel.html --blau "..."
6. Construir compositions/welt.html (3D) y compositions/erklaerung.html (esquema); tomar index.html de la plantilla (capas: welt 1, erklaerung 2, titel 3, untertitel 4, audio).
7. npx hyperframes check --json (los errores deben desaparecer; las advertencias de contraste sobre cielo claro se deben al estilo).
   • Luego npx hyperframes snapshot --at a,b,c,d,e,f --no-end -o snap, máximo aprox. 6 puntos de tiempo por llamada.
   • Revisar imágenes y corregir.
8. Renderizar en segundo plano: npx hyperframes render -o renders/<slug>.mp4 -q delivery -w 2 --quiet.
   • WebGL se ejecuta en la CPU, tarda algunos minutos.
   • Luego verificar con ffprobe, revisar la hoja de contactos y enviar el archivo al usuario.

Voz (deseo del usuario: voz femenina amigable)

• Preferido: archivo de ElevenLabs del usuario (anteriormente „Jessica – Playful, Bright, Warm", eleven_v4). Procedimiento:
  1. Dar al usuario el guion como bloque de texto para que lo grabe (una línea por plano).
  2. Generar referencia con tiempos de palabras: python3 scripts/voice.py skript.txt /tmp/ref --voice ~/.cache/geo-voice/vits-piper-de_DE-kerstin-low/de_DE-kerstin-low.onnx --gap 0.4
  3. Alinear: python3 scripts/align.py /tmp/ref assets/audio/<eleven>.mp3 assets/audio (DTW sobre MFCC, ajustar inicios de línea a pausas reales). Resultado: voice.wav + words.json; verificar límites de línea con silencedetect.
  4. Derivar todos los tiempos (cortes, títulos, efectos, paneles) de los nuevos tiempos de palabras.
• Respaldo sin archivo: voces femeninas Piper (Kerstin/Ramona/Eva, lanzamiento tts-models de GitHub k2-fsa/sherpa-onnx). Suenan sintéticas; solo como solución de emergencia, decírselo al usuario.
• No es posible clonar voz (modelos bloqueados), no reconstruir voces ajenas o de celebridades.

Música y sonidos

El usuario siempre quiere música de fondo suave y efectos de sonido. Openverse, Freesound, Pixabay, archive.org y HeyGen están bloqueados, por lo que ambos se generan sintéticamente con scripts/klang.py.

• Música: python3 scripts/klang.py musik musik-plan.json assets/music/musik.wav
  • musik-plan.json define por sección: acorde, energía, brillo y opcionalmente un pulso en BPM. Además, algunas notas de piano.
  • Las secciones siguen la dramaturgia: oscuro → tensión (pulso) → punto bajo casi silencio → acorde mayor cálido en la esperanza.
  • En el vídeo con data-volume ~0.22 debajo de la voz (archivo de música ≈ −18 LUFS).
• Efectos: python3 scripts/klang.py sfx assets/sfx genera viento, trueno, radio, reloj, pasos, columna, sirena, campana, latido, zumbido, explosión.
  • Además, los whoosh/impact/riser incluidos de media-use.
  • Volúmenes 0.15–0.45, sonidos continuos con data-fade-in/out.
• Control: Ver el espectro con showspectrumpic (clics = líneas verticales). No puedo escuchar yo mismo, por lo que debo decir al usuario que la mezcla está medida y no escuchada.
• En temas sensibles (Holocausto, víctimas) reducir la música; solo viento o zumbido.

Temas históricos sensibles

• Sin esvásticas, runas SS u otros símbolos nazis y sin retratos de perpetradores con rostro (TikTok lo bloquea, incluso en contexto histórico). Mantener banderas y uniformes abstractos.
• Los campos y la violencia solo insinuarlos (valla, torre de vigilancia, niebla), no mostrar víctimas. Tono objetivo y crítico.
• En escenarios hipotéticos, contextualizar la realidad al final („La realidad“ / „Por qué casi imposible“) y mostrar la liberación.

Mejorar siempre (deseo del usuario)

Cada proyecto debe superar al anterior en atmósfera, efectos, animación y sonido. El estado actual está en templates/beispiel-tschernobyl/:

• Partículas particles(scene, n, seed, {x,y,z,v,drift,grav,life,color,size,opacity,add,fog}): deterministas y siempre con la textura redonda suave SOFT (sin ella aparecen cuadrados). Utilizado para fuego, brasas, humo, lluvia, polvo, chorro de agua y hojas.
• Luz como narrativa: Las luces de alarma parpadean, los PointLights de fuego titilan, el haz de luz es aditivo, el resplandor en el horizonte es un plano degradado (no una esfera).
• Cámara: Temblor en impactos (exp(-u*2.2)), dollys lentos por plano.
• Capa Look look.html (z-index sobre el mundo, bajo título/subtítulos): grano de película (15 fps, determinista), viñeta, destello blanco en explosiones, fundido a negro para momentos de silencio, fundido final.
• Sonido: klang.py sfx2 para Geiger (3 densidades), alarma, explosión, fuego, sirena2, autobús, lluvia y crujidos. En musik-plan.json hay luft (armónicos), sub (subgraves) y stille (ventanas de silencio duro, p. ej., justo después del estallido). Además, un riser que converge exactamente en el punto de inflexión (inicio = impacto − 10.03 s).
• Estructura que sostiene: El principio y el final se reflejan (duermes ↔ estás despierto junto a la ventana), mapa y esquema en medio.

Errores comunes

• cam() tiene solo 400 m de alcance visual. Para todo lo que esté más lejos (horizonte, central eléctrica, arcos), usar camFar(3000+) y colocar la niebla lo suficientemente lejos; de lo contrario, es invisible.

• Ventana de retrato: planificar objetos de fondo exactamente a través de la abertura (ángulo = atan(altura/distancia)).

• Calidad antes que velocidad (deseo del usuario): siempre 1080×1920, -q delivery, sombras completas y suavizado. Un render de 70 s en la nube (CPU WebGL) tarda entre 40 y 60 min. Anunciarlo con antelación y no reducirlo.

• pkill -f <patrón> afecta al propio shell si el patrón está en el comando. Terminar procesos por PID en su lugar.

• La voz Piper suena sintética (16 kHz). Ofrecer una grabación propia o un archivo de ElevenLabs.

• En líneas con fonema desconocido no hay alineación. voice.py distribuye las palabras según energía y longitud de sílabas; verificar tiempos en el snapshot.

• Los IDs de escena deben ser únicos (prefijos er-, ti-, ut-).

• El contenedor es efímero: enviar videos inmediatamente. La skill y los proyectos solo se conservan si se envían a un repositorio Git.