Presque tous les designers pensent à la conception d'applications de nos jours. L'une des plus petites fonctionnalités de chaque application est l'icône utilisée pour la représenter à l'écran de chaque appareil mobile et dans les magasins d'applications. Concevoir une grande icône est plus que simplement mettre un logo dans une boîte. Vous avez besoin de quelque chose qui se démarque parmi toutes les autres icônes d'applications.
Une bonne icône peut être utilisée de différentes manières - pour les applications, les médias sociaux et même sur de plus petits projets imprimés ou des cartes de visite. Et tout ce qu'il faut, c'est un peu de design et de planification.
1. Rendez-le facile à lire
Une icône doit être facile à lire. (Et nous ne parlons pas de texte.) La lisibilité visuelle est la clé.
L'icône doit inclure un visuel hautement reconnaissable en raison de son image de marque ou de sa lisibilité. Pensez aux icônes sur le bureau de votre ordinateur par exemple. Vous savez où se trouvent les objets en raison de la nature simple des icônes: les documents sont stockés dans des dossiers, la musique est lue à partir d'un bouton sous la forme d'une note de musique et les images sont stockées à un emplacement ressemblant à une photo Polaroid.
Pour ce qui est de la lisibilité visuelle, la marque est une partie importante de la considération. Les grandes marques domestiques ont souvent des icônes qui font partie de leur logo ou une image iconique. Les gens ont tendance à reconnaître ces éléments immédiatement, même aux petites tailles. Cela peut être un peu plus difficile pour les marques nouvelles ou plus petites ou les concepts d'icônes, et les concepteurs peuvent opter pour d'autres techniques pour un impact optimal.
2. Pensez icône, pas image
Une icône n'est pas une photo dans une boîte. Une icône peut inclure une image, mais peut également être une représentation textuelle, un logo ou une combinaison de ces éléments.
Il doit simplement être très visuel et reconnaissable. La plupart des logos n'incluent pas de photographies mais constituent une représentation plus graphique d'une idée. (Ce concept est souligné par la nécessité de créer une icône à base de vecteur.)
Une image peut également devenir difficile à lire en petites tailles et se perdre dans une mer d’autres icônes sur le téléphone ou le périphérique de l’utilisateur. Une représentation plus graphique peut souvent avoir plus de poids visuel.
L'icône d'application mobile pour le grand magasin Macy's ci-dessus en est un bon exemple. La grande étoile blanche au centre d'une boîte rouge est facile à identifier. L'icône varie du traitement standard de l'icône de signature de la société en ce que la couleur est inversée pour mettre en évidence l'icône. Un fond rouge sera probablement plus visible qu'un fond blanc sur une variété de fonds d'écran d'utilisateurs.
3. Évitez les mots
Une chose que vous ne verrez pas dans les icônes est l'utilisation de mots. Il n’ya tout simplement pas assez de place pour une icône remplie de choses à lire et à comprendre.
En règle générale, évitez tout texte sauf s'il fait partie de votre logo. Même le texte faisant partie d'un logo doit être soigneusement pris en compte avant son utilisation dans la conception du logo principal.
L'icône doit être conçue de manière à créer une identité sans mots. En outre, rappelez-vous combien d'icônes sont réellement utilisées dans le contexte des périphériques sur lesquels elles apparaissent. La plupart incluent une ligne de texte descripteur sous le bloc d'icônes actuel.
L'icône Design Shack, par exemple, est une icône qui utilise une seule lettre? D? avec des traitements de couleur et de type compatibles avec le site. Cette lettre unifiée et facile à lire lettre créent un lien visuel et une connexion, sans mots.
4. Utilisez des couleurs vives
Voulez-vous que votre icône se démarque? Allez gras avec la couleur. Un choix de couleurs éclatantes vous aidera à vous démarquer sur divers arrière-plans et attirera l'attention des utilisateurs.
La dernière chose que vous voulez dans une conception d’icône est qu’elle s’intègre à toutes les autres options disponibles. Cela fait du bleu - en particulier des teintes bleu ciel et marine - une couleur que vous voudrez probablement éviter car tant d’autres icônes l’utilisent.
Si le bleu est votre logo principal ou la couleur de votre marque, essayez de l'associer à quelque chose de plus brillant pour un impact. Considérez un? Nouveau neutre? comme le vert lime, ou optez pour une teinte saisonnière comme un orange vif à l’automne ou un rose vif au printemps.
5. Développer un symbole ou un logo simple
Vous avez probablement un logo pour votre marque, mais lorsqu'il s'agit d'icônes, un symbole est également important. Un symbole peut être une simple représentation graphique ou un extrait de logo ou d’image.
Il faut juste que ce soit net et mémorable. De plus en plus de marques intègrent des symboles emblématiques dans leurs logos et marques standard afin de créer une connexion complète entre des icônes plus petites et des projets de design plus importants.
Pensez à la messagerie et à l'application de partage de photos Snapchat. Le symbole fantôme est devenu si reconnaissable qu’il peut apparaître comme l’icône habituelle, sous d’autres schémas de couleurs et formes, et même sous forme d’image autonome sur un panneau publicitaire. C'est un excellent exemple d'un symbole qui fonctionne.
6. Rappelez-vous l'échelle
Alors que la plupart d’entre nous considérons les icônes comme de minuscules choses sur nos téléphones ou nos ordinateurs de bureau, une icône n’est pas toujours petite. Il doit être conçu de manière à pouvoir être utilisé indépendamment de la taille.
Ceci est particulièrement important en raison de l’évolution constante du paysage numérique, de l’émergence d’un plus grand nombre d’affichages de la rétine et du fait que différentes plates-formes et appareils peuvent afficher des icônes de différentes tailles.
Construit grand et ensuite réduire.
7. Créer en format vectoriel
En ce qui concerne l’échelle et la taille, le format est également une considération importante. Une icône doit être créée à l'aide d'un dessin vectoriel.
Avoir une image vectorielle vous donnera la liberté de modifier et d'enregistrer l'icône pour une variété d'appareils, de tailles et de fenêtres sans créer beaucoup d'images individuelles. En réalité, vous aurez besoin de plusieurs versions d'une icône dimensionnée pour une variété de projets.
L'avantage du vecteur est la flexibilité. Mais il ya un hic. Pour de nombreuses applications ou plates-formes, vous devrez probablement enregistrer une copie dans un format non vectoriel à des fins de téléchargement.
8. sortir des sentiers battus
Ces derniers mois, de nombreuses icônes utilisent des arrière-plans monochromes avec une icône blanche, des techniques de design plat et de longues ombres. Bien que ces tendances puissent être très amusantes, ne restez pas coincées dans le carré du design. Faites quelque chose de différent avec votre icône.
Si tout le monde travaille avec des bords carrés, considérez quelque chose de plus arrondi. Ajoutez un soupçon de texture à l’arrière-plan pour vous démarquer de toutes les couleurs plates. Ne vous sentez pas obligé de modeler votre icône sur ce que font les autres.
9. Faites-le monochrome
Il y a un petit truc amusant que les concepteurs utilisent depuis des années pour tester l'efficacité des conceptions à petite échelle - la rendre monochrome. Si votre conception communique le même message avec ou sans couleur, cela fonctionne probablement. Si l'icône a besoin de couleur pour être lue, continuez à travailler sur les révisions.
Personnellement, je lance presque tous les projets de conception en noir et blanc, puis plus tard, je commence à ajouter de la couleur. C'est le croquis sur un concept informatique. Si vous l'esquissez sur du papier et que cela fonctionne avant que vous ne commenciez vraiment à ajouter de la couleur, l'idée a probablement un cadre solide.
10. Think Square
Votre icône et toutes les pièces à l'intérieur du cadre carré doivent également être parfaitement ajustées. Cela ne signifie pas que le dessin ou l'image doit être exactement de forme carrée, mais le rapport d'aspect de base de chaque icône a la même hauteur et la même largeur.
Donc, si vous avez un symbole super vertical ou horizontal, vous aurez besoin d’un moyen de remplir l’espace autour de lui pour qu’il ne se perde pas en arrière-plan. Optez pour un concept qui occupe une partie importante d'un espace essentiellement carré. (Même une icône circulaire arrondie a une hauteur et une largeur égales.)
Conclusion
Cela peut sembler cliché?, Mais la clé d'une bonne conception d'icônes est-elle? bien? iconique. C'est aussi simple que ça.
Concevez avec simplicité, couleurs et reconnaissance visuelle. Pensez aux interfaces et aux tendances actuelles pour que votre conception soit conforme aux normes. (De nos jours, vous ne concevriez pas d'icône skeuomorphic pour une application mobile iOS.) Et amusez-vous; une icône est la porte d'un utilisateur vers votre interface numérique.
Sources d'images: Ash Kid, Casey Fleser, Roland Tangalo, Gustavo da Cunha Pimenta et Microsiervos Geek Crew.