A marca em tamanho pequeno
Tudo nesta página foi medido no arquivo da marca, reduzindo ela de verdade para o tamanho que cada aplicação tem no mundo real. Nenhuma frase aqui é opinião sobre o desenho.
O desenho não é o problema. O problema é que existe uma versão dele, e ela foi feita para o tamanho grande. Abaixo de 340 px de largura a marca começa a perder partes, e no favicon do site não sobra nada.
O que a marca tem dentro
Quatro elementos empilhados, e cada um tem uma espessura de traço diferente. Quando a marca reduz, todos encolhem juntos, mas o mais fino morre primeiro.
A marca nos tamanhos em que ela é usada de verdade
Cada quadro abaixo é a marca reduzida ao tamanho real daquela aplicação, com a mesma reamostragem que o navegador e o Instagram usam. Ao lado, a mesma imagem ampliada pixel a pixel, para dar para ver o que sobrou.
Como ler os números: um traço abaixo de 1 px não existe: ele não tem onde ser desenhado, e vira cinza. Uma letra abaixo de 6 px de altura não se lê. E “virou cinza” é a porcentagem da marca que não é nem tinta nem papel: é o borrão.
- traço do “coemp”
- 0,35 px
- letra da assinatura
- 0,5 px
- letra do slogan
- 0,3 px
- virou cinza
- 60%
- traço do “coemp”
- 0,71 px
- letra da assinatura
- 1,0 px
- letra do slogan
- 0,5 px
- virou cinza
- 34%
- traço do “coemp”
- 1,06 px
- letra da assinatura
- 1,5 px
- letra do slogan
- 0,8 px
- virou cinza
- 34%
- traço do “coemp”
- 2,43 px
- letra da assinatura
- 3,5 px
- letra do slogan
- 1,8 px
- virou cinza
- 26%
- traço do “coemp”
- 3,98 px
- letra da assinatura
- 5,7 px
- letra do slogan
- 2,9 px
- virou cinza
- 20%
- traço do “coemp”
- 4,86 px
- letra da assinatura
- 7,0 px
- letra do slogan
- 3,6 px
- virou cinza
- 17%
O mesmo, no lugar onde acontece
Não é um exercício de laboratório. São os três lugares por onde mais gente vê uma marca de empresa hoje.
COEMP · Contabilidade Emp…Contabilidade Empresarial
A partir de que tamanho cada parte funciona
Esta é a medida que resolve a discussão. Para cada elemento, a largura mínima que a marca inteira precisa ter para aquela parte ainda ser legível.
O slogan precisa da marca com 679 px de largura para ser lido. O logo no cabeçalho de um site tem tipicamente 220 px, e um cartão de visita impresso, 320 px. Ou seja: em nenhuma aplicação normal esse slogan é legível. Ele está no arquivo, mas não chega a ninguém.
“Então usa só o ícone” não resolve. E o motivo é geométrico.
Essa é a saída que todo mundo propõe primeiro, e neste caso ela não funciona. A montanha sozinha mede 931×383 px, ou seja 2,43:1, ainda mais deitada que a marca completa, que é 1,82:1. Num quadrado ou num círculo, ela sobra pelos lados e deixa metade do espaço vazio.
E tem uma razão exata por trás disso: as encostas desta montanha correm a 45° (medi 44,2°, 45,4°, 47,8° e 51,5° no arquivo). Um triângulo de 45° é sempre duas vezes mais largo do que alto. Não é estilo, é trigonometria: enquanto o ângulo for 45°, nenhuma montanha desenhada assim caberá num quadrado. Recortar só o pico principal também não salva: sobra 1,63:1, e sem os picos laterais vira um triângulo qualquer, que não é mais a marca da COEMP.
| Em 32 px | A marca hoje | A montanha sangrando |
|---|---|---|
| Espessura do traço | 0,71 px | 8,0 px |
| Quanto virou cinza | 34% | 5% |
| Quanto da caixa a marca ocupa | 56% da altura | 100% |
O que isso quer dizer, na prática
- A marca atual está certa para o tamanho grande. Fachada, cartaz, capa de proposta, cabeçalho de documento: nesses lugares ela funciona e não precisa mudar.
- Falta a versão média. Uma sem o slogan, que só é legível a partir de 679 px e por isso nunca aparece. Site, assinatura de e-mail e cartão pedem essa versão.
- Falta a versão pequena. Um símbolo que feche num quadrado e num círculo, para favicon, WhatsApp, Instagram e ícone de aplicativo. Como mostramos acima, ela não sai de um recorte: precisa ser desenhada para esse tamanho, preservando o ângulo de 45°, o dente da encosta e a onda.
Nenhuma dessas três versões descarta o desenho do logo. As três são o mesmo desenho, ajustado para o tamanho em que vai ser visto, que é exatamente o que um sistema de marca é. Hoje a COEMP tem uma versão; com as três, a marca passa a funcionar em todo lugar onde a empresa aparece.