Communitygithub.com

Antonod1988/code-explainer-film

Crie um curta-metragem narrado completo ou um vídeo explicativo animado inteiramente em código, sem gerador de vídeo: ilustração Canvas 2D e inserções 3D three.js gravadas quadro a quadro em MP4, narração neural com temporização por palavra que conduz a edição, trilha sonora e efeitos sonoros sintetizados em numpy, versões separadas por idioma, verificações de imagem e áudio sem intervenção humana, e cópias de entrega para Telegram, YouTube e X. Use sempre que o usuário quiser uma animação, vídeo explicativo, ensaio em vídeo, filme educativo ou introdução.

O que é code-explainer-film?

Este skill permite criar curtas-metragens narrados ou vídeos explicativos animados inteiramente através de código, sem usar geradores de imagem ou vídeo. A abordagem central é "voz em primeiro lugar": o roteiro é escrito com marcadores que, após a narração por um serviço de TTS (text-to-speech), se tornam tempos absolutos em segundos, guiando toda a edição visual e sonora. A pipeline suporta múltiplos idiomas automaticamente, gerando timelines distintas para cada língua, e inclui síntese de voz neural, composição musical via numpy, verificação de áudio por métricas como LUFS e transcrição, e renderização frame a frame em MP4 sem armazenamento intermediário de quadros. Projetado para plataformas como Telegram, YouTube e X, o skill é ideal para criadores que desejam total controle, repetibilidade e versionamento de seus filmes explicativos, educacionais ou ensaios visuais.

Funciona com~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/Antonod1988/code-explainer-film/tree/HEAD/skills/code-explainer-film

Perguntar na sua IA favorita

Abre um novo chat com esta habilidade de agente já pré-carregada.

Documentação

Filme em código

O filme é um programa. Cada quadro é uma função pura do tempo, desenhada por código que você escreve, e a voz, a música e cada som também vêm do código. Nenhum gerador de imagem ou vídeo está envolvido. Assim, qualquer segundo pode ser alterado e re-renderizado, e outro idioma é uma reexecução, não uma nova edição.

Esta pipeline produziu um filme de 5:16 em russo e inglês: 16 beats, 57 cues, dez inserções 3D, cerca de 1,5 a 2 horas do roteiro ao primeiro idioma, 14 a 16 minutos de renderização por idioma em um laptop. O código desse filme está em assets/examples/court-astronomer/.

A ideia central: voz primeiro

Escreva o roteiro com marcadores. Deixe o serviço de voz falar e reportar o tempo de cada palavra. Um marcador então se torna um segundo absoluto, e tanto a imagem quanto o som dependem desses segundos.

Придворные астрономы {plant}поставили её на карту и {cut}записали дату.

CUE.plant = 9.21    a mão coloca a estrela: thunk, faíscas
CUE.cut   = 10.50   corte para o documento, a pena começa a escrever

Cada idioma obtém sua própria linha do tempo a partir de sua própria gravação, então um filme em russo e um em inglês são editados de forma diferente sem trabalho extra, e uma frase reescrita move tudo depois dela. É por isso que a ordem abaixo é roteiro, voz, imagem, som, e nunca imagem primeiro.

script/script.json ─ tools/tts.py ─> audio/voice/<lang>/  +  web/timing_<lang>.js
                                                                   │
                         ┌─────────────────────────────────────────┴───────┐
                  web/film.js + shots + space.js                    audio/score.py
                         │ render.py                                       │
                  renders/film_<lang>/film_<lang>.mp4               audio/mix/<lang>.wav
                         └───────────────── tools/finish_film.py ──────────┘
                                 final/<stem>.mp4, -phone.mp4, .srt

Iniciar um projeto

python <this-skill>/scripts/check_env.py
python <this-skill>/scripts/new_project.py <pasta>

Coloque o projeto em uma unidade com espaço, em uma pasta nomeada após o filme, em um caminho curto. Os quadros são transmitidos para o codificador e nunca armazenados, então um filme de 5 minutos precisa de cerca de 1 GiB.

O novo projeto é uma demonstração funcional de 25 segundos sobre as fases da Lua, em dois idiomas. Execute os comandos que new_project.py imprime e observe a folha de contato antes de alterar qualquer coisa: se a demonstração funcionar, cada falha posterior é sua e não da máquina.

Status do modelo. A pipeline fez o filme real, mas este modelo foi extraído depois. Na demonstração, tts.py, a mixagem e as verificações de som foram executadas. As ferramentas de entrega foram executadas em um clipe preto, render.py em páginas de stub, e a lógica de imagem plana em cada quadro em um canvas stub em ambos os idiomas. O modelo nunca desenhou um quadro real, e sua cena 3D nunca foi executada. Portanto, os primeiros stills também são o teste do modelo: se falharem, compare com assets/examples/court-astronomer/, que é o código que realmente renderizou.

Em seguida, substitua o conteúdo e mantenha a maquinaria:

Substitua para cada filmeNormalmente deixe como está
script/script.jsontools/
web/shots.js (planos 2D)render.py, server.py
web/film.js: SHOT e SEQweb/main.js, web/lib.js, web/labels.js
web/space.js: os buildersweb/space.js: o kit acima deles
audio/score.pyaudio/mixlib.py, audio/synth.py

Fluxo de trabalho

Execute comandos que levam mais de dois minutos em segundo plano. Se a máquina tiver uma fila de tarefas ou uma regra térmica (verifique nas notas do projeto e na memória), execute as renderizações através dela.

1. Definir a solicitação

Pergunte apenas o que você não pode definir por padrão: o assunto, os idiomas, onde será publicado. Padrão para 1920x1080, 24 fps, -15 LUFS, um comprimento que segue do roteiro. Construa um filme bruto completo antes de polir qualquer parte dele. As pessoas julgam um filme inteiro muito melhor do que dez segundos perfeitos, e muitas vezes dizem claramente que a qualidade máxima pode esperar.

2. Ler a referência, se houver

Meça em vez de adivinhar: cortes, ritmo, paleta, com que frequência o personagem atualiza, espessura de linha, granulação. Você pode fazer isso quadro a quadro em um navegador sem baixar o vídeo. Leia references/reference-analysis.md. Anote os números como uma breve folha de estilo no README do projeto.

Pegue a técnica e deixe o conteúdo. Crie seu próprio personagem, história e designs. Não reutilize quadros, personagens, logotipos ou uma melodia reconhecível da referência, e não recrie uma obra específica mesmo com um novo nome.

3. Fazer um teste de 10 segundos

Um plano com o visual final, silencioso. Tempos codificados são aceitáveis aqui porque isso apenas testa o visual. Envie para o usuário. Este é o momento mais barato em todo o projeto para mudar de direção.

4. Coletar fatos, escrever o roteiro

Leia references/script-and-voice.md. Divida o filme em beats de 10 a 35 segundos, cada um com uma ideia e geralmente um plano. Orçamento de palavras: cerca de 125 por minuto em russo e 150 em inglês, pausas incluídas. Coloque cues nas palavras onde algo deve acontecer na tela.

Mantenha fatos exatos e interpretação visivelmente separados, no filme e não apenas em suas anotações. Se você calcular algo, mantenha os dados em um arquivo que o filme lê, para que o que está na tela seja o que os dados dizem.

Mostre o roteiro ao usuário se o assunto for sensível ou se eles pediram para aprová-lo. Caso contrário, continue e deixe-os reagir ao filme.

5. Voz, depois linha do tempo

python tools/tts.py

Ele imprime cada cue como nome=palavra@segundos. Leia essas linhas: uma cue na palavra errada é muito mais barata de detectar aqui. Verifique o total em relação ao alvo. Se ficar longo, corte texto; não acelere a voz além de cerca de +10%.

6. Escrever os planos

Leia references/picture.md. Tudo na tela é uma função de (g, t) e cada tempo deriva de CUE ou BEAT. Planos 2D desenham com o kit Canvas; planos 3D renderizam através do compositor no mesmo canvas 2D. Uma passagem de granulação no final de cada quadro e um conjunto de rótulos fazem os dois serem lidos como um único filme.

7. Olhar stills, corrigir, repetir

python render.py renders/check "lang=ru&times=25,66,241,273"
python tools/contact.py renders/check 4

Leia references/review-and-render.md para saber como escolher momentos e o que procurar. Abra a folha e realmente inspecione: a maioria dos defeitos é invisível no código e óbvia na imagem. Agrupe suas perguntas. Renderizações de revisão consecutivas são o que aquece um laptop e torna uma sessão lenta.

8. Escrever o som

Leia references/sound.md. As seções começam nos beats da voz, os efeitos ficam nos mesmos nomes de cue que a imagem, a música abaixa sob a voz, e a mixagem atinge -15 LUFS.

python audio/score.py ru
python tools/bands.py ru
python tools/qa_audio.py ru whisper

Você não pode ouvi-lo, então use os números. Mire para cerca de 10 dB de voz sobre o resto em cada beat; o filme real ficou entre 6,7 e 14,2 dB, principalmente 7 a 9, então não fique abaixo desse intervalo. Diga claramente que ninguém ouviu ainda.

9. Stills em cada idioma, depois a renderização completa

python render.py renders/check_en "lang=en&times=25,66,241,273"
THREADS=6 CRF=17 python render.py renders/film_ru "lang=ru&fps=24&file=film_ru.mp4"

Faça a verificação de stills em cada idioma primeiro. Uma vírgula decimal errada em um idioma custa uma re-renderização completa depois. Execute um trabalho pesado de cada vez. Alterações apenas de som não precisam de renderização de imagem: refaça a mixagem e execute finish_film.py novamente.

10. Entregar, limpar, relatar

python tools/finish_film.py ru
python tools/telegram_copy.py ru
python tools/chapters.py ru

Leia references/delivery.md para cópias de plataforma, descrições e o relatório. Nunca faça upload ou publique em nome do usuário, a menos que ele tenha solicitado essa postagem específica. Mova rascunhos para a Lixeira em vez de excluí-los, e mantenha os finais e tudo o que for necessário para recriá-los.

Regras que economizam mais retrabalho

  • Um quadro depende apenas de t. Sem relógios, sem aleatoriedade não seedada, sem estado carregado do quadro anterior. Caso contrário, um still não corresponde ao filme e uma re-renderização parcial não corresponde aos seus vizinhos.
  • Tempos vêm de cues. Um deslocamento de uma cue é aceitável. Um segundo absoluto digitado quebra no outro idioma e após qualquer reescrita.
  • Todo texto na tela passa por T_, incluindo números. 29,5 дня e 29.5 days são strings diferentes. Este é o bug que foi enviado no master inglês do filme real: um 23,4°.
  • Não presuma a ordem das cues entre idiomas. A ordem das palavras difere, então CUE.a < CUE.b pode ser verdadeiro em apenas um deles. Proteja spans construídos a partir de duas cues.
  • Rótulos são 2D, colocados com project(). Eles então compartilham letras, granulação e manipulação de idioma com os planos 2D.
  • Mantenha a câmera fora de qualquer coisa que gire. Verifique os extremos de um movimento em uma folha, não apenas seu meio.
  • Camadas estáticas vão para um plate(). Redesenhar um fundo detalhado a cada quadro é o que torna uma renderização lenta.
  • Altere, depois veja, depois relate. Não diga que algo está corrigido até ter visto o quadro.

O que você não pode verificar e deve dizer

  • Som. Você vê volume, equilíbrio, espectrogramas e uma transcrição. Você não sabe como soa.
  • Fluência. Você vê quadros, não a experiência do espectador, então o ritmo é seu julgamento mais fraco. Pergunte ao usuário especificamente sobre ritmo.
  • Plataformas. Você não pode ver como um arquivo se comporta dentro da conta do Telegram ou YouTube do usuário.

Relate o que foi verificado e o que não foi, nesses termos. As decisões (ideia, direção, o que cortar) são do usuário.

Arquivos inclusos

CaminhoO que éQuando ler
references/reference-analysis.mdSnippets de navegador testados para medir um vídeo, modelo de folha de estiloHá um vídeo de referência
references/script-and-voice.mdscript.json, gramática de cue, orçamento de palavras, vozes, fatosAntes de escrever o roteiro
references/picture.mdLinha do tempo, kit 2D, atuação em cues, texto, granulação, kit 3D, mapa do código de exemploAntes de escrever os planos
references/sound.mdInstrumentos, estrutura da partitura, cadeia de voz, números de mixagem, verificaçõesAntes de escrever a partitura
references/review-and-render.mdO que procurar nas folhas, modos e opções de renderização, cargaAntes da primeira revisão, antes da renderização completa
references/delivery.mdMaster, telefone, Telegram, YouTube, X, legendas, limpeza, o relatórioNo final
references/pitfalls.mdSintoma, causa, correção, em toda a pipelineQuando algo parece errado
scripts/check_env.pyO que a máquina temPrimeiro
scripts/new_project.pyCria um projeto a partir do modeloSegundo
assets/template/O esqueleto do projeto, uma demonstração funcionalCopiado por new_project.py
assets/examples/court-astronomer/O código do filme real: 10 builders 3D, planos 2D, um rig de mão, uma partitura completaUse grep para uma técnica; não executa sozinho

Habilidades Relacionadas