# Guia de Estilo — Criativos IG @franciscoborrello Extraído dos 16 modelos da pasta MIA (Drive), 2026-09-11. Atualizado em 2026-09-18 com regra de tamanho mínimo de fonte para público 60+ e regra de ACENTUAÇÃO PT-BR obrigatória. ## RESUMO EXECUTIVO Sistema visual altíssimamente consistente. Formato feed IG vertical 1080x1350. Fundo predominantemente PRETO com destaque em AMARELO NEON (highlight de headline). Tipografia display extra-bold condensada, headline em CAIXA ALTA sempre com uma palavra "destacada" em quadrado amarelo. Foto do Borrello ou imagem simbólica ocupa metade a dois terços da arte. "Chip" no topo com pílula "FENG SHUI • ENERGIA DA CASA" e CTA amarela fixa embaixo "FAÇA O TESTE GRATUITO". Barra Instagram (foto perfil + @franciscoborrello + botões Seguindo/Enviar mensagem) É PARTE DA ARTE — sempre presente, embutida no layout. ## TAMANHOS DE FONTE OBRIGATÓRIOS (público 60+) **REGRA CRÍTICA: público-alvo do Borrello é 60+. Fonte pequena = perde audiência. Todo criativo tem que passar no teste "consegue ler no thumbnail do celular sem forçar a vista".** Sizes mínimos por elemento (aplicáveis a 1080x1080 e 1080x1350): | Elemento | Mínimo | Ideal | Máximo | Observação | |---|---|---|---|---| | Headline principal (display) | 90pt | 100-110pt | 128pt | Deve ocupar 25-35% da altura do slide | | Subtítulo / apoio | 46pt | 48-52pt | 60pt | Nunca abaixo de 46pt | | Kanji / símbolo central | 300pt (dominante) | 400-520pt | 820px (full-frame) | Deve ocupar 40-50% do slide em altura | | Pílula / selo topo | 28pt | 32pt | 36pt | Padding 16x32 confortável | | Badge numérico (01/07) | 68pt | 82pt | 90pt | Sempre com borda amarela grossa | | Numeração de slide (rodapé) | 32pt | 34pt | 40pt | Nunca menor que 32pt | | Label de mini-card / ícone | 22pt | 26pt | 30pt | Em CAIXA ALTA extra-bold | | Texto explicativo de mini-card | 22pt | 24pt | 30pt | Peso 700 (bold) | | Swipe / CTA arraste | 30pt | 34pt | 40pt | Com seta em círculo 78px+ | **Dimensões mínimas de elementos gráficos:** - Ícones: mínimo 100px de largura visual - Mini-cards (grids de 5 itens): mínimo 185x260px cada com kanji/ícone 90pt+ dentro - Círculos destacados: mínimo 480px (60+% da largura útil) - Botão CTA: altura mínima 90px, texto 36pt+ - Sublinhado "dash marker": mínimo 100px x 8px **ANTI-PATTERNS (não fazer):** - Fonte abaixo de 32pt em NENHUM lugar do slide (nem rodapé, nem legenda) - Ícones menores que 100px - Kanji ou símbolo de fundo "decorativo" pequeno (<250pt) — fica invisível pra idoso - Muito espaço em branco elegante — Borrello prefere denso e legível - Mini-cards com kanji 36pt e label 11pt (era o padrão v2, foi rejeitado) **TESTE FINAL:** abrir arte em thumbnail de 200x250px no celular. Se você não consegue ler headline e sub sem chegar perto, refazer. ## PALETA (hex codes) - `#000000` fundo preto puro (dominante em 12 dos 16) - `#F6E600` amarelo neon principal (destaque de palavra, highlight sublinhado, CTA) — aparece em 16/16 - `#FFEE00` amarelo secundário (variação um pouco mais quente) - `#FFFFFF` texto branco puro (secundário do headline) - `#F5F1E8` bege/creme claro (fundo alternativo — 3 modelos: prato quebrado, relógio, kit cristais) - `#1A1A1A` preto suave (variação de fundo, texturas) - Amarelo âmbar/dourado (`#D4A017`) só quando fotografia tem esse tom natural (areia de ampulheta, luz de lâmpada) ## TIPOGRAFIA **Headline (display):** - Fonte: sans-serif condensada — **Bebas Neue** (Google Font). *Anton foi descartada em 2026-09-18: renderiza til/circunflexo/cedilha com kerning ruim em CAIXA ALTA (VOCÊ/NÃO/AÇÃO ficam com acentos colados/tortos). Bebas Neue mantém o visual condensado display com suporte PT-BR limpo.* - Sempre CAIXA ALTA - Tracking apertado (-0.5px) - Tamanho mínimo 90pt / ideal 100-110pt / máximo 128pt - Cor: branco (base) + amarelo (palavras-chave) OU preto (base) + amarelo highlight box - Word highlight: palavra chave envolvida em retângulo amarelo com borda arredondada 8-10px de raio **Subtítulo/apoio:** - **Inter** peso 600 (SemiBold) ou 700 (Bold) - Tamanho mínimo 46pt / ideal 48-52pt - Cor branca ou preta conforme o fundo - Frase curta (2-3 linhas) **Selo/pílula topo:** - 28-36pt, caixa alta - Fonte peso 800 (ExtraBold) - Borda amarela 3px + fundo preto - Padrão: "FENG SHUI • ENERGIA DA CASA" / "• TESTE GRATUITO" **CTA botão:** - Retângulo amarelo, cantos 12-16px arredondados - Texto preto CAIXA ALTA Inter 900 (Black) - Tamanho mínimo 36pt ## ACENTUAÇÃO PT-BR OBRIGATÓRIA (REGRA IMUTÁVEL) **Renato cobrou 3+ vezes: TODA string de texto em criativo do Borrello (e de qualquer cliente PT-BR) tem acentuação correta. Sem exceção. "Ficar mais limpo sem acento" NÃO é justificativa — legibilidade se resolve com fonte grande e contraste, não removendo acento.** ### Palavras críticas que aparecem muito (checklist antes de renderizar) | Errado | Certo | Onde aparece | |---|---|---| | voce | **você** | headline, sub, CTA | | nao | **não** | headline, sub | | esta / estao | **está / estão** | verbo (é: "está mais fraco") | | e (verbo) | **é** | "é isso", "é ação", "é força bruta" | | tambem | **também** | corpo de texto | | ate | **até** | corpo de texto | | tres | **três** | numeração escrita | | apos | **após** | corpo de texto | | atras | **atrás** | "atrás da casa", "o que fica atrás" | | a esquerda / a direita | **à esquerda / à direita** | crase — sempre com "à" | | as (horário) | **às** | "às 8h", "às vezes" | | dragao | **dragão** | um dos 5 animais | | fenix | **fênix** | um dos 5 animais | | acao | **ação** | tema recorrente | | espaco | **espaço** | "espaço pra voar" | | forca | **força** | "força bruta" | | cansaco | **cansaço** | "cansaço vem" | | predio | **prédio** | "prédio colado" | | coracao / atencao / oracao / decisao / direcao | **coração / atenção / oração / decisão / direção** | ão terminações | | ultima / proxima / saude / pais | **última / próxima / saúde / país** | agudo em vogal tônica | | solida | **sólida** | "parede sólida" | | oportunidade | **oportunidade** (sem acento) | atenção pra hipercorreção | ### Teste de fonte ANTES de usar em criativo Renderiza esta string de teste na fonte que você vai usar em CAIXA ALTA: ``` VOCÊ NÃO ESTÁ SÓ. ATRÁS DA CASA MORA O DRAGÃO. É AÇÃO. ``` Confere visualmente: - Til (ã, õ) aparece proporcional em cima da letra, sem colar/cortar - Circunflexo (ê, ô) aparece nítido, não borrado - Cedilha (ç) tem gancho visível abaixo do C - Acento agudo (á, é, í, ó, ú) fica na altura certa (não muito alto/baixo) Se algum caractere aparecer como quadradinho, símbolo estranho, ou visualmente "quebrado", TROCAR fonte. ### Fontes testadas para PT-BR | Fonte | Status | Uso indicado | |---|---|---| | **Bebas Neue** | Ótimo — acentos limpos | Headline principal display | | **Inter (todos os pesos)** | Perfeito | Sub, label, CTA, pill, footer | | **Noto Serif SC** | N/A (só kanjis) | Kanji chinês central | | Anton | Ruim em CAIXA ALTA — til/circunflexo colados | Evitar | | Oswald | Marginal — melhor que Anton mas ainda com kerning apertado nos acentos | Evitar em headline grande | | Bebas Neue Pro / Anton Pro (pagas) | Não testadas | — | ### Anti-patterns proibidos - Deixar palavra sem acento "porque ficou mais bonito visualmente" — NÃO - Mistura: acentuar umas palavras e outras não — pior que sem acento nenhum - Presumir que "o pixel do celular vai suavizar o acento" — não vai - Copiar copy do Jonathan sem revisar acento antes de meter no HTML ### Onde CHECAR 1. **Antes de renderizar**: reler todas as strings hardcoded no Python/HTML 2. **Após render**: abrir cada PNG e passar o olho — se ver "voce/nao/esta/atras" nas letras grandes, refazer imediato 3. **Antes de mandar pro Renato**: teste do thumbnail 200x250px — dá pra ler? Os acentos aparecem nítidos? ### Nome de arquivo Nomes de arquivo podem ficar sem acento por convenção técnica (`slide_02_dragao.png` continua ok). O que **não pode** é o TEXTO dentro do arquivo. ## COMPOSIÇÃO / LAYOUT Duas variações dominantes: **Layout A (75% dos modelos) — Headline esquerda + foto direita/fundo:** - Headline no terço superior/meio esquerdo - Foto sangrando (full-bleed) ou objeto simbólico do lado direito - Barra Instagram embaixo ocupando ~10% da altura - CTA amarela fixa no rodapé (~7-8% da altura) **Layout B (25%) — Full-bleed foto com overlay escuro:** - Foto ocupa 100% do frame com gradiente/overlay preto do topo pra baixo - Headline no topo sobre o overlay - Barra Instagram + CTA no rodapé **Layout C (carrosséis temáticos) — Kanji/símbolo dominante + headline:** - Kanji chinês ou símbolo com 400-820px ocupando um lado do frame - Headline no lado oposto ou centralizada abaixo - Sub embaixo com sub 44-50pt - Numeração de slide + badge numerico bem visível **Elementos gráficos recorrentes:** - Ondas/rastros amarelos luminosos (energia/chi visualizado) - Pontos pequenos em grid formando textura (padrão bolinhas amarelas) - Círculos concêntricos finos amarelos ao redor de foto do Borrello - Sublinhado amarelo curto ("dash marker") acima ou abaixo do headline — mínimo 100x8px - Baguá/pêndulo/ampulheta como ícone gráfico central quando não tem foto do Prof. ## FOTOGRAFIA - **Foto do Prof. Borrello**: recortada (sem fundo), quase sempre no lado direito, meio corpo. Aparece em ~8 dos 16 modelos. Roupa: paletó preto ou camisa xadrez/social. Óculos sempre. - **Ambientes reais**: cozinha, sala, quarto, banheiro, entrada de casa — sempre com iluminação quente/dourada aconchegante, tratamento cinematográfico. Frequentemente com detalhe amarelo brilhante superimposto (curva de energia). - **Simbolismo**: prato quebrado, relógio antigo, ampulheta, pêndulo, cristais, mesa radiônica, kit em caixa. Objeto em close, fundo claro (bege) ou preto profundo. ## ASSINATURA / BARRA INSTAGRAM Presente em 16/16 dos modelos. Composta por: - Foto redonda pequena do Borrello (avatar) - "Francisco Borrello" em branco/preto SemiBold - "@franciscoborrello" em cinza claro/regular abaixo - Botão "Seguindo v" (cinza claro, arredondado) - Botão "Enviar mensagem" (cinza claro, arredondado) - Ícone + de seguir (círculo) - Reticências (menu) **Posição:** rodapé, largura total. Fica ACIMA da CTA amarela quando ela existe. ## COPY / TOM - Headlines em pergunta ("O que este prato quebrado ainda está servindo?", "Que horas a energia da sua casa parou?") - Afirmações de contraste ("Você dorme. Seu reflexo fica acordado.") - Palavra-conceito destacada em amarelo: REFLEXO / ACORDADO / QUEBRADO / PAROU / DRENANDO / RADIESTESIA / ANIVERSÁRIO / KIT / PAUSA - Subtítulo é sempre reflexivo, cria dúvida ("Talvez não seja comida.", "Um relógio parado pode dizer mais do que parece.") - CTA direta: "Faça o teste gratuito" / "Acesse o link da bio" / "Estou te esperando" - **1ª pessoa do Borrello** conversando com o seguidor, sem auto-elogio, sem citar módulos/aulas - Foca em SINTOMA + CURIOSIDADE + DESEJO, nunca em features ## EXEMPLOS POR ARQUIVO - `Screenshot_1.jpg` — "VOCÊ ABRIU A PORTA. E A MUDANÇA ENTROU." Dia do Cliente, layout preto+amarelo, foto de entrada com onda de energia. - `Screenshot_2.jpg` — "VOCÊ DORME. SEU REFLEXO FICA ACORDADO." Quarto com espelho + Borrello apontando. - `Screenshot_3.jpg` — "O QUE ESTE PRATO QUEBRADO AINDA ESTÁ SERVINDO?" Fundo bege, foto de prato quebrado. - `Screenshot_4.jpg` — "QUE HORAS A ENERGIA DA SUA CASA PAROU?" Relógio antigo + Borrello. - `Screenshot_5.jpg` — "O QUE ESTÁ DRENANDO A ENERGIA DA SUA CASA?" Banheiro com vaso aberto, curva amarela. - `Screenshot_6.jpg` — Carrossel: "3 COISAS QUE A RADIESTESIA PODE AJUDAR VOCÊ A COMPREENDER" — capa preta com pêndulo linear amarelo. - `Screenshot_7.jpg` — "NEM TODO DESEQUILÍBRIO SE RESOLVE SOZINHO." Setembro Amarelo, casal, laço amarelo. - `Screenshot_8.jpg` — "É HOJE! ÚLTIMO DIA DA PROMOÇÃO DE ANIVERSÁRIO" — CTA aniversário 7 anos. - `Screenshot_9.jpg` — "ACABA AMANHÃ!" — 31 de agosto, calendário amarelo. - `Screenshot_10.jpg` — Carrossel: "MAS EU NUNCA ESTUDEI ISSO ANTES." Objeção com foto do Borrello. - `Screenshot_11.jpg` — "SE VOCÊ PUDESSE CONHECER PRIMEIRO APENAS UMA DELAS, QUAL ESCOLHERIA?" As 5 Mesas com ícones. - `Screenshot_12.jpg` — "TALVEZ VOCÊ ESTIVESSE ESPERANDO UM MOMENTO PARA COMEÇAR." Ampulheta dourada. - `Screenshot_13.jpg` — "VOCÊ GANHA 1 KIT ADICIONAL DE MESAS RADIÔNICAS" — presente aniversário. - `Screenshot_14.jpg` — "VOCÊ OLHA PARA UMA MESA RADIÔNICA. MAS SABE O QUE EXISTE POR TRÁS DELA?" Borrello + mesa radiônica. - `Screenshot_15.jpg` — "ANTES DE DIZER 'SIM', FAÇA UMA PAUSA" — mulher pensativa + ampulheta. - `Screenshot_22.jpg` — "TUDO EM UM ÚNICO KIT" — fundo bege claro, kit de cristais/gráficos. ## CHECKLIST PARA REPRODUZIR O PADRÃO - [ ] Fundo preto (dominante) ou bege claro (variação secundária) - [ ] Headline em CAIXA ALTA display bold condensada, **mínimo 90pt** - [ ] UMA palavra-chave da headline em highlight box amarelo - [ ] Subtítulo em uma frase curta reflexiva, **mínimo 46pt** - [ ] Foto/objeto simbólico OU kanji dominante ocupando 40-60% do frame - [ ] Pílula topo com selo "FENG SHUI • [TEMA]" **mínimo 28pt** - [ ] Numeração/badge **mínimo 68pt** - [ ] Mini-cards (se houver) **mínimo 185x260 com kanji 90pt+ e label 22pt+** - [ ] Barra Instagram no rodapé (avatar + nome + botões) - [ ] CTA amarela "FAÇA O TESTE GRATUITO" quando aplicável, **mínimo 36pt** - [ ] Fonte tamanho GRANDE em TUDO (público 60+ é regra crítica) - [ ] Copy = desejo/dor/curiosidade, NÃO features - [ ] Teste do thumbnail: consegue ler tudo em 200x250 no celular? ## QA FINAL — 5 PONTOS OBRIGATÓRIOS (antes de enviar qualquer criativo Borrello) Rode esta checklist em TODO PNG antes de mandar pro Renato. Se falhar em qualquer um, refaz. Sem exceção. 1. **Acentuação PT-BR correta** — rodou `python3 /opt/mia/scripts/qa_criativo.py --severity HIGH` e teve exit code 0? Se não, corrige o texto no HTML e rerenderiza. Público 60+ nota acento faltando na hora e desconfia da autoridade. 2. **Fontes gigantes** — headline ≥90pt, subtítulo ≥46pt, badge ≥28pt, numeração ≥68pt. Ver seção "TAMANHOS DE FONTE OBRIGATÓRIOS". Se dá pra ler tudo confortavelmente num thumbnail 250x250 no celular, tá bom. 3. **Sem auto-elogio** — ZERO menção a "40 anos de experiência", "40 mil alunos", "método que uso", "referência em feng shui" ou similar. Copy em 1ª pessoa do Borrello conversando sobre feng shui, nunca sobre si mesmo. Ver `feedback_borrello_sem_autoelogio.md` na memória. 4. **Imagem realista** — foto do Borrello (rotacionar dentre as 50 em `/opt/mia/workspace/clientes/borrello/fotos_banner/FOTOS BORRELLO/`) ou imagem gerada via gpt-image-2 realista. Nunca vetor, silhueta, ilustração cartoon. Ver `feedback_borrello_criativos_realistas.md`. 5. **Kit chamado "Kit de Tratamento - Maca"** — se o criativo menciona o kit, o nome comercial correto é **Kit de Tratamento - Maca**, NÃO "Kit Cameloterapia" (essa é só história/apelido interno). Ver `produto_kit_tratamento_borrello.md`. Bônus (não falha entrega, mas confere): - Variação de fundo entre criativos da mesma campanha (não repete bg). - Se roupa do Borrello não combina com paleta, refazer com gpt-image-2 mantendo rosto/pose e trocando roupa. - Fonte para caracteres com acento: Bebas Neue (Anton renderiza til/circunflexo com kerning ruim). ## HISTÓRICO DE FEEDBACK - **2026-09-11**: guia extraído dos 16 screenshots de referência do Drive. - **2026-09-18 (v2)**: primeira geração de carrossel "5 Animais Celestiais" com fontes 24-108pt — REJEITADA pelo Renato: "muito texto pequeno, senhoras vão ver, letras maiores, ícones ficaram pequenos". - **2026-09-18 (v3)**: refeito com tabela de tamanhos mínimos formalizada acima. Aprovado como padrão permanente para todo criativo Borrello. - **2026-09-18 (v3 c/acentos)**: 3ª cobrança do Renato sobre falta de acento. Fonte Anton descartada (renderizava til/circunflexo com kerning ruim), migrado pra Bebas Neue. Adicionada seção "ACENTUAÇÃO PT-BR OBRIGATÓRIA" como regra imutável.