Log.iaFalar com a IA no WhatsApp
Log.ia
Skill de marca · instruções que a IA segue ao produzir material

name: logia-brand description: Identidade visual e verbal da Log.IA. Use SEMPRE que for criar, desenhar ou escrever qualquer peça da marca Log.IA — posts de Instagram/Meta, artes, capas, stories, banners de site, materiais de marketing, ou definir cores/fontes/tom. Garante que o resultado siga o brandbook (logo, paleta preto+verde+off-white, tipografia Poppins/Inter, tom parceiro+inovador).


Skill: Identidade da marca Log.IA

Aplique estas regras em TODA peça visual ou textual da Log.IA. Fonte completa: branding/brandbook.md (texto) + branding/brandbook.html (brand book visual — abrir no navegador: python3 -m http.server na pasta branding/). Assets em branding/assets/, scripts de geração em branding/, fontes em branding/fonts/.

Essência (norteia tudo)

Logo (NÃO recriar — usar os arquivos)

Assets prontos em branding/assets/: - Fundo claro: logo-horizontal-offwhite.png · Fundo escuro: logo-horizontal-dark.png · Transparente: logo-horizontal-transparent.png - Empilhado: logo-stacked-offwhite.png / -dark.png - Avatar de perfil (1080): avatar-offwhite-1080.png / avatar-dark-1080.png (sempre o SÍMBOLO, nunca a wordmark no círculo) - Favicon/ícone: favicon-512.png, icon-transparent.png

Regras: clear space ≥ meia-altura do símbolo; fundo escuro usa a versão dark (balão invertido p/ off-white); nunca distorcer, recolorir o ".ia" fora do gradiente, nem trocar a fonte da wordmark.

Paleta (HEX exatos)

Verde = ação e inteligência, usar com parcimônia (é o acento, não o fundo). Texto corrido sempre em grafite, nunca verde.

Tipografia

Estilo visual

Imagens reais (caminhão/estrada/pátio/motorista BR, não stock americano) + 3D sutil + minimalismo tech. Elemento recorrente: a estrada em "S" que vira rota/circuito; ponto origem→destino com nó de IA; balão de chat/UI WhatsApp. Muito respiro.

Posts (Instagram/Meta)

Os 3 conceitos de design de feed (liberdade criativa, não template rígido)

  1. Minimalista (tipográfico): off-white/dark + headline Poppins (1 palavra verde) + Inter + rota-assinatura + CTA pill. Conteúdo rápido/explicativo. (branding/post_templates.py, carousel_cards.py)
  2. Produzido (hero neon + integração): arte hero por IA (caminhão holográfico/wireframe verde-teal neon, sem texto de IA) + tipografia da marca por cima; cards com imagem integrada (imagem-topo, painel de vidro, janela neon+HUD). (branding/produced_posts.py, carousel_cards_pro.py)
  3. Hero cinematográfico (oclusão) — o "wow": caminhão fotorrealista cinematográfico (rim light teal) recortado com rembg e posto NA FRENTE de uma palavra-âncora gigante texturizada (fonte Anton) = profundidade. + tagline topo-esq, badge IA topo-dir, subtítulo c/ palavra verde, 4 features com ícones. Script parametrizado: branding/logistica_card.py. Refs: assets/card-LOGISTICA.png, card-V2.png, card-V3.png.

Regras (NÃO violar): tipografia sempre nossa (Poppins/Anton/Inter), nunca texto da IA; proibido caixinhas HUD e texto "só colado por cima" (buscar integração/profundidade); legibilidade = scrim escuro + sombra no texto; no Conceito 3 usar caminhão bem enquadrado e harmônico com a palavra (variação desarmônica foi reprovada) e gradear foto colorida pro teal (duotone) p/ coesão; foto com holograma colado = reprovado. Hero da IA via Canva generate-design (instagram_post) pedindo "NO TEXT, negative space".

Captions

Banco SEO/GEO pronto em branding/social/captions-institucional.md — parear com as artes.

Landing pages (3 estilos web — branding/landing_styles.py)

Linguagem de design para web, mesma identidade. Toda landing fecha em CTA de WhatsApp e ancora confiança (pagamento seguro). Nav = logo + links + botão verde "Falar no WhatsApp". Hero = 1 headline + 1 subhead + CTA verde. Seções alternam claro/escuro. Cards com cantos 16–24px. Estilos de referência: 1. A — Cinematográfico escuro: dark premium, caminhão no hero. Campanha/marca. (assets/landing-A.png) 2. B — Clean SaaS claro: off-white, respiro, mockup de conversa WhatsApp. Conversão. (assets/landing-B.png) 3. C — Híbrido tech: dark + seção clara com dashboard "operação em tempo real". (assets/landing-C.png)

Tom de voz

Direto, brasileiro, confiante, transparente (mostra o cálculo). Uma ideia por frase. Evitar corporativês e jargão de startup ("disruptivo", "revolucionar", "game changer").

Captions (SEO + GEO)

Keyword real front-loaded na 1ª linha; 1 trecho citável respondendo pergunta de intenção; entidades por extenso (Log.IA, WhatsApp); 15–25 hashtags por intenção incluindo #LogIA; alt-text com keyword.

Armadilhas a evitar (lições de produção — NÃO repetir)

Erros que já aconteceram e foram corrigidos. Verificar SEMPRE ao gerar arte:

  1. Faixa preta + texto embutidos na hero da IA. Imagens geradas pelo Canva às vezes vêm com uma FAIXA preta sólida no topo + texto em inglês ("INTELLIGENT LOGISTICS REDEFINED" etc.). NUNCA tentar cobrir com scrim — a borda da faixa cria uma linha dura. Recortar a faixa fora (usar só a região da foto) e então aplicar o scrim suave normal. Salvar versão limpa (ex: hero-*-clean.png).
  2. Transição preto↔imagem sempre SUAVE. Onde o bloco escuro de texto encontra a foto, usar feather LONGO (degradê de transparência) + leve Gaussian blur no scrim. Nunca corte/linha dura entre o preto e a imagem.
  3. Caixa/painel de texto NÃO cobre o caminhão. Posicionar o caminhão em cima (visível inteiro) e o texto/painel de vidro embaixo ou flutuando sobre área escura/vazia. Se a imagem for cortada (diagonal/janela), subir a imagem pro caminhão ficar inteiro acima do corte.
  4. Número grande + texto AO LADO do número nos cards de conteúdo (não embaixo).
  5. Nunca esticar imagem (manter proporção; em web usar width:auto, nunca width:100% com altura fixa). Centralizar os elementos no card (sem ficar pequeno/descolado num canto).
  6. Caminhão sempre frontal, bem enquadrado e inteiro — nunca cortado pela metade, descentralizado ou tapado.
  7. Grids sem célula vazia (ex: 5 cards numa linha de 5, não 3+2 com buraco).
  8. Slides de carrossel TODOS IGUAIS = sem criatividade (reprovado). Cada slide com layout DISTINTO — rotacionar os estilos (imagem-topo, diagonal, janela neon, número fantasma, slide claro) e variar o caminhão. A variação dentro do carrossel é obrigatória. Idem para as CAPAS na sequência do feed: variar o estilo de cover entre carrosséis (truck full-bleed + headline / truck na base + título no topo / palavra gigante / etc.) — não usar sempre a mesma, senão o feed parece tudo igual. Também: encaixar a ilustração INTEIRA (contain, recorte no bbox do brilho), nunca cortar o topo do sujeito.
  9. A imagem deve ILUSTRAR o texto (didática), não ser foto genérica jogada. O agente INTERPRETA a mensagem do slide e compõe a ilustração que a explica — usando ícones/elementos da marca (carga, caminhão, chat/WhatsApp, chip/IA, preço/R$, cadeado, rota, nós, ✓/✗). Ex: "os dois lados" → carga ⇄ caminhão conectados; "tudo no WhatsApp" → balão de conversa; "a IA acha/calcula/paga" → chip ligado a caminhão+preço+cadeado. Foto de caminhão é REFERÊNCIA, não default — usar quando o caminhão é o assunto.
  10. MÉTODO da ilustração profissional por slide (aprovado). Para slides de impacto, ilustração 3D/neon gerada por IA, não ícone de linha "preguiçoso". Passos:

    • Gerar SEM texto: prompt hiper-explícito — "absolutely NO text, no words, no letters, no captions, no logo, no UI; glowing subject on a PURE SOLID BLACK background, fills the frame, cinematic neon teal-green #22C55E/#2DD4BF". Gerar em fundo preto puro (teal/gradiente NÃO funde).
    • Limpar: se vier texto de template mesmo assim, recortar a região central limpa OU pegar outro candidato (gerar dá 4).
    • Integrar (crítico): feather nas bordas + multiply→preto + blend lighter (ver st_artwork em carousel_produce.py). O fundo preto SOME e o neon brilha saindo do escuro — SEM borda retangular dura. Nunca colar a imagem como retângulo com borda visível.
    • Compor harmônico: ilustração integrada (topo) → número verde → título Poppins → desc Inter → barra de progresso. O card inteiro tem que respirar junto, não "imagem + texto solto".
    • Misturar: ilustração pro onde agrega; manter estilo simples/desenhado onde já ficou bom (ex: o slide de celular/WhatsApp aprovado).
  11. Rotacionar o LAYOUT dos slides de ilustração (config, não só a imagem). 3 layouts no carousel_produce.py: st_artwork (ilustração contida no topo + número/texto embaixo), aw_full (ilustração imersiva full-bleed + scrim + texto), aw_split (ilustração de um lado, número+texto do outro). Rotacionar via layouts=[...] no config. Dois carrosséis NÃO podem ter a mesma cara — variar cover (hero/alt/word) E a sequência de layouts dos slides. Cada slide bem ILUSTRATIVO do que diz.

  12. Manter BIBLIOTECA de ilustrações limpas e REUTILIZAR. Temas recorrentes (carga→caminhão, chip de IA, cadeado/escudo, check+dinheiro, preço/tag, caminhão+rota, celular/chat) ficam em branding/photos/ (ill-*, c2*-*). Carrossel novo reaproveita a lib e só gera o que falta — economiza muito. Sempre gerar SEM texto em fundo preto puro (ver #10).

Workflow local de revisão: servir com no-cache (python3 branding/_serve.py na porta 8912) pra não ver versão antiga em cache ao iterar; senão, hard-refresh Ctrl+Shift+R.

Checklist antes de entregar qualquer peça

  1. Logo correto para o fundo (claro/dark)? Clear space respeitado?
  2. Só cores da paleta? Verde como acento, não como base?
  3. Poppins em títulos, Inter em corpo?
  4. 1 ideia clara, com respiro? CTA + WhatsApp/site presentes?
  5. Tom parceiro+inovador, sem jargão?