Les infographies permettent de présenter des données complexes de manière visuelle et facile à comprendre. De nos jours, les graphistes doivent savoir faire passer un message clairement et efficacement.
Nous allons voir dans cet article plusieurs infographies et leurs différents points forts. Ensuite, nous vous donnerons les clés pour que vous puissiez créer vos propres infographies.
Des données textuelles aux données visuelles
_
À droite, vous voyez le CV d’un designer, conçu comme une infographie. Il a utilisé des diagrammes circulaires pour présenter les statistiques de son travail tout en leur donnant un aspect élégant et dynamique.
Ce type de visuel donne à Tiborvan den Brink l’occasion d’ajouter des couleurs et de donner un certain style à son CV. Deux choses qui lui permettent de se démarquer des autres.
En quelques secondes, on comprend que le néerlandais est la langue maternelle de Tibor (100 %) et qu’il parle couramment l’anglais (88 %). Les icônes qu’il a choisies pour représenter ses loisirs et les baromètres pour mesurer ses compétences sont également des concepts efficaces et intelligents.
On voit instantanément son niveau sur Photoshop, Illustrator et InDesign (75 %). Toutes les informations sont organisées de manière claire et concise ( et originale). Rien à voir avec la phrase de 4 lignes qu’on voit habituellement pour décrire sa grande histoire d’amour avec la suite créative Adobe….
Une image vaut mille mots
_
Tout le monde sait très bien qu’une image vaut mille mots. Et c’est précisément le principe même de l’infographie : les hommes sont des créatures visuelles (les femmes aussi bien sûr). Si lire du texte demande du temps et de la concentration, les images parlent souvent immédiatement d’elles-mêmes.
L’exemple ci-dessus explique le fonctionnement d’un Rubik’s Cube à l’aide d’une série de diagrammes. Étant donné la complexité de l’objet, on peut imaginer qu’il faudrait au grand minimum mille mots pour expliquer ce que les images font en quelques secondes.
On notera en plus l’aspect coloré et agréable de cette infographie, bien plus attirant qu’un long texte.
Rythme
_
Les infographies ont une sorte de rythme naturel. Il est important de ne pas oublier cela lorsque vous créez vos propres infographies. Comme toujours en design, le graphiste doit créer un sens de lecture cohérent.
L’infographie ci-contre explique le processus de fabrication des chaussures en 3 étapes. D’après nous, la lecture commence par le titre à gauche et continue naturellement vers la grosse chaussure sur le toit.
De là, notre oeil se dirige vers l’étape numéro 3. Aïe ! Dommage qu’on ne soit pas allé naturellement vers l’étape numéro 1…
Bien que cette infographie ait beaucoup de charme et de couleurs, le sens de lecture est clairement problématique. Il faudrait intervertir la première et la troisième étape pour régler le problème.
On notera également que cette infographie n’en dit pas beaucoup, ni par le biais de texte ni par un autre moyen. Par exemple, on aperçoit deux personnages dans l’étape de la production, mais cette image n’évoque rien de plus que « la production ». Il en va de même pour les deux autres étapes.
Émotion
_
Les bonnes infographies communiquent une émotion en plus de présenter des données statistiques. En d’autres termes, elles provoquent un sentiment immédiat chez le lecteur en plus d’apporter des informations.
Dans l’exemple ci-dessus, les données sont limpides et le design est très réaliste. La plupart des Américains ne savent pas que toutes les forêts du territoire n’appartiennent pas au gouvernement de leur pays. Cette image peut éveiller leur inquiétude (la terre coupée en deux, dont un côté clôturé) ou les amener à se renseigner davantage sur le sujet.
Directions
_
Certains styles d’infographies utilisent également des icônes en conjonction à du texte pour aider le sens de la lecture. C’est que l’on voit dans l’infographie ci-contre, qui vous explique comment démasquer les menteurs.
Dans la première étape, on utilise des images pour montrer les gestes à repérer au lieu de les décrire avec un long paragraphe de texte. Il est bien plus facile de comprendre les gestes en question avec des illustrations qu’avec une description.
La deuxième étape repose sur une autre méthode: le texte est directement adjoint à l’image grâce à la légende. Cette approche est également très efficace et permet un sens de lecture circulaire.
La quatrième étape est, elle aussi, différente des autres. Pour exprimer visuellement les indices produits par la voix, on a dessiné une onde sonore. C’est moins efficace que la méthode utilisée dans la première étape, car cette illustration n’apporte pas d’informations supplémentaires. Néanmoins, cela permet d’attiser la curiosité du lecteur et donne une certaine cohérence avec le reste du design.
Esthétique
_
Au-delà des qualités pratiques et fonctionnelles des infographies, il y a également l’aspect esthétique qui compte pour beaucoup. Dans l’exemple ci-dessus, l’effet du changement climatique est présenté sous la forme d’un soleil, auquel on a ajouté des données sur la faune, la flore et la température.
Bien que le sujet soit alarmant, le design est doux, innocent et attirant. La palette de couleur est à la fois amusante et sophistiquée, et la fleur géométrique attire l’attention du lecteur. La nature captivante du design incitera probablement bon nombre de personnes à se renseigner davantage, ce qui ne serait peut-être pas le cas si l’on avait présenté les données sous forme de texte.
Comment créer votre propre infographie
_
L’infographie réalisée dans ce tutoriel a été créée avec Photoshop. Elle compare les données relatives aux adeptes du vélo versus ceux qui prennent le métro entre Washington Square Park dans Manhattan et Williamsburg dans Brooklyn. Selon Google Maps, il faut 18 minutes pour effectuer cette distance à vélo et 30 minutes en métro.
Voyons voir ce que l’on peut faire pour représenter ces données à l’aide d’un beau design!
Nous avons commencé par faire une capture d’écran sur Google Maps. Ensuite, nous l’avons collé et désaturé dans notre fichier Photoshop. Nous avons choisi de faire ressortir la route empruntée en jaune en suivant l’exemple de Tibor van den Brink par rapport à l’attrait et l’esthétique des couleurs.
Le fond est gris foncé pour donner du contraste et une légère texture a été ajoutée pour rappeler les cartes en papier. Le cadre de la carte est lui aussi en jaune. Un espace vide est présent en haut pour laisser la place à du texte.
Ensuite, pour reprendre le principe de l’infographie «Comment démasquer un menteur», nous avons ajouté des icônes minimalistes de vélo et de train pour faciliter l’articulation des données. Dans notre lancée, nous avons également ajouté aux icônes les «traces» de longueurs différentes pour représenter approximativement la différence relative entre chacun des deux moyens de transport, pour chaque trajet.
Pour cela nous avons choisi une couleur bleu-verte qui se marie bien avec les autres déjà utilisées. Il ne faut pas oublier l’aspect esthétique de notre infographie pour rendre les données attractives!
Enfin, nous avons ajouté le texte. Nous avons choisi un titre simple et concis et les minutes sont affichées dans une police de caractère parfaitement lisible. Cette infographie est une réussite parce qu’elle parvient à traduire une grande quantité de données textuelles de manière visuelle, et inclut également une carte, une comparaison des moyens de transport et le temps requis par trajet.
C’est également une réussite parce que notre infographie est belle à regarder. Le design est coloré, professionnel, simple et élégant.
Conclusion
Il existe toutes sortes d’infographie. Certaines contiennent des illustrations, d’autres des graphiques, des couleurs, des icônes et même parfois des photos! Il est important que les designers distinguent bien les différents types d’infographie pour savoir dans quelles circonstances tel ou tel autre type est plus approprié.
Faites un petit exercice et tâchez de décomposer la prochaine infographie que vous voyez!
