Construtor de Identidade de Marca

Transforma um breve resumo de produto em um sistema de marca de uma página (nome, cores, tipografia, slogan, tom de voz), salvo como brand-system.md, pronto para colar no conhecimento do projeto Lovable.

O que é Construtor de Identidade de Marca?

Este skill gera um sistema de marca completo e coeso a partir de um brief mínimo de produto, ideal para desenvolvedores e usuários da plataforma Lovable que desejam evitar designs genéricos. Ele orienta o usuário por um processo estruturado de perguntas e decisões para definir nome, paleta de cores com funções específicas, par tipográfico do Google Fonts, slogan em duas frases e quatro princípios de tom de voz baseados em contrastes. O resultado é salvo em um arquivo `brand-system.md` de uma página, formatado para ser colado diretamente no conhecimento do projeto Lovable, garantindo que todas as builds subsequentes sigam a identidade visual e verbal estabelecida. Além disso, o skill impõe guardrails importantes como decidir sem hesitação, verificar contraste WCAG AA e focar apenas no que é essencial para a versão 1 do produto.

Funciona com~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/lexthirteen-ai/claude-loves-lovable-skills/tree/main/sessions/01-brand/finished/brand-identity-builder

Installed? Explore more Programação e Desenvolvimento skills: steipete/bluebubbles, steipete/eightctl, steipete/blucli · View all 6 →

Perguntar na sua IA favorita

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

Documentação

O que Construtor de Identidade de Marca faz?

A Lovable constrói o que você descreve, e a maioria das pessoas ainda não decidiu como seu produto se parece, soa ou representa. Por isso, todo mundo acaba com o mesmo gradiente genérico. Este skill toma as decisões de marca que uma v1 realmente precisa e as escreve em um formato que um construtor pode seguir.

Quando usar

  • Você está prestes a iniciar uma build e ainda não escolheu cores, fontes ou tom de voz.
  • Suas builds no Lovable continuam saindo genéricas.
  • Você tem um nome, mas não uma razão por trás dele, ou não tem nome nenhum.
  • Você precisa de um documento de marca que uma ferramenta, um colega de equipe ou um contratante possa seguir sem você na sala.

Entradas

Um breve resumo é suficiente: o que o produto faz, para quem é e qualquer coisa já decidida (um nome, uma cor que você ama, um concorrente que você não quer parecer). Se o usuário já tiver um nome, mantenha-o e escreva a justificativa. Não renomeie um produto que ninguém pediu para renomear.

Processo

Faça uma pergunta por vez ao usuário, e apenas sobre o que o resumo já não responder.

  1. Leia o contexto. Responda a estas quatro perguntas por conta própria a partir do resumo antes de escolher qualquer coisa. Pergunte ao usuário apenas sobre aquelas que o resumo deixa em aberto.

    • O que ele realmente faz, em uma frase operacional? ("Agenda e roteiriza visitas para tosadores de cães autônomos", não "empoderando o cuidado pet").
    • Quem precisa confiar nele? Nomeie a relação de confiança primária e uma secundária.
    • Qual é a tensão no trabalho? Marcas fortes se posicionam onde duas coisas que não deveriam andar juntas se encontram (logística e calma, dados e aconchego). O nome e o slogan vivem nessa tensão.
    • Qual é o menor lugar onde ele precisa funcionar? Um favicon, um ícone de aplicativo, um cabeçalho de mensagem de texto. Projete para esse tamanho.
  2. Nome (apenas se necessário). Liste dez palavras para o lado operacional e dez para o lado relacional, depois combine uma de cada. Ofereça duas ou três opções, cada uma com uma justificativa de uma linha. Teste cada uma: dá para falar em uma respiração, funciona como URL, um estranho entenderia pelo menos metade?

  3. Cor: cinco cores, cada uma com uma função.

    • Primária para CTAs e os momentos principais da marca, alta energia.
    • Escura para profundidade e contraste. Mais quente que o preto puro.
    • Clara para superfícies e texto sobre fundo escuro.
    • Secundária como um contrapeso que faz a primária parecer menos intensa.
    • Destaque para números, realces e ênfase.

    Nomeie cada cor pelo que ela significa para a marca, não por seu matiz ("Rota Noturna", não "Azul Marinho Escuro"). Verifique o contraste: o texto do corpo deve passar WCAG AA (4,5:1) em qualquer fundo ao qual for atribuído.

  4. Tipografia: duas fontes. Uma fonte de exibição forte o suficiente para carregar um título ou um número. Uma fonte de corpo que desaparece em tamanhos pequenos. Escolha do Google Fonts para que qualquer construtor possa carregá-las. Elas devem contrastar em peso, não brigar em estilo: uma fonte de exibição pesada e com personalidade combinada com uma fonte de corpo silenciosa e legível.

  5. Slogan: duas frases curtas. A primeira é a ação operacional, a segunda é a promessa relacional. Sem conjunção, porque a justaposição é o significado. Quatro a oito palavras no total. ("Agende a van. Mantenha a calma.")

  6. Tom de voz: exatamente quatro princípios. Cada um é um par de contraste, "X, não Y", mais uma frase de exemplo e a versão genérica que substitui. As frases de exemplo devem descrever apenas coisas que o produto realmente faz na v1, porque construtores e skills posteriores as reutilizam como copy. Adjetivos de personalidade ("amigável, profissional") não são princípios, pois toda marca os reivindica.

  7. Escreva as regras de construção. Transforme as decisões em instruções que um construtor segue: qual cor vai em qual token de tema, carregamento de fontes, regras de botões e títulos, e uma pequena lista de "não fazer". Esta seção é o que torna o documento útil para a Lovable e não apenas bonito.

  8. Salve-o. Escreva brand-system.md usando references/brand-system-template.md. Mantenha-o em uma página.

Saída

  • brand-system.md: uma página cobrindo a frase do produto, público, justificativa do nome, slogan, uma tabela de paleta com regras de uso, o par tipográfico, quatro princípios de tom de voz e regras de construção para a Lovable.
  • Uma breve nota sobre como usar: cole o arquivo inteiro no conhecimento do projeto Lovable (configurações do projeto) e, em seguida, inicie o primeiro prompt de build com "Siga o sistema de marca no conhecimento do projeto."
  • Opcional: se o usuário pedir, uma prévia HTML de uma página com amostras de cores e espécimes tipográficos.

Diretrizes

  • Decida, não faça pesquisa. Recomende uma paleta e um par de fontes, e explique o porquê. Ofereça alternativas apenas para o nome.
  • Sem nomes de cor de IA. "Sálvia", "Ardosia" e "Taupe Quente" dizem como uma cor parece, não o que ela significa.
  • Sem declarações de missão disfarçadas de slogan. "Construindo comunidades melhores juntos" é uma missão que desistiu.
  • Apenas v1. Design de logotipo, estilo de ilustração e direção de fotografia podem esperar. Diga isso se o usuário se desviar para lá e anote sob "Depois" no documento.
  • Contraste não é opcional. Se uma combinação falhar no AA, mude-a antes de salvar.

Relacionados

O próximo skill lê brand-system.md: pitch-narrative-architect usa os princípios de tom de voz, e founder-site-copywriter usa tudo.

Individual skills in this repo

This repo contains 1 individual skill — each has its own dedicated page.

Habilidades Relacionadas