Logos adaptatifs

Les graphistes et développeurs ont depuis des années l’habitude d’adapter leurs productions aux dimensions variés des appareils. De plus, les sites non responsive (c’est à dire non compatibles avec les mobiles, smartphone ou tablette), sont pénalisés par Google depuis le 21 avril 2015.  Tout ce travail a permis de développer les fondamentaux du « design adaptatif » (responsive design en anglais).

Avec les sites web responsives, la charte graphique (comprenant le logo) doit évoluer. Un logo doit pouvoir conserver sa personnalité et transmettre l’identité de marque, dans différentes tailles.

blog ai3 responsive-logo Logos adaptatifs
Logo responsive

Joe Harrison, spécialiste en design digital et interactif nous explique dans son étude que des marques comme Coca Cola, Chanel ou Disney ont déjà des variantes de leur logo, qui s’adaptent et se modifient en fonction de l’utilisation.

Pour arriver à la plus petite forme d’un logo adaptatif, il faut :

  • Supprimer les détails
  • Supprimer les couleurs
  • Simplifier les formes
  • Empiler les éléments pour un rendu carré

En appliquant ces principes de conception, un logo plus lisible et approprié peut être affiché. Le concept vise à passer d’une image de marque de lignes directrices fixes et rigides à un système plus souple et plus contextuel.

blog ai3 logos-adaptatifs Logos adaptatifs
Logos adaptatifs de Coca-Cola, Chanel, Walt Disney et Heineken

Disney par exemple a simplifié progressivement son logo, faisant disparaître le château, jusqu’à ce qu’il ne reste plus que la première lettre du nom de la marque. Au contraire, Heineken ou Chanel suppriment le nom de la marque pour ne laisser qu’un pictogramme. Pour Coca Cola, le changement va jusqu’à changer le nom de la marque pour passer de Coca Cola à la version minimale « Coke ». Vous pouvez voir le résultat de cette étude en action : ResponsiveLogos.co.uk .

Aujourd’hui, il ne suffit donc plus de créer un simple logo mais de penser une gamme de logo avec des variantes de compositions pour s’adapter à différentes tailles ou résolutions d’écran.

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.