Ícones e logos não são a mesma coisa

Escrito por , 05/05/2011, Design de Interface

A iconografia está ai. Com a popularidade de dispositivos móveis inteligentes, aumentou o interesse pela interface gráfica e usabilidade. Os ícones são elementos muito importantes para a facilidade de interação de quem utiliza tal dispositivo móvel, seja qual for. Porém, uma situação inusitada me levou a escrever este artigo. Acredito que o que eu passei, alguns designers também já passaram ou irão passar.

Desenvolvendo uma interface para um App, digo ao cliente que irei apresentar o ícone do App junto com a entrega do job. É ai que entra a pérola: “Não precisa criar um ícone não. É só usar meu logo e pronto.”

Até eu explicar para ele que ícone não é a mesma coisa que logo, foram mais duas reuniões. Assim, juntei o que eu expliquei para ele, peguei o mais importante, e decidi criar este artigo, e assim tirar as dúvidas que muitos tem.

NOTA: neste artigo vou abordar o ícone dentro do conceito de design para aplicativos, interface e usabilidade.

Por que um ícone não é a mesma coisa que um logo?

Um ícone deve representar uma ação ou o que um aplicativo faz. Deve explicar, sem palavras, o que um App faz ou pretende fazer. Um Ícone tem suas limitações. Um ícone não pode ultrapassar limites. Ele foi feito para ficar “dentro de um quadrado”, por mais diferente que sua forma possa ter. O ícone pode ter várias formas, mas sempre terá um quadrado como borda, invisível ou não. Veja esses exemplos de ícones. Por mais que não sejam um quadrado propriamente dito, eles não ultrapassam o limite delimitado por um. (Em tempo, a própria Apple exige que os ícones de um App para iPhone e iPad sejam quadrados)

Sinto decepcionar, mas ícones e logos não são a mesma coisa

Estes ícones têm formas diferentes, mas respeitam limites específicos

Agora, leve em conta que ícones nem sempre são vistos em seu tamanho total. Alías, quase nunca. Na maioria das vezes são vistos em suas versões menores. Deste modo, respeitando seus limites eles não perdem suas visualizações. E mesmo menores são facilmente percebidos. Veja os mesmos exemplos, mas agora em versões menores.

Sinto decepcionar, mas ícones e logos não são a mesma coisa

Estes ícones vistos em suas versões, tais como mostradas no Windows Explorer ou Finder por exemplo

Agora, imagine um logo. Uma marca não tem limites como o ícone. Ele pode ter altura menor que a largura, e vice-e-versa. Pode ter títulos longos, e alguns até mesmo com slogan junto. Tente imaginar agora um logo como ícone. Com toda certeza perderá sua visualização.

“Não entendi ainda. Pode dar um exemplo?”

Essa foi a pergunta de meu cliente depois da explicação. Então, mostrei este exemplo, o Facebook. Veja como é a marca do Facebook:

 Sinto decepcionar, mas ícones e logos não são a mesma coisa

Consegue imaginar essa marca como um ícone? Iria ficar de todo mal, aplicando os conceitos corretos para um ícone bem feito. Assim, veja a solução do designer ao criar o ícone para o App do Facebook:

Sinto decepcionar, mas ícones e logos não são a mesma coisa

Não é necessário que a marca esteja dentro do ícone. Não é preciso muito esforço para perceber que este ícone pertence a um App do Facebook.

O que fazer então?

Faça um ícone parecer um ícone. Um ícone tem uma característica bem distinta. Ícones tem um design quase caricato. Dificilmente você verá um ícone que é uma foto, ou com cores chapadas. A plasticidade é uma evidência forte. Hoje, muitas marcas estão até mesmo explorando essa temática caricata e plástica que os ícones tem. Talvez seja por isso que essa confusão paira no ar. Mas ainda sim, não são e nem serão a mesma coisa.

Deste modo, o estudo de marca não é o mesmo que um estudo de ícone. Ao criar um ícone, pense no que o app faz, sua função, seu benefício, mas não pense na marca da empresa, pois a coisa não funciona assim.

 

Tassila M. Pinheiro

Anúncios

Deixe um comentário

Preencha os seus dados abaixo ou clique em um ícone para log in:

Logotipo do WordPress.com

Você está comentando utilizando sua conta WordPress.com. Sair / Alterar )

Imagem do Twitter

Você está comentando utilizando sua conta Twitter. Sair / Alterar )

Foto do Facebook

Você está comentando utilizando sua conta Facebook. Sair / Alterar )

Foto do Google+

Você está comentando utilizando sua conta Google+. Sair / Alterar )

Conectando a %s

%d blogueiros gostam disto: