Pictogrammes : un petit tour sur le web

Publié le 18 novembre 2010 par Flb95
Il n'est pas toujours facile d'illustrer une carte heuristique. Qu'il s'agisse de trouver l'inspiration pour représenter des idées par le dessin sur des cartes manuelles ou d'enrichir une carte logicielle avec des images, Internet est une formidable ressource... et une véritable jungle.

Graphiste de profession, je suis confrontée quotidiennement à la nécessité de représenter les idées avec des images et cette problématique est partagée par les webdesigners, les concepteurs de jeux vidéos, de signalétique, de modes d'emploi, etc.

Ces communautés échangent donc beaucoup de créations et d'idées pour enrichir le travail de tous ; je vous propose ici une sélection de ces ressources disponibles sur le web.

Pictos à télécharger

Ces images sont généralement conçues pour représenter des fonctionnalités de site web ou d'applications mobiles. Mais leur forme peut vous évoquer bien d'autres univers que la technologie, n'hésitez pas à piocher et à leur attribuer vos propres significations.

Cliquez sur les images ci-dessous pour vous rendre sur le site de téléchargement. Le plus souvent les pictos sont réunis dans une archive .zip, dans laquelle vous trouverez des images au format PNG et parfois au format GIF ou JPG.

Licences

Ces pictos sont tous libres de droits pour une utilisation privée, mais certains sont soumis à restrictions pour une utilisation commerciale (si vous vendez un document les utilisant ou sur un site professionnel par exemple). Consultez les licences de chacun sur leurs sites respectifs pour en savoir plus.

En outre il est interdit de les redistribuer, gratuitement ou non. Si vous souhaitez les partager avec d'autres personnes, la meilleure façon de le faire est de transmettre le lien vers le site intial, comme ci-dessous, et laisser les personnes le télécharger directement depuis ce site.

Glyphish


Télécharger

Téléchargement en cliquant sur le bouton "Free 200 icons" en haut de page

Go green


Télécharger

Téléchargement en cliquant sur le lien "Download" en dessous de l'image

Pc.de


Télécharger

Téléchargement en cliquant sur les boutons "Free download" à droite

Le set ci-dessus est "Hamburg". Cliquez sur les images dans la page pour les voir en plus grand

Android Icons


Télécharger

Téléchargement en cliquant sur le bouton "Download" sous l'image

Icojoy


Télécharger

Téléchargement en cliquant sur le lien "Download"

Et dans le même style, le pack précédent peut être trouvé ici.

Free mobile berries


Télécharger

Téléchargement en cliquant sur le bouton "Download"

Wi Fun


Télécharger

Téléchargement en cliquant sur le lien "Download file" à droite

Lego heads


Télécharger

Téléchargement en cliquant sur le bouton "Download file" à droite

Yoritsuki


Télécharger

Téléchargement en cliquant sur le lien "Download file" à droite

Pour aller plus loin

Inspiration et téléchargement : banques d'illustrations gratuites et banques d'images payantes

Banques d'illustrations gratuites

Sur ce site vous trouverez de nombreuses représentations de situations, objets, actions. Ces pictos sont initialement dédiées aux thérapeutes et sont très sobres formellement.

Ce site est plutôt dédié aux scolaires et recèle des illustrations plutôt que des pictos.

Il existe aussi de nombreuses banques de cliparts telles que http://www.clipart-fr.com/, http://www.openclipart.org/ (anglais), http://www.1clipart.com/ (anglais), etc. Ces sites gratuits sont envahis de publicité et il est parfois difficile d'y naviguer mais en persévérant on peut y trouver son bonheur.

Banques de photos payantes

Pour votre insipration vous pouvez aussi rechercher des mots-clefs sur les banques d'images comme Getty Images, ShutterStock, iStockPhoto ou Fotolia. Faites vos recherches en choisissant les types de fichier vecteur/vectoriel et/ou illustration (case à cocher ou choix dans une liste déroulante sur ShutterStock). De cette façon vous n'aurez pas de photos ou de vidéos dans vos résultats de recherche.

Essayez différents mots-clefs pour affiner ou élargir votre recherche selon le nombre de résultats. Ces sites acceptent tous des mots-clefs en français. N'oubliez pas que ces images sont payantes, il s'agit seulement d'une source d'inspiration.

Vous pouvez aussi utiliser la fonction recherche d'images de Google pour obtenir des idées et sources d'inspiration. Pour cela tapez votre mot-clef suivi de "picto", "icone" ou "symbole". Songez que le plus souvent une recherche en anglais sera plus efficace. Facile : "picto" est valable pour les deux langues, "symbole" devient "symbol" et "icone" devient "icon". Si besoin, traduisez votre mot-clef à l'aide d'un site comme Reverso.

Créer ses pictos

Vous êtes inspiré, vous avez du temps (!) et vous voulez commencer à retoucher des dessins récupérés ou dessiner vos propres pictos sur ordinateur pour enrichir votre pictothèque... Voici quelques pistes.

The Gimp, logiciel gratuit de création d'images

Sur PC, intéressez-vous notamment au détourage pour apprendre à récupérer des images sans fond (par exemple après avoir scanné des dessins) et pouvoir les utiliser dans vos cartes sans arrière-plan, ou en combinant plusieurs images récupérées sur internet pour créer de nouveaux pictos.

Sur Mac, détourer une image est une fonctionnalité de l'aperçu. Vous disposez de deux méthodes : détourer avec l'outil "Extraire couleur" pour un fond uni, et détourer avec la fonction "Extraire avec la forme" pour les images plus complexes. En revanche pour combiner des images ou en créer de nouvelles, The Gimp sera un outil indispensable.

À savoir : les deux formats d'image incluant la transparence sont le PNG et le GIF.

Une fois que vous serez à l'aise avec le logiciel vous pourrez partir à la recherche de ressources avancées comme ce fichier photoshop (ce type de fichier est compatible avec The Gimp, pour le télécharger cliquez sur le bouton "Download file" à droite).

Ce fichier propose des pictos posés sur des badges-boutons, et contient un calque vide permettant d'insérer n'importe quel picto créé ou détouré par vos soins pour l'intégrer (voir les instructions en anglais sur la page).

L'intérêt de telles manipulations est de donner facilement une cohérence d'ensemble à vos pictos ; ainsi vous pourrez les utiliser sur une carte logicielle et lui donner une allure professionnelle.

Bonus

Voici des ressources annexes, non pictographiques.

Typos manuscrites

Cet article de blog recense de belles polices de caractères manuscrites, pour vous faire plaisir sur vos cartes informatiques. Attention à la lisibilité surtout si vous souhaitez utiliser ces cartes comme support d'information vers d'autres personnes. Une police manuscrite doit être dans un corps en moyenne 20% plus grand que ses cousines "bâtons" pour être aussi lisible. Toutes ces polices sont entièrement gratuites.

Si vous vous demandez comment installer une police sur votre ordinateur, regardez ici.

Motifs et arrière-plans

Plutôt qu'un arrière-plan tout blanc, il peut-être agréable d'avoir un fond légèrement décoré. Tout en gardant à l'esprit qu'un fond ne doit pas non plus être omniprésent, et en choisissant en conséquence des éléments relativement discrets, vous trouverez ici des ressources variées selon vos goûts.

Patterns (motifs répétitifs) à télécharger

  • http://fractured-sanity.org/index.php?navi=resources&site=pattern = des motifs, classés par couleurs. Enregistrez les images par un clic droit (ou Pomme + clic) > Enregistrer sous...
  • http://www.3quarks.com/en/BackgroundPattern/index.html = des patterns papier et motifs japonais, test en direct sur le site, téléchargement du pack complet en bas de page.

Patterns à générer

Textures

Et plus encore...

Ceci n'est qu'un aperçu des ressources disponibles sur le web qui en foisonne. N'hésitez pas à partager vos propres ressources et découvertes !

Anne-Flore Cabouat