# Branding generativo: identidades feitas por sistemas, não por imagens

[Canonical HTML page](https://gradiently.design/pt-br/guide/generative-branding)

Em vez de criar um logo e um fundo, você cria as regras que os produzem. O branding generativo transforma uma identidade numa receita que prepara uma versão nova a cada vez.

## The short version

- Branding generativo é uma abordagem em que designers definem regras, muitas vezes em código, e um sistema produz os visuais da marca a partir delas.
- O resultado muda a cada vez, mas as regras mantêm cada versão reconhecível como parte de uma só identidade.
- Visit Nordkyn, na Noruega, é um exemplo muito citado: seu logo muda de forma e de cor com dados meteorológicos em tempo real.
- Um sistema generativo precisa de restrições fixas, algumas variáveis controladas e uma fonte de variação, como uma semente, dados ou o formato sendo produzido.
- Branding generativo é diferente de geração de imagens por IA: as regras são escritas pela marca, então os resultados são previsíveis e reproduzíveis.

O **branding generativo** é uma identidade definida como um conjunto de regras, não como um conjunto de imagens prontas. Os designers decidem as restrições, as cores, formas, materiais e limites, e um sistema, muitas vezes um pequeno trecho de código, produz uma versão nova do logo ou do fundo cada vez que uma é necessária. Cada resultado é diferente, mas todos são claramente a mesma marca, porque vêm da mesma receita.

## Como funciona o branding generativo

Toda identidade generativa, do logo de uma escola de arte a uma marca movida pelo clima, tem as mesmas três partes. Quando você consegue nomeá-las, consegue criar uma.

| Parte | O que é | Exemplo |
| --- | --- | --- |
| Restrições | O que nunca muda | Uma família violeta sobre um fundo quase preto, uma tipografia |
| Variáveis | O que o sistema pode mudar, dentro de limites | Onde a luz cai, qual tom lidera |
| Fonte | O que provoca cada mudança | Um número semente, dados ao vivo, o formato, a data |

As restrições carregam o reconhecimento, as variáveis carregam o frescor e a fonte decide cada resultado.

A fonte importa mais do que parece. Uma **semente** dá variedade reproduzível: o mesmo número sempre gera o mesmo resultado, então um design pode ser recriado com exatidão. **Dados** ligam a identidade a algo real, como o clima ou a hora. O **formato** permite que o sistema recomponha para um story ou um banner em vez de cortar.

## Exemplos de identidades generativas

- **Visit Nordkyn, 2010:** a marca de turismo de uma região no norte da Noruega usa um logo com a forma dada pela direção do vento em tempo real e a cor dada pela temperatura, então ele reflete o clima naquele momento.
- **MIT Media Lab, 2011:** um algoritmo gerou um logo diferente para cada membro do laboratório a partir de uma grade comum de formas sobrepostas.
- **OCAD University, 2011:** uma moldura fixa em preto e branco é preenchida com obras dos próprios alunos da universidade, então a identidade se renova sozinha.
- **Google Doodles:** não gerados por código, mas um sistema de longa data com uma regra fixa, o nome continua legível, e variação sem fim em volta dele.

O que eles têm em comum é a contenção. Cada sistema varia uma ou duas coisas, e cada um mantém algo totalmente parado: uma moldura, uma grade, um nome ou uma forma. A variedade é o que as pessoas notam; a constante é o que elas lembram. Esses exemplos ficam perto da [identidade de marca dinâmica](https://gradiently.design/pt-br/guide/dynamic-brand-identity), que trata de identidades que mudam em geral. O branding generativo é o subconjunto em que as mudanças vêm de um sistema, e não de um designer fazendo cada uma à mão.

## Um fundo generativo em poucas linhas de código

Dá para ver a ideia num exemplo minúsculo. As restrições da marca são um fundo e uma família de três violetas. A variável é a posição da luz, mantida no lado direito do quadro para nunca ficar atrás de texto alinhado à esquerda. A fonte é uma semente.

```js
// A small seeded random generator: the same seed always gives the same numbers.
function mulberry32(seed) {
  return function () {
    seed = (seed + 0x6d2b79f5) | 0;
    let t = Math.imul(seed ^ (seed >>> 15), 1 | seed);
    t = (t + Math.imul(t ^ (t >>> 7), 61 | t)) ^ t;
    return ((t ^ (t >>> 14)) >>> 0) / 4294967296;
  };
}

// Constraints: these never change.
const brand = {
  ground: '#120d24',
  family: ['#4c1d95', '#7c3aed', '#c084fc'],
};

// Variables: light position and which tone leads, within limits.
function background(seed) {
  const rand = mulberry32(seed);
  const x = Math.round(60 + rand() * 30); // light stays on the right
  const y = Math.round(10 + rand() * 40);
  const lead = brand.family[1 + Math.floor(rand() * 2)];
  return `radial-gradient(circle at ${x}% ${y}%, ${lead} 0%, ${brand.family[0]} 40%, ${brand.ground} 80%)`;
}

document.body.style.background = background(2026);
```

Mude a semente e você tem um fundo novo; reutilize uma semente e você recebe o mesmo fundo de volta. Todo resultado fica dentro da família da marca.

- Semente A: lilás lidera, no alto: `radial-gradient(circle at 78% 18%, #c084fc 0%, #4c1d95 40%, #120d24 80%)`
- Semente B: violeta lidera, à direita: `radial-gradient(circle at 64% 44%, #7c3aed 0%, #4c1d95 40%, #120d24 80%)`
- Semente C: violeta lidera, bem à direita: `radial-gradient(circle at 88% 30%, #7c3aed 0%, #4c1d95 40%, #120d24 80%)`
- Semente D: lilás lidera, no topo: `radial-gradient(circle at 70% 12%, #c084fc 0%, #4c1d95 40%, #120d24 80%)`

Quatro resultados que o código acima poderia gerar. Variados, mas nenhum desconhecido os confundiria com quatro marcas diferentes.

## Como escrever as regras de uma marca generativa

1. **Parta de um visual pronto** Crie à mão uma versão que você adora. As regras descrevem o que a faz funcionar, então você precisa de um alvo primeiro.
2. **Separe o fixo do livre** Liste o que nunca pode mudar. Normalmente o fundo, a família de cores, o material e a tipografia.
3. **Escolha uma ou duas variáveis** Posição da luz, tom principal ou densidade do padrão. Cada variável a mais multiplica a chance de um resultado fora da marca.
4. **Proteja as palavras** Faça da legibilidade uma regra: a área mais agitada e mais clara nunca pode cair atrás do texto. [Texto sobre gradiente](https://gradiently.design/pt-br/guide/text-on-gradient) explica por quê.
5. **Revise os extremos** Gere muitos resultados e olhe os mais estranhos. Se algum parecer errado, estreite a faixa.

### Regras fracas

- Qualquer cor de uma faixa ampla
- Posição aleatória, inclusive atrás do texto
- Vários materiais misturados à vontade
- Ninguém confere os resultados

### Regras fortes

- Uma família fixa com um destaque opcional
- Luz mantida longe de onde ficam as palavras
- Um material, sempre presente
- Extremos revisados antes do lançamento

## Branding generativo não é geração de imagens por IA

Os dois costumam ser confundidos. Um modelo de imagem por IA produz figuras a partir de um prompt, e o mesmo prompt pode dar resultados bem diferentes. Uma identidade generativa roda regras que **você** escreveu, então sua faixa é conhecida e um resultado pode ser reproduzido a partir da semente. Você pode usar IA para ajudar a criar as regras ou escrever as palavras, mas a identidade vive na receita. Isso também facilita a passagem: um novo designer, uma agência ou um assistente segue regras escritas com muito mais confiabilidade do que imita um moodboard. [Originalidade no design com IA](https://gradiently.design/pt-br/guide/ai-design-originality) trata da questão mais ampla de onde vem o resultado da IA.

## Marks são receitas

Um Mark do Gradiently funciona com o mesmo princípio. Ele é uma receita de cores, até três materiais, luz, granulação, movimento e uma voz tipográfica, renderizada ao vivo em vez de guardada como imagem. Ele se compõe para cada tamanho em que você cria e lê onde estão as suas palavras para que sua área mais calma fique atrás delas. Todo Mark tem um código público como `GR·K7Q2·MX` e exatamente um dono por vez, então a receita por trás do seu visual pertence a você. [Materiais do Mark explicados](https://gradiently.design/pt-br/guide/mark-materials-explained) mostra o que entra num Mark.

Um post anunciando uma feira de fim de semana aos sábados sobre uma receita de degradê vivo com a área calma atrás das palavras

Uma receita renderizada para um post de feed. A mesma receita renderiza de outro jeito, e corretamente, para um story ou um banner.

## FAQ

### O que é branding generativo?

Uma identidade definida como regras, muitas vezes em código, que produzem visuais novos e fiéis à marca a cada vez, em vez de um logo ou fundo fixo.

### Qual é um exemplo de branding generativo?

O logo da Visit Nordkyn muda com dados de vento e temperatura em tempo real, e a identidade de 2011 do MIT Media Lab gerava um logo diferente para cada membro.

### Branding generativo é o mesmo que design gerado por IA?

Não. O branding generativo roda regras que a marca escreveu, então os resultados são previsíveis e reproduzíveis. Ferramentas de imagem por IA geram a partir de prompts com muito menos controle.

### Preciso programar para usar branding generativo?

Não necessariamente. Ferramentas que renderizam um visual como receita em todos os tamanhos dão o benefício principal sem você escrever código.