Textura de marca: a qualidade material que torna um visual só seu

Textura de marca é a qualidade material de tudo o que uma marca coloca numa superfície: a granulação de um fundo, a textura de um papel, o brilho do vidro, a direção e a suavidade da luz. É a diferença entre uma cor numa tela e uma cor sobre alguma coisa. Duas marcas podem ter a mesma paleta e a mesma fonte, mas se uma estiver sobre granulação fina de filme e a outra sobre vidro limpo, ninguém vai confundi-las.

A textura também é uma das poucas partes de um visual que resistem à cópia. Qualquer pessoa consegue ler os seus códigos hex num print. Reproduzir a sua granulação exata, o tamanho, a densidade, o jeito como a luz cai sobre ela, é muito mais difícil, o que a torna uma forte candidata a assinatura da sua identidade visual.

O que a textura faz por uma marca

A textura carrega associações que as pessoas captam na hora, muito antes de lerem uma palavra. Ela responde a perguntas como: isto é artesanal ou industrial, quente ou frio, do dia a dia ou especial?

Nenhuma é melhor que a outra. O que importa é que a textura concorde com o que você diz sobre si. Uma marca que fala de artesanato sem pressa e posta sobre vidro brilhante manda uma mensagem confusa. Personalidade de marca é um bom ponto de partida se você não tem certeza do que a sua deve dizer.

Granulação, material e luz: as três camadas

A maioria das texturas que parecem ricas é construída em três camadas. Pensar nelas separadamente transforma a textura em algo que você projeta de propósito, e não num filtro aplicado no final.

1. 1

   Material

   O comportamento básico da superfície: como a cor flui por ela. Misturas suaves, dobras macias, formas líquidas ou facetas nítidas.

2. 2

   Luz

   De onde ela vem e quão forte é. Uma luz suave vinda de um canto dá profundidade; uma iluminação uniforme parece chapada e digital.

3. 3

   Granulação

   O ruído fino por cima. Um pouco faz a superfície parecer real e esconde o banding; demais parece sujo e briga com as palavras.

Para a camada de granulação na web, um pequeno ruído em SVG sobre o fundo basta. Mantenha a opacidade baixa; a ideia é sentir mais do que ver.

.brand-surface {
  position: relative;
  background: radial-gradient(circle at 80% 15%, #a5b4fc 0%, #4338ca 30%, #1e1b4b 70%);
}

.brand-surface::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.12;
  mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

Degradês granulados traz mais receitas de granulação, e banding em degradês explica por que o ruído também é a solução padrão para faixas visíveis em misturas suaves.

Como escolher a textura da sua marca

• Comece por uma palavra. Escreva a única sensação que você quer que as pessoas tenham, como “artesanal” ou “preciso”, e escolha a família que combina com ela.
• Teste atrás das palavras. A textura vive embaixo de títulos, preços e datas. Se ela dificulta a leitura no tamanho de um celular, está forte demais.
• Confira nos dois extremos. Veja num story de 1080×1920 e num cartão de visita de 1050×600. Uma granulação que fica certa em tamanho grande pode virar borrão em tamanho pequeno.
• Confira no impresso. Uma granulação que brilha na tela pode parecer defeito de impressão no papel. Imprima um flyer A5 antes de se comprometer.

Erros que deixam a textura com cara de barata

O último ponto pega muitas marcas de surpresa. Quando uma imagem texturizada é esticada de um post quadrado para um banner largo, a granulação estica junto e a luz cai num lugar estranho. Uma textura deve ser renderizada no tamanho em que é usada, o que também está em textura de fundo.

Tornando uma textura sua

Uma sobreposição de ruído gratuita está disponível para todo mundo, e é justamente esse o problema: quanto mais popular uma textura fica, menos ela diz sobre você. Para que uma textura seja só sua, ela precisa ser uma combinação específica que ninguém mais está usando.

É para isso que existe um Mark do Gradiently. Cada Mark é uma receita de cores, até três materiais sobrepostos, luz, granulação e movimento, e cada um é comparado com todos os outros para que nenhum seja parecido com outro. Ele é renderizado ao vivo em cada tamanho em que você cria, então a granulação e a luz sempre ficam certas, e suaviza os detalhes atrás das suas palavras para que os títulos continuem legíveis. Quando você reserva um Mark, só você pode exportar com ele. Materiais dos degradês explica as camadas de material em mais detalhes.