Miniaturas e títulos
Defina sua marca aqui
Edite o bloco :root no início de scripts/layout-fullbleed.html e scripts/layout-panel.html:
| Configuração | Variável CSS | Padrão |
|---|---|---|
| cor de destaque | --brand-accent (+ --brand-accent-rgb como r,g,b) | #4a90e2 |
| cor do texto claro | --brand-light | #f2f2f2 |
| cor da tinta escura (traço, fundo do painel) | --brand-ink | #0d131a |
| fonte de exibição (texto grande) | --font-display | 'Anton','Bebas Neue',Impact,sans-serif |
| fonte do corpo (texto pequeno) | --font-body | 'Inter',sans-serif |
A fonte de exibição deve estar instalada localmente, pois a renderização ocorre no Chrome headless a partir de file://. Anton e Bebas Neue são gratuitas no Google Fonts.
Defina também sua LUT de correção de cor em scripts/frames.sh (LUT_DEFAULT), ou passe LUT=/path/to.cube por execução.
Padrões de estilo (ajuste a gosto)
- Nunca coloque nada sobre o rosto. Sem gradiente de vinheta sobre o assunto. Ou um painel com bordas nítidas com o rosto totalmente livre, ou imagem total com texto em espaço vazio.
- Extraia frames do RAW 4K, não de uma exportação. Frames de exportação 1080p parecem borrados.
- Graduação do frame primeiro. Material em Log (S-Log3 etc.) é plano e cinza sem graduação. Aplique a LUT com
lut3d(vejaframes.sh). Pule a LUT se a câmera gravar um perfil finalizado.
Regras que vieram da pesquisa
- Três a cinco palavras, e menos é melhor. A miniatura não é onde o vídeo é explicado.
- Um rosto vence. A maioria dos vídeos de sucesso usa um. Expressão forte supera uma neutra.
- Um assunto dominante, duas ou três cores, alto contraste.
- Avalie a ~210px. A maioria das decisões de visualização acontece no celular. Se não funcionar lá, nada mais importa.
- Título e miniatura não devem se repetir. Duas metades de uma ideia. Mantenha os títulos curtos e específicos (aproximadamente 50-60 caracteres para não serem truncados).
- Testes A/B no YouTube Studio são melhores do que discutir, então dê ao usuário 2-3 opções reais.
Qual layout
Full-bleed vence no tamanho de celular e é o padrão. Lado a lado a 210px, o rosto aparece cerca de duas vezes maior do que na versão com painel, e as sublinhas do painel desaparecem completamente.
layout-fullbleed.html: frame graduado de ponta a ponta, 1-3 palavras na fonte de exibição com traço de tinta pesado, colocado em espaço vazio (parede, porta) e nunca sobre o rosto. Predefiniçõesstab,stat,bottom,band(uma faixa sólida de destaque na parte inferior). Exemplos de variantes legadase,f,g,h.layout-panel.html: assunto em um painel quadrado limpo à direita, texto em uma metade escura à esquerda. Use quando a ideia precisar de um diagrama (a grade de pontos) ou duas linhas de texto. Exemplos de variantesa-d.
Execute
# 1. frames graduados a partir do raw, em momentos expressivos (use a transcrição para encontrá-los)
bash <skill>/scripts/frames.sh "<SEU_DISCO_DE_MIDIA>/<pasta>/C0001.MP4" "<trabalho>" 178 310 459 503
# 2. observe-os antes de escolher - uma folha de contato vence o palpite
ffmpeg -i hi-*.jpg -filter_complex hstack=... contact.jpg
# 3. renderize variantes + a folha de prova em tamanho de celular
WORK=<trabalho> OUT=<saida> node <skill>/scripts/render.mjs variants.json
variants.json:
[{"id":"E-no-time","layout":"fullbleed","v":"e","img":"full-C0001-503.jpg"},
{"id":"S-custom","layout":"fullbleed","img":"full-C0001-310.jpg",
"data":{"preset":"stab","head":"OCUPADO?","kicker":"TENTE ISSO"}},
{"id":"B-3x","layout":"panel","v":"b","img":"cut-C0001-97.jpg"}]
O texto em full-bleed pode ser passado por variante como data (preset, head, kicker, side, size), ou adicionado como um novo bloco v legado no HTML do layout. O texto do painel vive nos blocos v de layout-panel.html; adicione uma nova variante adicionando um bloco, mantendo 3 palavras.
Requer puppeteer-core: reutilize ../video-overlays/scripts/node_modules ou npm i no diretório de scripts. render.mjs inicia /Applications/Google Chrome.app/...; altere o caminho em outros sistemas.
Escolhendo o frame
Procure por sobrancelhas levantadas, uma mão aberta, boca no meio da palavra. Use a transcrição para encontrar um momento com energia, então extraia um frame um segundo depois. Frames com olhos mortos estragam tudo. Os recortes em frames.sh assumem uma fonte 4K (3840x2160) com o assunto ocupando cerca de 46% da largura do frame; ajuste os deslocamentos crop= se seu enquadramento for diferente.
Saída
Renderize em 1920x1080 (o YouTube faz o downsampling de forma limpa), mantenha abaixo de 2MB.
Relacionados
paper-edit,video-overlays: o resto do pipeline de vídeo