Accentsconagua
Share
Cela fait longtemps que je n'ai pas fait ce genre d'article, mais aujourd'hui, je suis de retour et je pense vraiment que vous allez l'aimer. Nous allons suspendre notre créativité et passer du temps de qualité ensemble à explorer l'histoire et l'évolution de ces petites bestioles que nous aimons appeler «icônes»..
Donc, si vous aimez autant que moi le design des icônes (coup de poing numérique tout en souriant comme un fou), arrêtez-vous rapidement à la machine à expresso la plus proche et prenez une tasse de cette liqueur de haricots magique, puis sautez doucement dessus. de nouveau dans la chaise et que le voyage commence.
Eh bien, je suppose que beaucoup d’entre vous connaissent déjà la réponse, mais si le cours de sciences sociales «Méthodes et techniques de recherche» m’a enseigné quelque chose, c’est que pour chaque étude (ce qui est clairement cet article), vous devriez toujours partir du début. niveau de base de votre concept, puis augmentez progressivement votre chemin en utilisant plusieurs couches d’informations.
Ainsi, "icône" est un nom d'origine grecque (eikόn), et est défini dans le dictionnaire en ligne Merriam Webster comme «une image religieuse conventionnelle typiquement peinte sur un petit panneau en bois et utilisée dans la dévotion des chrétiens d’Est».
Maintenant, je pense que nous pouvons tous lever les sourcils et convenir que ce n’est pas exactement le type «d’icône» qui nous intéresse, car nous ne sommes pas réellement en train de peindre des images louant la divinité sur du bois (ou Je suppose que la plupart d’entre nous ne le sommes pas), alors essayons d’aborder le terme dans une perspective technologique plus moderne.
Du point de vue numérique, une “icône” est un “symbole graphique sur un écran d’affichage d’ordinateur qui représente un objet (tel qu'un fichier) ou une fonction (telle que la commande ou la suppression)”.
Vous trouverez une explication encore plus pertinente dans la version en ligne du dictionnaire Cambridge, qui la définit comme «une petite image ou un symbole sur un écran d'ordinateur sur lequel vous pointez et cliquez sur (= pressez) avec une souris pour donner à l'ordinateur une instruction."
Avant de poursuivre, je voudrais souligner que, bien que les icônes aient été initialement créées dans l'intention d'être utilisées dans des interfaces graphiques d'ordinateur (de bureau), elles ont rapidement fait la preuve de leur utilité en se dirigeant vers d'autres périphériques compatibles avec l'écran. les ont adoptés en raison de leur facilité d'utilisation.
Le premier ensemble d'icônes informatiques est né en 1981, lorsque les informaticiens David Canfield Smith et le concepteur Norman Lloyd Cox ont uni leurs forces afin d'amener la «métaphore du bureau» sur le Xerox Star 8010, le premier ordinateur de bureau de son époque..
Xerox Star 8010 - image fournie par DigiBarn L’idée était de faire concevoir par Norman un ensemble d’articles de bureau, tels que des documents, des dossiers, des classeurs, etc., qui devaient définir le premier style d’icône (pixel art) sur lequel tous les autres seraient basés..
La raison pour laquelle les icônes ont été créées est que les ordinateurs ont atteint un stade où ils avaient besoin d’un symbole visuel capable de faciliter l’interaction entre l’interface de leur logiciel (l’interface utilisateur graphique ou graphique) et les besoins de l’utilisateur..
Cela signifie que d'un point de vue symbolique, il a à la fois une une fonction et un sens, car il doit correctement et correctement transmettre le objet ou action qu'il était destiné à décrire, en utilisant des indices visuels qui se veulent explicites..
Vous pouvez en apprendre davantage sur le processus de recherche impliqué dans la création de ces types de métaphores visuelles en lisant mon article sur les 10 meilleurs conseils pour la création d'icônes géniales, qui répondra à la plupart, sinon à toutes vos questions..
Étant donné que l'article se concentre sur la présentation et l'explication de l'évolution des icônes d'un point de vue visuel, il est naturel que nous prenions quelques instants pour voir ce qu'est exactement le «style», car souvent le terme est mal compris..
Si nous revenons au dictionnaire Merriam Webster, nous verrons le nom défini comme “une manière ou technique particulière par laquelle quelque chose est fait, créé ou exécuté”.
Une définition me tenait vraiment à l’esprit, car elle décrit le terme comme «une apparence distinctive, généralement déterminée par les principes selon lesquels quelque chose est conçu».
Rassemblez les deux, et nous réalisons rapidement que le style est fondamentalement une forme d’expression (visuelle ou d’une autre nature) basée sur une relation complexe entre des méthodes et des principes choisis avec soin et développés par un créateur (l’artiste), afin de: mettre sa vision en forme.
Maintenant, par exemple, le style d'un acteur peut facilement être réduit à la façon dont il parle, marche et regarde. Les chanteurs peuvent se distinguer en adoptant des vêtements spécifiques et une voix plus douce ou plus profonde.
Les concepteurs, d’autre part, s’efforcent d’atteindre un sens du style en insérant différentes caractéristiques visuelles sur la base de méthodes et de techniques développées au cours d’un long processus d’exploration et de raffinement, les rendant ainsi propres.
Maintenant, c’est là que cela devient un peu délicat, car dans la conception, on style personnel peut être rapidement pris, imité et réitéré, le transformant en un style collectif, où différents concepteurs suivent des techniques de composition similaires, voire identiques.
Cela étant dit, aucun style individuel n'est complètement pur, car tout ce qui est créé est essentiellement une itération visuelle et / ou une évolution basée sur les travaux antérieurs de quelqu'un d'autre..
À ce stade, nous avons réussi à comprendre ce qu'est le «style», mais prenons quelques instants pour voir quels facteurs peuvent influer sur son développement et son évolution..
Comme nous le savons tous, pour chaque forme d'art, il existe un ensemble d'outils et de médiums qui finissent par influencer sa croissance et sa popularité, et le design d'icônes n'échappe pas à cette règle..
En tant que concepteurs, nous passons nos journées à créer des produits numériques destinés à survivre sur un support numérique, qui est influencé par l’état et l’évolution de la technologie, déterminés par la puissance de calcul et les progrès en matière d’affichage mis à disposition au cours de la vie. C’est la raison pour laquelle le passage des icônes pixel art aux icônes skeuomorphiques à part entière a été très long, car les ordinateurs n’avaient pas la puissance brute pour afficher la quantité de pixels que nous avons actuellement..
Pour les concepteurs, cela signifie qu'ils doivent toujours s'adapter et devenir entièrement dépendants du support, ce qui, en fonction de son état évolutif, peut influencer leur style en ajoutant ou en supprimant des limitations créatives..
Un exemple parfait est la réalité virtuelle (VR), où nous commençons tout juste à faire des progrès en déterminant les possibilités et les limites de ce nouveau et excitant support..
Au début, j’avais promis que l’étude se concentrerait sur la présentation et la description succincte des dix styles qui ont façonné le design des icônes dans son état actuel. Alors, sans perdre plus de temps, prenez une autre gorgée de ce café chaud et passons directement au premier plan..
Nous allons lancer les choses en présentant la trinité à partir de laquelle tout a commencé.
Comme nous l'avons vu il y a quelques instants, le premier style d'icônes jamais créé a été créé et façonné par la technologie de son époque, alors que les ordinateurs étaient lents et que les concepteurs devaient gérer des écrans monochromes..
La mission consistait à exploiter les limitations existantes et à créer les icônes à l'aide d'un processus complexe de positionnement d'un nombre spécifique de pixels noirs sur une grille carrée, jusqu'à ce que le symbole commence à prendre forme, d'où le nom du style..
Le style lui-même ne peut être décrit que comme audacieux, car il a utilisé des lignes noires dures et épaisses pour les contours et des lignes plus douces et plus minces et des détails pour les sections de composition intérieures..
Pour moi, les icônes basées sur les pixels sont vraiment impressionnantes: non seulement elles ont été les premières à ouvrir les ordinateurs personnels au marché grand public, mais elles ont également réussi à rester pertinentes en raison de la simplicité de leur nature, depuis 36 ans. de l'existence, pas beaucoup a changé, et c'est peut-être une bonne chose.
Système d'exploitation Xerox 8010 Star GlobalView - image fournie par ToastyTechAujourd'hui, les icônes de pixel art continuent de conserver leur popularité, car elles constituent un puissant facteur de nostalgie, rappelant ainsi l'aspect et la convivialité des débuts de l'informatique, où le style ne tenait pas compte du nombre de détails que l'on pouvait ranger dans un petit espace. mais comment capter l'attention des yeux en utilisant le moins d'éléments visuels possible.
Pixel Icons par Gustavo ZambelliNous sommes en 1985 et ATARI vient de lancer TOS (The Operating System) avec le lancement de son ordinateur Atari 520ST, qui représente pour la première fois une évolution visuelle des icônes de pixels. Si auparavant, l'utilisateur devait gérer des icônes à deux dimensions, l'expérience change pour le mieux avec l'introduction d'icônes isométriques, basées sur la même «métaphore de bureau», qui ajoutait l'illusion de profondeur et de dimension à son interface utilisateur graphique (Graphical User). Interface) utilisant le troisième axe.
En termes de style, ce n'était pas un départ radical. Considérez-le plutôt comme une amélioration visuelle, car ils étaient toujours basés sur les pixels, mais apportaient quelques changements subtils tels que l'ajout d'ombres dures projetées et l'épaisseur de ligne uniforme.
Pour certains, le mot «isométrique» ne semble pas être le meilleur moyen de nommer le style, car, par définition, une projection isométrique est une «méthode de représentation visuelle d'objets tridimensionnels à deux dimensions» dans laquelle «les trois coordonnées les axes semblent également raccourcis et l'angle entre deux d'entre eux est de 120 degrés ». Pour moi personnellement, elles pourraient être considérées comme les premières tentatives pour apporter une nouvelle perspective à la «métaphore de bureau» qui a finalement conduit à ce que nous appelons maintenant des icônes isométriques..
Atari TOS - image fournie par ToastyTechAujourd'hui, le style a connu une rupture radicale avec ses origines monochromatiques basées sur les pixels, s'appuyant fortement sur l'utilisation de couleurs et de formes pour donner vie à des objets en trois dimensions..
En termes de complexité, le style est assez difficile à maîtriser, car il oblige les concepteurs à réimaginer visuellement l’objet qu’ils veulent représenter en utilisant un cube pivoté comme objet de référence, ce qui n’est pas toujours facile, en particulier lorsque vous avez des problèmes étranges. objets en forme.
Isometric Icons par Thomas BrunsdonQuatre ans plus tard, le lancement de l’ordinateur NeXT de Steve Jobs, fourni avec le système d’exploitation NeXTSTEP, a enfin commencé à casser la tendance..
Si jusque-là, les icônes étaient considérées comme de simples symboles destinés à faciliter l’interaction entre l’homme et la machine, Jobs le poussait au niveau supérieur avec l’introduction des toutes premières icônes skeuomorphes, conçues pour imiter leurs homologues du monde réel..
Dites au revoir à ces contours épais et trapus, et bonjour à un niveau de savoir-faire jamais vu auparavant dans une interface utilisateur graphique (GUI), caractérisée par l'utilisation d'ombres et d'illustrations très détaillées, le tout dans un même petit espace.
NeXTSTEP OS 0.8 - image fournie par ToastyTechAu fur et à mesure que les ordinateurs devenaient plus puissants et que la technologie d'écran évoluait, le skeuomorphism devenait plus une forme d'art qu'un simple symbole, poussant les techniques et l'imagination de ses créateurs à un point tel que les objets représentés brouillaient la frontière entre les pixels et la réalité..
Des dégradés complexes aux textures, aux rehauts et aux ombres réels, le processus peut être très difficile à maîtriser si vous n’avez pas suivi de formation artistique. Si ce style vous intéresse, vous pouvez commencer à apprendre en recréant une icône stylisée aux fraises qui vous montrera toutes les bases..
Le style lui-même est devenu très populaire en 2007 avec le lancement de l'iPhone d'Apple, et le resta jusqu'en 2012, année où l'on passa des icônes réalistes aux icônes minimalistes..
Icône Skeuomorphic par Eddie LobanovskiyÀ ce stade, notre chronologie va devenir un peu floue ici et là, car pour certains des styles à venir, nous ne serons pas en mesure de déterminer le moment exact où ils sont apparus et ont gagné en popularité, c'est pourquoi j'ai décidé de groupe et les commander en fonction des attributs qu'ils partagent et ont évolué de.
Icônes de ligne par Justas Galaburda de Icon UtopiaLes icônes de ligne sont une branche évolutive directe des icônes de pixel art originales, et constituent l'un des styles populaires les plus populaires, en raison de leur capacité à représenter des images puissantes à l'aide de formes et de contours simples..
Pour une philosophie de conception, le style lui-même utilise le même principe de séparation des différentes sections de composition de l'objet à l'aide de lignes épaisses et dures, mais il utilise des traits plutôt que des carrés individuels. Ce changement de technique a facilité la tâche du concepteur pour les créer et les ajuster, car il s’agit désormais de formes et de chemins plutôt que de pixels individuels..
Au-delà, le style est devenu plus organique, car l'évolution des écrans d'ordinateur a permis d'utiliser des lignes courbes et des angles arrondis, par rapport à l'ancien temps où vous deviez donner vie à vos idées en utilisant des formes rectangulaires ultra-nettes..
Personnellement, j'adore le style, car il est facile d'approcher et de devenir bon en une fois que vous l'avez pratiqué plusieurs fois..
D'un point de vue terminologique, le nom «glyphe» vient du français «glyphe» qui lui-même provient du grec «gluphē» et peut être défini comme un «caractère ou symbole hiéroglyphique». Du point de vue de la conception, un «glyphe» est un style visuel dans lequel les objets sont représentés à l'aide de formes monochromatiques pouvant comporter des espaces vides subtils séparant leurs différentes sections de composition..
Bien que simple dans sa nature, le style peut être vraiment efficace, en particulier lorsqu'il est utilisé dans des tailles plus petites, car vous pouvez représenter l'objet à l'aide d'un résultat minimaliste mais toujours compréhensible. C'est pourquoi il peut être considéré comme le précurseur du design plat..
Glyph Icons par Martin DavidLe style des icônes plates est devenu populaire vers l’année 2012, avec le lancement du langage visuel récemment remodelé de Microsoft, connu sous le nom de Metro (maintenant Fluent), en réponse directe à l’abus de skeuomorphism d’Apple..
Sur le plan visuel, la philosophie de conception a considérablement évolué. Elle vise une approche claire et minimaliste en décomposant l'objet à l'essentiel, en supprimant le plus de détails possible dans le processus..
Cela a conduit à la naissance d'un nouveau type d'icônes faciles à comprendre et à utiliser, du fait que l'accent avait été mis sur l'utilisation judicieuse des couleurs et des formes géométriques de base..
Finalement, les concepteurs ont compris le potentiel de la conception à plat et ont commencé à créer de nouvelles icônes basées sur des formes claires, exemptes de dégradés ou d'ombres portées, et ont développé le style actuel..
Icônes de plats de Dominic FlaskAlors que les choses commençaient à changer avec le design plat, en 2014, Google a décidé de suivre ce changement et a invité le designer Matias Duarte à participer à la création de son propre langage visuel, baptisé Material Design..
Maintenant, si le skeuomorphism avait trop à faire et le design plat était trop, Google se positionnait quelque part au milieu en rappelant les ombres et les ombres, mais en leur donnant une présence plus subtile, créant un style visuel dans lequel les objets étaient empilés. un autre. Ils sont allés encore plus loin et ont mis au point un guide en ligne assez complet, dans lequel ils parlent de tout, des propriétés des matériaux aux principes de mise en page et aux styles de couleurs, ce qui facilite grandement leur migration et leur adoption..
À mon avis, les icônes matérielles sont un bon ajout au design plat, et tant que Google aura quelque chose à dire, elles continueront d'être populaires..
Material Icon de Jovie Brett BardolesPour le style suivant, il est vraiment difficile de mettre une étiquette, car elle se situe entre les limites des icônes de ligne et les icônes isométriques, empruntant des éléments clés à la fois..
J'ai failli me casser le cerveau en essayant de le définir et je suis finalement arrivé à la conclusion que le meilleur ajustement serait une dimension, car le processus se concentre sur l'ajout d'une dimension ou d'une profondeur à l'icône d'un point de vue horizontal..
Pour ce faire, vous devez présenter l'avant et l'un des côtés de l'objet, en utilisant des formes rectangulaires pour tout ce qui n'est pas circulaire ou incurvé. Pour les objets relevant de la deuxième catégorie, ils sont généralement représentés sous une seule perspective, le recto, ce qui crée un équilibre contrasté et en même temps cohérent entre les éléments de composition de l'icône..
En termes de difficulté, le style est assez facile à comprendre et à maîtriser tant que vous avez une compréhension de base de la perspective, de sorte que vous puissiez définir et positionner correctement les détails nécessaires pour les sections avant et latérales..
Dimensional Icons par Ryan PutnamCe prochain film appartient à une catégorie à part, car aussi attrayant que cela soit (regardez juste ces petites beautés), il n’est pas aussi fréquemment utilisé car il est généralement perçu comme trop «ludique». Le style est devenu plus populaire après le changement de marque de Dropbox, qui a montré le potentiel pour construire une identité véritablement unique, en utilisant des lignes dessinées à la main qui ont une nature fragile..
À mon avis, ce type d'icône peut s'avérer plus convivial, car la relation entre eux et l'utilisateur devient plus chaleureuse, car vous avez affaire à des symboles qui donnent l'impression qu'ils n'ont pas été conçus par un ordinateur, mais par une personne vivante et respirante. Humain.
En termes de complexité, le style peut être difficile à manipuler, en particulier si vous n’êtes pas habitué à dessiner et à ombrer, ce qui rend également difficile à imiter, car vous ne créez pas les formes en cliquant sur les rectangles et les cercles et en les faisant glisser..
Icônes dessinées à la main par Corrine AlexandraEnfin, nous avons une variété d’icônes vraiment unique puisque sa nature dynamique vous oblige à cliquer dessus. Même si elles ressemblent à de simples gadgets visuels, les icônes animées représentent l’avenir de l’interaction, car elles détiennent un pouvoir incroyable en ce qui concerne le processus d’engagement entre l’utilisateur et l’interface..
Quelle que soit leur forme (plate, ligne, etc.), les icônes animées peuvent apporter quelque chose de nouveau et de frais à la table, en raison de leur deuxième état (lorsqu'elles sont survolées), et ainsi doubler les informations disponibles pour l'utilisateur. survolé, ils peuvent apporter des données utiles en quelques secondes.
Dans un monde où la réalité virtuelle (VR) et la réalité augmentée (AR) sont l'avenir, on peut voir le potentiel d'intégration d'animations dans la structure des icônes..
En termes de complexité, le style peut être difficile à maîtriser, car vous ne les concevez pas uniquement, mais vous prenez également le temps de les concrétiser pleinement, ce qui peut s'avérer difficile si vous ne savez pas exactement ce que vous souhaitez exprimer à travers eux..
Animated Icons par Dave ChenellAvant de terminer, je tiens vraiment à remercier tous les concepteurs qui ont participé à l'étude et, plus important encore, ToastyTech pour avoir fourni les images des systèmes d'exploitation..
Cela étant dit, j'espère que vous avez aimé parcourir l'historique de ce que nous appelons les icônes et découvrir quelque chose de nouveau et de captivant..
De plus, si vous voulez en savoir plus sur les icônes, je vous recommande fortement de lire certains des articles suivants, car je suis sûr que vous finirez par trouver des astuces nouvelles et utiles..
