7 dicas para o uso eficaz de ícones em projetos de design
Criar ícones pode ser muito divertido. Mas uma vez que você tenha um bom conjunto, o que você faz com eles?
Os ícones não são apenas links em miniatura para o Facebook ou Instagram - eles podem ser dicas totalmente interativas que ajudam a direcionar os usuários através de um design e proporcionam brilho visual extra. Os ícones podem ser pequenos ou grandes, preto e branco ou coloridos, planos ou intrincados. Não importa qual estilo lhe agrade, o uso eficaz de ícones pode melhorar a usabilidade e o valor estético de quase qualquer projeto de design.
Explore o Envato Elements
1. Adicione interesse visual
Nem toda imagem será uma paisagem de tirar o fôlego. Às vezes, as imagens ficam aquém.
A iconografia divertida pode ajudar a adicionar mais interesse a essas fotos um tanto desinteressantes. Use ícones para aprimorar o conteúdo da foto, fornecer um pouco mais de informação e uma sugestão de interação.
Pegue o exemplo acima para uma clínica odontológica (reconhecidamente, não o conceito visual mais interessante.) O design é novo, brilhante e convidativo. O ícone simples ao lado do rosto é uma nova visão da "idéia da lâmpada" - observe os dentes minúsculos. O equilíbrio entre a parte clara da tela à esquerda e o ícone branco brilhante também ajuda a atrair a atenção do design. O restante do site também usa outros pequenos ícones para navegação.
2. Criar interação
Os ícones não precisam se encaixar em canais específicos para incentivar a interação do usuário. (Muitos modelos usam a combinação de três colunas ícone / texto na rolagem.
Os ícones podem realmente ser o elemento que impulsiona a interatividade. Emparelhe iconografia e rolagem de paralaxe para que os itens se movam pela tela. Camada de ícones com imagens ou outro plano de fundo para criar um elemento um pouco inesperado.
O Boone Selections cria uma cena de viagem para seus vinhos usando a iconografia de uma maneira que faz você querer rolar. O ícone do avião viaja em um avião seguindo as setas na tela (que reagem à rolagem). Cada ícone de arte de linha é renderizado como um desenho à medida que o usuário rola para a parte da tela. Os movimentos são simples, clássicos e altamente eficazes.
3. Use Animação
Ninguém nunca disse que os ícones precisam ser elementos estáticos. Anime-os!
Mas não fique muito louco. As melhores animações de ícones estão relacionadas ao conteúdo do próprio ícone. Os movimentos não devem ser muito rápidos, porque podem ser um pouco irritantes. Os movimentos não devem ser muito lentos, porque os usuários podem sentir falta deles. Há um ponto ideal no meio, onde o movimento dos ícones oferece um pouco de prazer.
Sweet Punk faz isso de forma brilhante. O ícone é a "mesma lâmpada antiga" usada em qualquer lugar, mas com um carimbo de personalização. Observe o interior da lâmpada - é uma chama. Depois, há uma ação divertida de pairar enquanto a lâmpada salta com um redemoinho de ideias. Além disso, o padrão de círculo em torno da lâmpada se move suavemente e parece responder aos padrões do mouse.
4. Criar Clusters de Ícones
Aglomerados de formas interessantes, esboços ou ícones artesanais podem criar um visual interessante. O conceito é exibido normalmente em sites que distribuem pacotes de ícones (como o descrito acima), mas tem uma aplicação mais ampla.
Considere linhas de ícones - brinque com o uso de tamanho menor ou maior para obter mais impacto - quando estiver faltando um bom visual. Os ícones podem funcionar como links ou apenas imagens independentes. Os clusters podem incluir apenas dois ou três ícones ou três vezes mais. Deixe seu conteúdo conduzir esse processo de tomada de decisão.
O legal de usar ícones em cluster é que você pode realmente pensar fora da caixa e fazer algo criativo. O outro bônus? Você pode até começar com um pacote de ícones se desejar e personalizar ícones para torná-los seus. Qualquer uma das opções pode ser muito divertida e oferecer uma maneira de experimentar algo totalmente diferente.
5. Combine com elementos da moda
Os ícones devem ser apenas uma parte da estratégia de design de um projeto. Pense no seu conteúdo e emparelhe a iconografia com outro elemento da moda para criar uma estética moderna.
O bom de usar ícones é a flexibilidade de estilo. Aparentemente, os ícones aparecem em todas as formas, desde arte de linha, estilos baseados em esboços até designs de recortes planos para elaborar peças de arte em miniatura. Depois de definir um estilo de design para um projeto, crie um conjunto de ícones que correspondam ao tom visual.
O site da História dos ícones faz isso muito bem. O site mostra como os estilos de ícones evoluíram ao longo dos anos - o que é um estudo de caso interessante, se você procura mais inspiração - mas cada ícone é colocado dentro de um elemento de contêiner em um padrão de estilo de design de material, apresentando camadas bastante planas, táteis movimentos, tipografia limpa e cores vivas.
6. Coloque uma torção caprichosa nele
Para certos ícones, existem designs padrão que você deseja usar para que os usuários saibam exatamente o que esses elementos fazem. Isso pode incluir ícones para links de mídia social, pesquisa, carrinhos de compras e setas de navegação. Você nunca deve sacrificar a usabilidade por um novo design.
Mas você pode dar um toque peculiar a esses estilos de ícone padrão. Mude a cor, ajuste a forma ou redesenhe os ícones no seu estilo. O truque é fazer algo que pareça único, mantendo o reconhecimento visual, para que os usuários não questionem o significado do ícone.
Mudanças simples podem percorrer um longo caminho. Esse tipo de ajuste pode ajudar elementos comuns a se tornar parte de seu design e história visual também.
Little Puds & Co. faz isso de uma maneira absolutamente encantadora. Os ícones comuns no canto superior são identificáveis, mas assumem a cor da marca do site. Os ícones parecem um pouco mais suaves do que nas paletas de cores normais do Facebook e Instagram e parecem combinar com o estilo mais caprichoso e infantil usado em todo o design.
7. Crie esboços personalizados
Os ícones podem ser telas de arte em miniatura. Enquanto as tendências de iconografia se inclinam mais para renderizações de arte de linha super planas, os esboços detalhados podem fornecer uma ótima opção personalizada que é sua.
Cada conjunto desenhado a mão será diferente. Não há nenhuma maneira real de categorizá-los além de encontrar algo que você possa possuir. Ícones esboçados geralmente fazem parte da identidade da marca que os utiliza.
A Infinity Foods usa esse estilo maravilhosamente em todo o seu design. (Você realmente deve clicar ao redor para ver o conjunto completo de ícones.) O estilo de esboço começa com o logotipo e o mesmo estilo detalhado de lápis é usado para cada elemento de ícone no design.
Conclusão
Embora os ícones possam ser um dos elementos menos pensados em um projeto de design, eles podem ser um dos mais interessantes. Uma boa iconografia pode reunir um projeto de maneira a proporcionar um pouco de polimento e requinte.
O bom de trabalhar com ícones é que um bom conjunto baseado em vetor pode ser usado de várias maneiras e em tamanhos variados. Interessado em pegar milhares de ícones por uma pechincha? VIP criativo você tem coberto!