3 grands avantages du codage couleur dans la conception des produits

Product designers and marketers can use color coding for 3 reasons: to convey a message, to convey a feeling, or to easily distinguish between elements. As such this design trick should be used as frequently as possible in any virtual or physical creation, such as GUI, road signs, toys, tools, or safety equipment to improve ergonomics.

En combinaison avec d'autres sens tels que la forme, le son et autres, l'utilisation du codage couleur est applicable dans les conceptions de produits ainsi que dans tout processus lean pour marquer les équipements d'usine, mais aussi les bureaux et les espaces publics.

Un code de couleurs pour transmettre un message

Le codage couleur est l'une des méthodes permettant de transmettre des messages ou des instructions importants, dans la famille visuelle des 6 sens.

L'objectif est de transmettre un message de la manière la plus efficace possible, les couleurs présentant l'avantage de être rapide, ne pas exiger trop de capacités de lecture (enfants... ) & international (aucune traduction nécessaire)

Codage normalisé des couleurs

Pour les signes ou pour transmettre un message, se référer à

ISO 3864-3:2012 : Symboles graphiques - Couleurs de sécurité et signaux de sécurité - Partie 3 : Principes de conception des symboles graphiques utilisés dans les signaux de sécurité.

complétée par :

ISO 3864-4:2011 : Symboles graphiques - Couleurs de sécurité et signaux de sécurité - Partie 4 : Propriétés colorimétriques et photométriques des matériaux des signaux de sécurité.

D'autres réglementations particulières feront référence à ces règles ou les suivront, comme l'industrie médicale pour ses étiquettes ou les directives relatives aux machines ou aux équipements pour tous les avertissements et mesures de sécurité colorés.

Significations habituelles des couleurs

Rouge et vert

le plus fréquemment utilisé, comme

• Go/NO GO
• OK/NOT OK
• FONCTIONNE/PAS FONCTIONNE

et moins fréquemment comme Danger / Sécurité

Jaune

Le gavertissement général couleur

• Généralement utilisé seul comme un message "Travail en cours".
• Ou utilisé en combinaison avec du noir dans les rayures ("zone de danger")

Bleu

Le bleu peut être trompeur dans l'usage quotidien :

• • Notez que seul le panneau du code de la route ou dans les normes ISO est bleu, la couleur des instructions obligatoires.

Diriez-vous que les logos bleus de Facebook, Twitter et LinkedIn transmettent un message d'instruction obligatoire ?

• • Dans la vie quotidienne, dans les logos ou les produits, la couleur bleue est généralement liée à innovation ou le futur, comme on peut le voir dans la vidéo ci-dessous

Blanc / Noir

Elles doivent être utilisées avec précaution, si la couleur elle-même doit porter un message ; elles sont surtout compréhensibles si le contraire est également visible (comme un message booléen/oui-non), car les deux peuvent être un texte ou le fond.

Conseil : rappelez-vous la vieille règle graphique selon laquelle l'obscurité supplante, ou déborde visuellement, sur la lumière : a barre noire sur fond blanc, apparaîtra plus épaisse qu'une barre blanche sur un fond noir, même si l'épaisseur est la même.

up to 3 different colors does help the ergonomics, 4-5 is a design challenge, and more than 5 is usually counterproductive

Conseil : faites attention au fond du produit : il doit déjà compter comme une couleur à distinguer s'il n'est pas blanc ou noir !

Un code de couleurs pour transmettre un sentiment

La culture, l'histoire et les aspects psychologiques jouent également un rôle important dans les décisions relatives aux couleurs :

Exceptions culturelles ou locales : Les couleurs noir et blanc sont souvent mentionnées comme des couleurs très dépendantes de la culture qui peuvent être liées à la soumission, au pouvoir, au respect, à la religion, à la tristesse ou au bonheur... des messages très opposés, selon la culture locale. D'autres exemples ? Veuillez commenter à droite

Par exemple, ces belles maisons sur la photo de droite : bien que le paysage soit magnifique et qu'il transmette de grandes émotions, de telles...

un mélange de couleurs ternes ne doit pas être utilisé pour transmettre un message informatif dans la conception d'un produit

Des couleurs pour distinguer les éléments

Les couleurs n'ont pas de signification particulière ici, mais le rôle de faire des différences claires entre les objets. Ils utilisent généralement beaucoup plus de couleurs différentes que les cas ci-dessus et ces objets ou étiquettes peuvent être très proches les uns des autres, rendant la différenciation des couleurs encore plus critique

Elle est utilisée dans les jeux, dans l'industrie, dans les organisations Lean ou dans les équipements de sécurité, comme dans les exemples de la bibliothèque ci-dessous.

Palettes de couleurs à utiliser

En fonction de la quantité de couleur nécessaire, quelques conseils pour choisir ces couleurs

• • Ne pas faire prendre deux variantes d'une même couleur en densité (ex. : orange clair vs orange)
  • Si le but est purement informatif,
    • prenez une couleur dont le nom est clairement connu, pas seulement pour les spécialistes
    • utilisez une palette de couleurs professionnelle et choisissez les couleurs les plus fréquentes.
      • Il peut s'agir couleurs primaires ou couleurs secondaires
      • Cela rendra les peintures ou les encres déjà disponibles (plus faciles à trouver, moins chères et plus conformes aux normes de santé et de sécurité, comme la résistance et la protection contre le feu...). 
  • Si votre produit est un logiciel ou une interface graphique quelconque, qui nécessite un affichage en ligne, utilisez les couleurs du web chaque fois que possible pour garantir la compatibilité avec tous les supports de facto.
  • utiliser couleurs complémentaires s'il en faut plusieurs ou plus d'originalité (voir les liens et la vidéo ci-dessous).

Exemples de codes de couleurs

Industrie électronique

Utilisé pour le codage de la valeur des résistances : en tant que norme internationale, certaines bandes indiquent la valeur de la résistance, tandis que d'autres indiquent sa tolérance. Ce type de codage s'est développé depuis les années 1920 en raison de la nécessité de disposer de très petits marquages internes.

Plus d'informations sur Codage électronique des couleurs pour les détails.

Et si pas de couleur ?

• Noir et blanc en raison du procédé : ébène et ivoire sur les touches du piano traditionnel, mais pas seulement ; la couleur peut ne pas être une option en raison du prix ou du procédé (marketing laser, jet d'encre noir, ePaper, ...).
• les daltoniens

puis, dans la palette de astuces de conception visuelle encore disponibles, les concepteurs devront combiner d'autres supports visuels pour mettre en évidence un message particulier :

• formes : triangles, cercles, hexagones carrés comme sur les panneaux de signalisation routière
• le style et la taille de la police
• Régulier / Gras pour souligner l'importance
• Capitales (MAIS PAS TROP)
• signes, marques et logos spéciaux
• gaufrage si le procédé le permet (papier généralement, mais réalisable aussi sur métal, plastique, tissus)

à combiner avec les autres sens humains traditionnelsle plus fréquent dans la communication étant :

• sound: tone, frequency, level, and sequence of notes can be used for warnings, OK, NOT OK, validation, or indication of proximity
• touch : pas seulement pour les utilisateurs de bling-bling