zhengshuyuan2023uk/cartoon-audio-short

Curta em cartoon: ideia → roteiro → narração → MP4 finalizado

O visual: personagens cartoon flat 2D com cabeça de feijão (cartões desenhados com contornos de ameixa) em um mundo 3D colorido com contornos de tinta preta, texturas pintadas, profundidade de campo e câmeras deslizantes. A saída é 1080x1920, 30 fps, exatamente com a duração da narração. A voz do usuário permanece inalterada. A música de fundo e os efeitos sonoros são sintetizados e ficam a 50% do nível da voz. Testado em "O Soldado Que Nunca Partiu" (19,7 s, 8 planos).

Regras

• Histórias, personagens e planos são sempre originais. Nunca recrie o vídeo de outro criador plano por plano. Ofereça uma abordagem original para a mesma ideia.
• Sem pessoas reais e nomeadas como personagens, e sem mascotes de marca ou logotipos.
• Sem legendas, a menos que o usuário peça. Texto diegético (uma mensagem esculpida, uma placa) é permitido, e deve ser legível corretamente (não espelhado).
• Nunca edite ou reajuste o tempo da voz. A imagem é sincronizada com ela, e cada reação visual ocorre 0-3 quadros antes de sua palavra.
• Níveis de áudio: a música de fundo fica a 50% do nível da voz (−6 dB, RMS com gate). Os efeitos sonoros ficam a 50% ou ligeiramente menos, com picos limitados para que nenhum som se destaque sobre a narração. Sempre misture com mix.py, nunca manualmente. Não use ducking ou compressão que altere essa proporção; apenas um ganho linear mais um limitador de pico é aplicado a toda a mixagem.
• Mantenha o usuário informado com uma lista de tarefas. Envie uma folha de contato com stills antes da renderização longa.

Etapa 1: Recebimento (sempre primeiro)

Se um arquivo de áudio já estiver anexado, vá para a Etapa 4. Se um roteiro também foi fornecido, use-o para o tempo. Caso contrário, faça uma AskUserQuestion (ou texto simples se essa ferramenta estiver faltando): "Por onde você está começando?"

• Narração pronta: peça para enviá-la, mais o texto do roteiro se tiver (o roteiro torna o tempo exato). Vá para a Etapa 4 quando chegar.
• Tenho um roteiro, preciso da narração: aperte o roteiro conforme a Etapa 3, se necessário, devolva-o com dicas de gravação, peça o upload, então vá para a Etapa 4.
• Preciso de ideias de vídeo e um roteiro: vá para a Etapa 2. Pergunte também a duração alvo se ainda não foi dita. O padrão é 20-30 s; 45-60 s é permitido.

Etapa 2: 10 ideias de vídeo

Dê exatamente 10 ideias em uma resposta, numeradas, e peça ao usuário para responder com um número (ou "mais"). Cada ideia recebe:

• Título (5-8 palavras, baseado em curiosidade, ex. "O Soldado Que Nunca Partiu").
• Linha de gancho: a primeira frase falada, um paradoxo apresentado como fato ("Um homem vendeu a Torre Eiffel. Duas vezes.").
• A reviravolta em uma linha (a recompensa irônica que encerra o vídeo).
• Por que anima bem: os 2-3 grandes momentos visuais (um colapso, uma revelação, uma perseguição).
• Verdade ou lenda: diga claramente se é história documentada, um relato disputado ou folclore.

O que torna uma ideia "perfeita" para este formato:

• Uma história surpreendente com uma causa e efeito físicos que você pode mostrar.
• Um personagem comum claro, apostas que escalam e uma reviravolta na última linha.
• Um cenário que pode ser construído a partir de formas 3D simples mais cartões de cartoon (cidades, pontes, navios, castelos, desertos, laboratórios, palácios).
• Misture as 10 entre épocas e temas: antigo, medieval, anos 1800, moderno, ciência, animais, invenções, desastres, leis estranhas, acidentes de sorte.
• Para qualquer coisa apresentada como verdade, verifique os fatos principais com uma pesquisa na web antes de oferecer. Não apresente uma lenda viral como fato. Se o usuário quiser mesmo assim, enquadre como "a lenda diz".
• Sem pessoas reais vivas como alvo de piada, nada gráfico e nada político.

Etapa 3: Roteiro (após a escolha)

Escreva apenas a narração (sem direções de cena no texto falado), dimensionada a cerca de 3,7 palavras/s: 20 s ≈ 75 palavras, 30 s ≈ 110, 60 s ≈ 220. Fórmula:

1. Gancho (frase 1, sem preparação): o fato absurdo.
2. Cenário em 1-2 linhas: quando, onde, quem, um detalhe concreto.
3. Escalada, 2-4 batidas, cada uma maior. Outros duvidam ou zombam. Use uma piada de exagero.
4. Mistério ou pivô: "Mas quando..." / "Veja," introduz o mecanismo real, muitas vezes com uma analogia cotidiana.
5. Reviravolta / recompensa: curta, irônica e as últimas palavras do vídeo. Use inglês falado simples, contrações, frases em torno de 8-15 palavras e números escritos por extenso. Nunca descreva o que o espectador já vê.

Em seguida, responda com:

• O roteiro em um bloco copiável, com a contagem de palavras e duração estimada.
• Um parágrafo do plano visual (os planos que você vai animar).
• Dicas de gravação: uma voz de narrador firme e calorosa; ElevenLabs funciona bem (voz de narrador grave, velocidade cerca de 1,05-1,1, estabilidade cerca de 45-55%). Mp3 ou wav é ok. Deixe pausas naturais no final das frases. Exporte sem música.
• O pedido: "Envie a narração quando estiver pronta e eu farei o vídeo completo." Mantenha o texto final do roteiro. Ele orienta o tempo na Etapa 4, então não é necessário reconhecimento de fala. Se gravaram uma versão alterada, peça o texto final.

Etapa 4: Construir o vídeo (após o upload da narração)

Faça tudo daqui em diante sem parar. Pergunte apenas se o tempo não puder ser resolvido.

4.0 Obter o kit

O kit de código vem dentro desta pasta de skill em kit/ (mecanismo, ferramentas, exemplo trabalhado, mais three.js r160 fornecido e a biblioteca toon.ts Pen de github.com/mromidev/claude-animated-shorts, ambos MIT). Localize a pasta com find / -name SKILL.md -path "*cartoon-audio-short*" 2>/dev/null e trate seu kit/ como somente leitura.

Então execute bash <skill>/kit/tools/setup.sh ~/shorts/<slug>. Ele copia o mecanismo e as ferramentas para o projeto, instala o three.js fornecido, remove os tipos de toon.ts com Node 22 module.stripTypeScriptTypes e vincula o Playwright. Nenhuma rede é necessária. Se os arquivos fornecidos estiverem faltando, ele recorre a npm ou um git clone.

• Requisitos: Node 22.6+, Python 3 com numpy + Pillow, ffmpeg e Playwright com Chromium (npm i -g playwright && npx playwright install chromium se estiver faltando).
• Se os registros de pacotes estiverem bloqueados, o git via GitHub geralmente funciona. Nunca desative TLS ou desvie do proxy.
• Chromium: use o navegador Playwright pré-instalado com --use-angle=swiftshader --enable-unsafe-swiftshader --ignore-gpu-blocklist. Isso fornece WebGL por CPU a cerca de 3-10 s por quadro.

4.1 Tempo

Execute python3 timing.py voice.mp3 script.txt --out work.

• Com whisper ou faster-whisper instalado, ele usa timestamps de palavras.
• Caso contrário, ele alinha frases do roteiro (divididas por pontuação) a segmentos de fala detectados por silêncio, com um DP que combina sílabas com duração e penaliza fins de frase dentro de um segmento e longos intervalos dentro de uma frase.
• Sem ASR e sem roteiro, peça o roteiro. Claude não pode ouvir áudio.
• Verifique work/phrases.json: as pausas devem cair no final das frases. Total de quadros = round(duração × 30).

4.2 Plano de planos (work/PLAN.md antes do código)

Faça uma linha por plano: quadros, palavras, cenário, luz, movimento de câmera, personagens/poses/expressões, efeitos e sinal de SFX.

• O quadro 0 já é a imagem de gancho.
• Geralmente um plano por frase. Mescle frases minúsculas no próximo plano.
• Ilustre cada frase literalmente. Adereços carregam as piadas.
• Varie os tamanhos dos planos: gancho em plano médio close-up → plano geral de revelação → plano dois → insert close-up no objeto-chave → close-up de reação → movimento de ambiente para a recompensa.
• Use luz para batidas: dia para normal, dourado para declínio ou drama, azul noturno para explicação. Um salto temporal recebe um flash branco de 6 quadros.
• A linha de reviravolta recebe um stinger (música para, golpe baixo, push-in com rotação). A recompensa física do último plano cai na palavra final.

4.3 Mundo (web/main.js)

Mantenha as seções do mecanismo: materiais toon, contorno de tinta, add/tbox, céu, luzes, cartões, alvos de renderização/pós, applyLight, drawActors, swapForNd, renderFrame. Substitua o mundo de exemplo entre // ---------- world ---------- e // ---------- cards ----------, mais as partes da história de worldState().

• Construa a partir de primitivas com texturas de tela pintadas (paint.js: tábuas, vigas, madeira podre, pedra, musgo/heras, grama, terra, gesso, telhas, mármore, faixas, texto esculpido). Escreva novos pintores no mesmo estilo plano com costuras escuras.
• Use tbox para densidade de texel constante, um gradiente toon de 2 etapas e névoa = cor do horizonte.
• Fundo: colinas (esferas meio enterradas), montanhas (cones + calotas de neve), ciprestes/pinheiros, casas distantes, outdoors de nuvens pintadas.
• Peças de cenário (colapsos, quedas, portas) são grupos pivotados acionados por progresso 0..1 de worldAt(f), com partes suavizadas e escalonadas.
• Texto diegético curvo usa UVs planares. Verifique se não está espelhado.

4.4 Elenco (web/roman.js → web/toon.js)

• romanFront(p, outfitKey, opts) desenha em uma tela de design 600x1000 com solas em y=975. O cartão tem 2,25 m de altura, então 1 unidade = 0,00225 m.
• Adicione roupas a OUTFITS (túnica/capa/armadura/elmo/cabelo/gorro/barba/avental/vestido/toga) e novos chapéus e adereços no mesmo estilo.
• Poses de braço: pendurado, lança, apontar, para cima, acenar, quadril, barriga, têmpora (+redemoinho), levantar, alcançar (+levantar), bochecha, escudo, cruzar, polegar.
• Expressões: o conjunto FACE de toon.ts mais ronco, teimoso, apertar os olhos. Estenda FACE para mais.
• Reconstrua após edições com cat web/toonbase.js web/roman.js > web/toon.js. Renderize uma folha de teste de personagem antes de usar novos designs.
• Os outdoors giram apenas no eixo vertical, recebem uma bolha de contato e uma sombra testada por alfa, e nunca são contornados pela passagem do mundo.
• Construa chaves de cartão a partir de valores arredondados por q() (para que a tela seja redesenhada apenas em mudança visível).
• Uma parte destacada (ex. um elmo levantado) é seu próprio cartão, alinhado com headCenter(seed): y = DECK + (partY − hc) × 0,00225.

4.5 Movimento: suave e vivo (web/motion.js)

• Câmeras: camFromKeys(keys, f, {kicks}). Use deslizes smootherstep (18-45 f), easeOut para revelações e chicotadas, e path via-pontos (Catmull-Rom) para movimentos curvos. Cada parada se arrasta e nada está estático por 4+ quadros. Use rotações de 3-5° em drama e sacudidas de 7 quadros em impactos.
• Continuidade: prefira movimentos contínuos (recue de um close-up para o geral, rack focus, grua através do deck, push-in em um objeto). Corte seco apenas em saltos de lugar ou tempo, com um flash.
• Personagens nunca congelam: aplique idle(f, seed) a cada cartão, blinkAt piscadas e balanços de cabeça em palavras estressadas.
• Ações: antecipação → overshoot de back → estabelecimento spring. Um carimbo é um mergulho de 2 quadros + sopro de poeira + chute. Risadas são uma inclinação alternada + balanço.
• Movimento secundário: ondas de tecido de faixa, folhas/poeira/gotas/efeitos Zzz, água fluindo. Algo sempre se move.
• Andadas: walk() fornece distância + fase de passo. Pés plantados, balanço 3-7%.
• Lente: profundidade de campo em close-ups e médios (cInf 8-14 px), foco nos olhos. Planos gerais são nítidos. Racks levam ~14 f.

4.6 Verificação visual (antes da renderização completa)

Renderize stills no meio de cada plano mais as transições e ações-chave: node render.mjs stills/a "5,40,..." então python3 sheet.py stills/a stills/sheet_a.jpg. Olhe a folha e corrija estas armadilhas:

• Quadro vertical estreito: meia largura horizontal = d·tan(hfov/2), com hfov = 2·atan(tan(vfov/2)·0,5625). A 4 m e fov 40 isso é ±0,8 m, então coloque personagens em profundidade.
• Grades ou postes sobre rostos (câmera dentro da grade ou ~2,5 m para cima). O caminho da câmera através de casas, telhados ou arbustos. Adereços em primeiro plano a menos de ~2 m de distância. O herói escondido atrás de um pilar.
• Texto espelhado. Um cartão de parte destacada deslocado na direção errada.
• Grupos de material de extrusão: 0 = tampas, 1 = lados + topo.
• Tinta faltando: depure a saída apenas da borda. Raio da tinta ~2,5 px em 1080. O céu conta como profundidade distante, não um cartão. Envie a folha para o usuário com um resumo de uma linha do plano, então inicie a renderização completa.

4.7 Som (audio.py → stems → mix.py)

Reescreva a tabela de sinais para a história; os sintetizadores permanecem. audio.py escreve apenas stems (music.wav, sfx.wav).

• Música: um loop curto estilo marcha (bumbo/caixa, baixo dedilhado, naipe de metais). Para na linha da reviravolta, então um zumbido grave continua.
• SFX em eventos (em quadros/30): whooshes em grandes movimentos, thunk em carimbos, estrondo+colapso em colapsos, raspado em metal, ting em revelações, stinger na reviravolta, rangidos, estalo, splash, ronco, folhas, ambiente de água.
• Misture com python3 mix.py voice.mp3 music.wav sfx.wav. Ele define a música para exatamente 50% do RMS com gate da voz (−6 dB) e SFX para 50% com picos limitados a 0,7× o pico da voz. Ele imprime os níveis medidos: confirme que a música mostra −6,0 dB vs voz e o SFX está nesse nível ou abaixo.
• Trave o tempo da imagem antes de fazer o som. Qualquer alteração de tempo significa reexecutar audio.py e mix.py.

4.8 Renderizar + finalizar

• Execute node render.mjs frames "0-<N-1>" com Bash run_in_background, monitorado por um loop Monitor que relata progresso e captura erros ou saída do processo. RESUME=1 continua após uma interrupção. Não execute Python pesado ao mesmo tempo em máquinas pequenas.
• Execute bash finish.sh "Título". Ele aplica um ganho linear para cerca de −14 LUFS mais um limitador de pico de −1 dBFS, codifica H.264 CRF 17 + AAC, executa QA de congelamento/preto e loudness, e escreve out/qa_sheet.jpg. Olhe a folha. Partes congeladas ≥0,4 s ou quadros pretos precisam de correção.
• Entregue o MP4 com SendUserFile e algumas linhas sobre o que cada plano mostra. Ofereça legendas, ajustes ou a próxima ideia da lista.

Armadilhas do mecanismo (mantidas no kit; mantenha-as se reconstruir)

• #include <fog_vertex> / <fog_fragment> vão em suas próprias linhas.
• A passagem final escreve linearToOutputTexel(...) (alvos de renderização são HalfFloat linear).
• A passagem normal+profundidade troca materiais por malha: mundo → normal/profundidade, cartões → máscara testada por alfa (rgb 0, a = profundidade), blobs/nuvens/céu escondidos, água → normal plana. Névoa e sombras estão desligadas durante ela.
• A tinta vai apenas no lado próximo de saltos de profundidade. Vincos vêm do dot normal. Vizinhos de cartão são ignorados. A tinta desaparece em ~140-520 m.
• Profundidade de campo: 48 taps com teste de CoC por amostra (sem sangramento de primeiro plano).
• O sol vem de az/el por predefinição de luz. A câmera de sombra está centrada na ação de cada plano.

Arquitetura (referência para editar o kit)

• web/index.html carrega main.js (módulo ES) sobre um servidor HTTP local

...

[truncado para tradução]