{
  "id": "clube-youtube-inscrever",
  "titulo": "O logo vira o botão",
  "categoria": "produto",
  "resumo": "loop quadrado de 8 s a 60 qps, sem narração, em que um risco vermelho cruza a tela, o logo do YouTube acende com um brilho radial, se achata e vira o botão \"Inscrever-se\" do canal. O cursor clica, o botão vira \"Inscrito\", o contador passa de 999 para 1.000 e a grade de vídeos sai numa rolagem em S de 1.520 px que esconde a volta do loop. Um script do After Effects (`cenas.jsx`) monta o projeto do zero. Feito pelo Clube do Motion como recriação do estilo de @illdari.",
  "indicado": "criador ou marca pedindo inscrição ou seguidor; lançamento de canal; qualquer chamada em que o logo da plataforma pode virar o próprio botão (Instagram › Seguir, WhatsApp › Enviar).",
  "estilo": [
    "interface da Apple",
    "modo claro",
    "logo que vira botão",
    "60 qps",
    "rastro longo",
    "risco de luz",
    "rolagem em S",
    "loop"
  ],
  "ficha": {
    "formato": "1080×1080, 60 qps; desfoque de movimento de 720° (fase −360°) na comp final e na pré-comp do canal, 360° na `LOOP` para a grade ficar legível",
    "duracao": "8,0 s, sem narração; o trecho de 3,70 s (222 quadros) se repete a partir de 3,70 s e de 7,40 s",
    "motor": "ae",
    "voz": "ver o guia de estilo",
    "musica": "ver o guia de estilo",
    "fontes": "SF Pro Display (Semibold e Regular) e SF Pro Text (Semibold e Regular)"
  },
  "ferramentas": [
    "Claude Code",
    "After Effects"
  ],
  "ficha_tecnica": {
    "Duração": "8,0 s, sem narração; o trecho de 3,70 s (222 quadros) se repete a partir de 3,70 s e de 7,40 s",
    "Formato": "1080×1080, 60 qps; desfoque de movimento de 720° (fase −360°) na comp final e na pré-comp do canal, 360° na `LOOP` para a grade ficar legível",
    "Ferramenta": "After Effects: um script ExtendScript (`cenas.jsx`) cria as comps `CAPA 1` a `CAPA 6`, `CANAL` (1080×2400), `LOOP` e `RECRIACAO`; o `.aep` já vem montado",
    "Assets": "logo oficial do YouTube, monograma neutro no lugar do avatar do autor original, cursores de seta e de mão e 6 capas feitas para o projeto",
    "Fontes": "SF Pro Display (Semibold e Regular) e SF Pro Text (Semibold e Regular)",
    "Som": "trecho de \"SICKO MODE\" (Travis Scott), a 103,4 BPM, recortado para as trocas caírem na batida, e 28 efeitos sonoros pela Mesa; −14,0 LUFS. A música fica fora do pacote",
    "Referência": "edit \"Apple style concept for youtube\" de @illdari (01/08/2026)",
    "Arquivo final": "MP4 H.264 com áudio AAC"
  },
  "etapas": [
    {
      "titulo": "O roteiro",
      "texto": "**Resumo:** o vídeo não tem narração; o roteiro é a sequência do trecho de 3,70 s, com o texto que aparece e os tempos do `cenas.jsx`. A segunda passada repete tudo com +3,70 s.\n\n## De onde veio a estrutura\n\nO edit de @illdari propõe um conceito de YouTube em estilo Apple: o logo da plataforma vira o botão de inscrição e a tela termina rolando a grade do canal. O trecho toca duas vezes e a pausa da voz da música cai na virada do loop. Esta recriação mantém os tempos, a curva da rolagem e a câmera, com nome de canal neutro, monograma próprio e capas feitas para o projeto.\n\n## Cenas por tempo\n\n | \n\n | Tempo (s)\n | Texto na tela\n | O que acontece\n\n | 0,00–0,20\n | —\n | dois riscos vermelhos cruzam a diagonal com rastro rosa\n\n | 0,20–0,47\n | —\n | o logo do YouTube acende com um brilho radial que cresce enquanto apaga\n\n | 0,33–0,74\n | \"YouTube\"\n | o nome sai do desfoque sob o logo e depois as letras saem em arco\n\n | 0,67–1,00\n | \"Inscrever-se\"\n | o logo anda, achata e chicoteia; o botão vermelho nasce dentro do rastro\n\n | 0,73–1,15\n | \"seu canal\" · \"999 inscritos\"\n | o avatar entra pela esquerda com rastro longo; nome, contador e fio saem do desfoque\n\n | 1,17–1,57\n | —\n | a seta do cursor entra por baixo, freia sobre o botão e vira a mãozinha\n\n | 1,57–2,30\n | —\n | espera viva: a mão balança e a tela cresce de leve\n\n | 2,30–2,62\n | \"Inscrito\" · \"1.000 inscritos\"\n | clique: o botão afunda e vira \"Inscrito\", um anel fino abre e o contador rola\n\n | 2,45–3,20\n | \"Mix da madrugada\" · \"Noite em casa\" · \"Retrato\" · \"Luz de vela\" · \"Carrinhos\" · \"Cromo azul\"\n | a grade nasce como esqueleto cinza e ganha as capas em cascata\n\n | 2,30–3,50\n | —\n | tudo rola para cima numa curva em S, com lente no pico, e some desfocando\n\n | 3,50–3,70\n | —\n | branco vazio; o risco do quadro 0 recomeça o loop\n\n | 3,70–8,00\n | o mesmo\n | segunda passada e o começo da terceira\n\n## Momentos para o som\n\n- A música começa no primeiro quadro; o brilho do logo, o morph, a troca da seta pela mão, o pico da rolagem e a volta do loop ficam perto das batidas.\n\n- Chicote nos riscos, no avatar e no morph; som de logo no acender.\n\n- Seta, clique e um som de sucesso no \"Inscrito\"; o contador e os esqueletos da grade têm efeito próprio.\n\n- Um efeito de rolagem acompanha a curva em S e outro marca a saída para o branco.\n\n- Na segunda passada a música não repete; os eventos tocam de novo com +3,70 s."
    },
    {
      "titulo": "A identidade visual",
      "texto": "**Resumo:** fundo branco-gelo (`#EEEEEE`), vermelho do YouTube (`#E70003`) no risco, no brilho e no botão, verde só na bolinha de \"Inscrito\", sombras curtas e suaves e SF Pro. A 60 qps, com rastro longo, curva de saída rápida e uma rolagem em S medida no original. Números tirados do `cenas.jsx`.\n\n## Palco\n\n | \n\n | Peça\n | Como é\n\n | Tela\n | 1080×1080, 60 qps\n\n | Desfoque de movimento\n | 720° (fase −360°, 16 amostras) na `CANAL` e na `RECRIACAO`; 360° (fase −180°) na `LOOP`\n\n | Montagem\n | comp `LOOP` de 3,70 s; a `RECRIACAO` empilha três cópias em 0, 3,70 e 7,40 s, cada uma com zoom de 100 a 101,2% e `wiggle(0.5, 4)` na posição\n\n | Pré-comps\n | `CANAL` (1080×2400) com tudo o que rola; `CAPA 1` a `CAPA 6` (300×300, cantos de 20 px)\n\n## Cores\n\n | \n\n | Peça\n | Valor\n\n | Fundo\n | `#EEEEEE`\n\n | Vermelho\n | `#E70003` (risco, brilho, botão, anel e texto de \"Inscrito\")\n\n | Bolinha de inscrito\n | `#2ECC71`\n\n | Esqueleto da grade\n | `#D9D9D9`\n\n | Contador e nome do canal nas capas\n | `#9A9A9A`\n\n | Fio sob o nome\n | `#C8C8C8`\n\n | Sombra\n | 20% de opacidade, distância 4, suavidade 12 (no logo e no avatar, compensada pela escala)\n\n## Fontes\n\n | \n\n | Fonte\n | Onde\n\n | SF Pro Display Semibold\n | \"YouTube\" sob o logo (46 px)\n\n | SF Pro Display Regular\n | \"seu canal\" (56 px), contador (28 px), \"Inscrever-se\" (38 px) e \"Inscrito\" (42 px)\n\n | SF Pro Text Semibold\n | título de cada vídeo da grade (19 px)\n\n | SF Pro Text Regular\n | canal de cada vídeo (15 px)\n\n## Curvas\n\n | \n\n | Nome\n | Chaves\n | Uso\n\n | Saída rápida\n | saída 5–35% · chegada 85–90%\n | logo, botão, avatar, seta, textos\n\n | Linear\n | —\n | riscos de luz\n\n | Rolagem medida\n | 36 chaves lineares, uma a cada 2 quadros\n | grade: aceleração até uns 70% do trecho e freada no resto\n\n## Cena a cena\n\n | \n\n | Cena\n | Números\n\n | Riscos\n | traço de 18 px com ponta redonda; risco 1 de (−60, 1140) a (1140, −60) em 0,03–0,17 s, risco 2 até o centro em 0,07–0,20 s; Trim Start atrasado 0,03 s; Directional Blur 45°, 60; cópia rosa de 120 px a 30% com desfoque 120\n\n | Brilho\n | sólido de 1400 px com máscara redonda de raio 230 e pena 420; escala 30 › 150% em 0,20–0,47 s; opacidade 0 › 60 › 0\n\n | Logo\n | 312 px; escala 40 › 100% (0,20–0,40 s), respira até 93% em 0,65 s; desfoque 115 › 0; Directional Blur pela velocidade (×3,8)\n\n | \"YouTube\"\n | sai do desfoque (15 › 0) em 0,33–0,47 s; em 0,58–0,74 s as letras saem em arco: posição (40, −80), rotação 60°, faixa de 40%, primeira letra antes\n\n | Morph\n | logo de (540, 544) a (718, 639) e para 95 × 47% em 0,67–1,00 s; some em 0,80–0,85 s; o botão de 316×98 (raio 20) nasce em 0,80 s indo de (650, 600) a (718, 639), com rotação −4° › 1,5° › 0°\n\n | Avatar\n | 306 px; x −200 › 343 em 0,73–1,10 s; 4 ecos a cada 2 quadros (50, 33, 20 e 10%)\n\n | Nome e contador\n | entram com desfoque 12 › 0 em 0,95–1,10 s; fio de 318 px cresce da esquerda em 0,98–1,15 s\n\n | Cursor\n | seta de (1020, 910) até o botão em 1,17–1,50 s; vira a mão em 1,567 s; `wiggle(1, 3)` de 1,55 a 2,30 s\n\n | Clique\n | botão e mão afundam para 94% e 90% em 2,30–2,42 s; \"Inscrito\" (350×96) entra em 2,37–2,40 s com desfoque 10 › 0; anel de 250 px e traço de 3 px vai a 165% e apaga em 2,40–2,58 s\n\n | Contador\n | \"999 inscritos\" sobe 30 px e some; \"1.000 inscritos\" vem de baixo em 2,47–2,62 s\n\n | Grade\n | 6 capas em 2 colunas (x 286 e 805); esqueleto com desfoque 20 › 0 a cada 0,15 s desde 2,45 s; capa entra 0,10 s depois do esqueleto\n\n | Rolagem\n | y 540 › −980 (1.520 px) entre 2,30 e 3,45 s; escala 100 › 104 › 97%; lente Optics Compensation 0 › 30 › 0 em 2,85–3,45 s; some com desfoque 0 › 40 em 3,30–3,50 s; branco até 3,70 s\n\n## Som\n\n | \n\n | Item\n | Valor\n\n | Música\n | trecho a partir de 265,576 s de \"SICKO MODE\", 103,4 BPM; ganho −10 dB antes da soma\n\n | Eventos\n | 28 (14 por passada): chicote, logo, texto-sai, morph, texto, seta, clique, sucesso, skeleton, contador, rolagem e sai\n\n | Efeitos\n | um por evento, pelo mapa padrão da Mesa, sem tonais; barramentos ×4\n\n | Medido\n | final −14,0 LUFS, pico −1,3 dBFS; música −15,3 e efeitos −18,3 LUFS\n\n## O que é \"humano\" neste vídeo\n\n- O logo respira 7% antes de virar botão, em vez de esperar parado.\n\n- A mão balança alguns pixels enquanto espera o clique.\n\n- Cada passada cresce 1,2% e oscila de leve, até na espera."
    },
    {
      "titulo": "A montagem no After Effects",
      "texto": "| \n\n | Arquivo\n | O que faz\n\n | `ae/cenas.jsx`\n | apaga o que houver no projeto aberto e monta tudo. No topo ficam o bloco `CFG` (textos, cores, fontes, duração do loop) e o mapa das cenas em segundos. Ajudantes: `K` (chaves com influência, linear, hold ou a curva contínua \"A\"), `retang`, `circulo`, `texto`, `animador`, `blur`, `sombra`, `risco` (linha com Trim Paths andando), `rastro` e `eco2d` (cópias atrasadas, só atrás do movimento). A curva da rolagem está na lista `rolY`, com a posição a cada 2 quadros\n\n | `ae/youtube.aep`\n | o resultado do script, pronto para abrir e renderizar\n\n | `audio/trilha.py`\n | lê `eventos.json`, põe a música 10 dB abaixo antes da soma, coloca um efeito por evento pelo mapa padrão, reforça os efeitos ×4 e mixa para −14 LUFS\n\n | `audio/eventos.json`\n | tempos e tipos de cada evento (chicote, logo, morph, texto, seta, clique, sucesso, skeleton, contador, rolagem…)\n\n- **Fontes:** instale SF Pro Display e SF Pro Text em `C:\\Program Files\\Common Files\\Adobe\\Fonts` e reinicie o After Effects.\n\n- **Abrir:** `projeto/ae/youtube.aep`. Se o AE pedir arquivos, aponte para `projeto/assets/`.\n\n- **Adaptar:** troque o nome do canal, o contador, os textos do botão e os títulos dos vídeos em `CFG.textos`; ponha o seu avatar em `assets/monograma.png` e as suas capas em `assets/capa-1.png` a `capa-6.png`. Abra um projeto vazio e rode File › Scripts › Run Script File › `cenas.jsx`.\n\n- **Render:** fila do AE com a comp `RECRIACAO` em H.264, a 60 qps.\n\n- **Som:** no `audio/trilha.py`, troque o `sys.path` para a pasta `audio/mesa`, ponha a sua faixa em `audio/musica.wav` e rode `python audio/trilha.py`. Cole o `audio/mix.wav` no vídeo com o ffmpeg (`-c:v copy -c:a aac -shortest`).\n\n**Pegadinhas:** desfoque e sombra rodam antes da escala; o logo é uma imagem de 1200 px a 26%, então os valores dele vão ×3,8. Gaussian Blur numa forma escalada a 250% corta em quadrado: o brilho do logo é um sólido grande com máscara redonda de pena larga. Directional Blur na grade borra o texto; ali o rastro é só o desfoque de movimento. A 60 qps o render leva o dobro do tempo de 30 qps."
    },
    {
      "titulo": "As decisões de direção",
      "texto": "- **O logo vira o botão.** O logo anda 178 px para a direita e 95 px para baixo, achata para 47% de altura e chicoteia (−6° › 2° › 0°); o botão vermelho nasce aos 0,80 s, já em movimento, e a troca some no rastro.\n\n- **60 qps com rastro longo.** O morph de 0,33 s tem 20 quadros; o avatar leva quatro cópias atrasadas 2 quadros cada, de 50% a 10%.\n\n- **Um gancho de 0,2 s.** Dois riscos vermelhos cruzam a diagonal com um rastro rosa antes de qualquer outra coisa.\n\n- **O brilho nunca encolhe.** O halo do logo cresce de 30 a 150% enquanto acende e apaga.\n\n- **O clique tem recompensa.** O botão afunda, vira \"Inscrito\" com a bolinha verde, um anel fino abre e o contador rola de 999 para 1.000.\n\n- **A grade nasce como esqueleto.** Placeholders cinza em cascata de 0,15 s ganham as capas num crossfade de 6 quadros.\n\n- **A rolagem esconde a emenda.** 1.520 px numa curva em S medida no original, com escala 100 › 104 › 97% e lente no pico; o branco depois dela vira o primeiro quadro.\n\n- **Nada para.** Na revisão, cada passada ganhou um zoom de 1,2% e uma oscilação de uns 4 px, porque a espera do clique ficava 0,75 s totalmente parada.\n\nDetalhes de cores, tempos e números: estilo.md. Cenas por tempo: roteiro.md. Para fazer o seu com outra plataforma: PROMPT.md."
    },
    {
      "titulo": "As versões até o final",
      "texto": "| \n\n | Versão\n | O que mudou\n\n | **v1**\n | recriação ajustada lado a lado com o original; nome do canal neutro, monograma e capas próprias; na revisão, zoom de 1,2% e oscilação de ~4 px em cada passada para acabar com 0,75 s de tela parada"
    }
  ],
  "pacote": [
    {
      "pasta": "projeto/",
      "conteudo": "`ae/cenas.jsx` (o gerador comentado), `ae/youtube.aep` (o projeto montado) e `assets/` (os 10 PNGs que o script importa)"
    },
    {
      "pasta": "audio/",
      "conteudo": "`trilha.py` (o som inteiro), `eventos.json` (os 28 eventos), `mix.wav`, `relatorio-som.json` e `mesa/`, com o motor de mix `mesa.py` e o `mapa_padrao.py`"
    },
    {
      "pasta": "referencias/",
      "conteudo": "`estudo-da-referencia.md` (o edit original quadro a quadro, com cores, tempos e receita), `links.md` e `fora-do-pacote.md`"
    },
    {
      "pasta": "render.mp4",
      "conteudo": "o vídeo final"
    },
    {
      "pasta": "ae/cenas.jsx",
      "conteudo": "apaga o que houver no projeto aberto e monta tudo. No topo ficam o bloco `CFG` (textos, cores, fontes, duração do loop) e o mapa das cenas em segundos. Ajudantes: `K` (chaves com influência, linear, hold ou a curva contínua \"A\"), `retang`, `circulo`, `texto`, `animador`, `blur`, `sombra`, `risco` (linha com Trim Paths andando), `rastro` e `eco2d` (cópias atrasadas, só atrás do movimento). A curva da rolagem está na lista `rolY`, com a posição a cada 2 quadros"
    },
    {
      "pasta": "ae/youtube.aep",
      "conteudo": "o resultado do script, pronto para abrir e renderizar"
    },
    {
      "pasta": "audio/trilha.py",
      "conteudo": "lê `eventos.json`, põe a música 10 dB abaixo antes da soma, coloca um efeito por evento pelo mapa padrão, reforça os efeitos ×4 e mixa para −14 LUFS"
    },
    {
      "pasta": "audio/eventos.json",
      "conteudo": "tempos e tipos de cada evento (chicote, logo, morph, texto, seta, clique, sucesso, skeleton, contador, rolagem…)"
    }
  ],
  "prompt": "Quero um loop quadrado no mesmo método do projeto \"youtube-inscrever\", que está em 07-videos/projetos/youtube-inscrever/: o logo da plataforma vira o botão de ação, o clique tem recompensa e a tela sai numa rolagem em S, a 60 qps.\n\nPlataforma (YouTube, Instagram, TikTok, WhatsApp…): {{PLATAFORMA}}\nBotão e estado depois do clique (ex.: Seguir › Seguindo): {{BOTAO}}\nMeu perfil ou canal (nome, avatar e número antes e depois): {{PERFIL}}\nO que rola no fim (grade de vídeos, posts, produtos): {{GRADE}}\nMúsica (arquivo e segundo de início): {{MUSICA}}\n(Se algum desses estiver vazio ou com as chaves, me pergunte antes de começar.)\n\n1. Estude o projeto antes de propor qualquer coisa. Leia LEIA-ME.md, estilo.md e roteiro.md e abra projeto/ae/cenas.jsx: o bloco CFG, os ajudantes risco, sombra, rastro e eco2d, a pré-comp CANAL e a lista rolY da rolagem. Me diga em poucas linhas o que vai reaproveitar.\n\n2. Pegue o logo oficial da plataforma (SVG ou PNG do site oficial ou da Wikimedia) e a cor exata do botão no app. Avatar e capas são meus; se faltarem, gere imagens sem marca.\n\n3. Planeje o morph antes de animar: para onde o logo anda, quanto achata, em que quadro o botão nasce já em movimento. Monte a tabela tempo › peça › texto e espere meu ok.\n\n4. Construa copiando o projeto, sem editar o original. Mantenha os 60 qps, o rastro longo (720° e eco atrás de quem anda rápido), o risco de luz na cor da marca como gancho, o brilho que só cresce, o clique com anel e contador e a grade que nasce como esqueleto. Desfoque e sombra rodam antes da escala: compense os valores nas imagens grandes.\n\n5. Use a curva da rolagem como está (1.520 px, escala 100 › 104 › 97% e lente no pico) e termine num quadro igual ao primeiro. Nenhum trecho com a tela 100% parada: se a espera do clique parar, ponha um zoom leve e uma oscilação de poucos pixels na comp final.\n\n6. Meça as batidas da música (librosa), encaixe logo, morph, clique e rolagem perto delas, escreva os eventos num eventos.json e faça o som pelo audio/trilha.py: um efeito por peça, música 10 dB abaixo antes da soma, final em −14 LUFS.\n\n7. Antes do render, me mostre uma folha de contato com 12 quadros, incluindo o meio do morph e da rolagem. Renderize a comp RECRIACAO em H.264 a 60 qps, cole o som com o ffmpeg e entregue o MP4 com uma anotação do que mudou.",
  "campos": [
    "BOTAO",
    "GRADE",
    "MUSICA",
    "PERFIL",
    "PLATAFORMA"
  ],
  "fonte": {
    "nome": "Clube do Motion",
    "url": "https://clubedomotion.com/projeto/?id=youtube-inscrever",
    "uso": "liberado pelo dono do Clube do Motion em 18/10/2026 (docs/permissoes/clube-do-motion.md)"
  }
}