La science derrière la théorie des couleurs de conception
La théorie des couleurs est un sujet d'intérêt depuis des années dans la communauté artistique. Les règles et les lignes directrices s'appliquent aussi bien aux projets numériques qu'aux éléments physiques.
Il y a beaucoup à apprendre dans le domaine de la couleur, donc je vais couvrir quelques-uns des points clés. La terminologie est quelque chose que de nombreux concepteurs se font prendre et qui ne devrait vraiment pas vous faire peur ni vous retenir. La science derrière la théorie des couleurs est brillante mais élégante. Cela devrait être un sujet d'intérêt pour tous les artistes numériques.
Explorez les ressources de conception
Terminologie des couleurs
Les termes sont très importants lorsqu'il s'agit de travailler en tant que designer. Après tout, comment communiquerez-vous vos connaissances à vos coéquipiers ou à vos clients si vous ne les comprenez pas vous-même? Ci-dessous, je vais entrer dans les descriptions de quelques termes que chaque designer devrait connaître.
Hue est celui dont je suis sûr que la plupart ont au moins entendu parler auparavant. En termes simples, une teinte est la couleur utilisée dans n'importe quel pixel d'un dessin. Ceux-ci peuvent inclure des noms de référence tels que «Rouge» ou «Violet» mais généralement nous décrivons les teintes par d'autres moyens.
La plupart des développeurs Web connaissent les valeurs RVB pour les teintes. Les 2 façons par défaut d'écrire les couleurs seraient en paires de valeurs RVB (telles que «255, 0, 0» pour le rouge pur) ou en code hexadécimal (# FF0000). Si vous avez déjà travaillé avec une maquette de conception dans Adobe Photoshop ou Illustrator, vous avez probablement travaillé avec la roue chromatique et défini une valeur de couleur. C'est la même chose que de définir une teinte, nous aimons simplement compliquer les choses.
La saturation est un autre mot à la mode dont les concepteurs ont probablement entendu parler mais qui ne l'ont jamais vraiment défini. Nous appelons la saturation la quantité d'intensité affichée par une couleur, qu'elle soit très lumineuse ou faible. Vous pouvez également considérer la saturation comme l'intensité de la teinte d'une couleur unique - plus la couleur est saturée, plus la couleur est pure.
Les jeux de couleurs avec moins de saturation fonctionnent mieux comme éléments de fond dans un site Web. En effet, ils sont généralement plus proches du blanc pur que leur teinte d'origine, ce qui les fait retomber derrière des éléments profondément saturés. Un tel exemple peut être trouvé dans l'ancien design de Digg (illustré ci-dessous).
Leur fond bleu clair est le niveau de saturation parfait pour tenir dans un décor de fond. Cela n'est vrai que par rapport au reste des fonctionnalités du site, à savoir les verts et bleus intenses que l'on trouve dans l'en-tête et le contenu de la page.
Le ton ou la valeur est un terme dont la plupart n'ont pas entendu parler. Il se réfère à la quantité de légèreté dans une couleur placée le long d'un spectre allant du noir (pas de tonalité) au blanc (ton le plus élevé). C'est différent de la saturation car nous ne nous occupons pas d'ajouter / de soustraire plus de la teinte de base, mais plutôt de travailler avec l'ajout de valeurs de noir ou de blanc dans une couleur.
Par exemple, vous trouverez plus de tons dans un jaune vif ou rouge qu'avec du bleu marine. En imaginant chacune de ces couleurs, vous pouvez voir comment un jaune tournesol brillant est plus riche dans sa teinte d'origine (jaune primaire) par rapport au bleu marine qui est plus profond et plus sombre que sa teinte d'origine (bleu primaire).
Les nuances et les teintes sont des opposés polaires les unes des autres et s'adaptent de manière similaire aux tons. Les nuances sont créées en prenant une teinte et en ajoutant du noir pur pour créer une nouvelle couleur plus profonde. Les teintes sont similaires, sauf que vous ajoutez du blanc pur pour créer une nouvelle couleur. De nombreux concepteurs confondent ces termes et les considèrent comme éclaircissant / assombrissant un ensemble de couleurs.
La principale différence que nous voyons ici est la création d'ensembles de couleurs complètement uniques. Par exemple, des teintes pures avec un ajout de teintes blanches peuvent créer des couleurs appelées pastels. Ceux-ci sont souvent utilisés pour ajouter de la féminité et de la douceur à un jeu de couleurs (vous trouverez souvent des pastels sur les jouets pour enfants et les sites Web pour bébés).
Relations pour la théorie des couleurs
La science derrière les relations chromatiques est directement liée à la roue chromatique. Je suis sûr que la plupart d'entre nous se souviennent d'avoir entendu parler de cela en classe d'art secondaire, mais l'ont depuis repoussé. Les relations démontrées dans une roue chromatique sont en fait très importantes lorsqu'il s'agit de concevoir des schémas.
Les couleurs peuvent être décomposées en 3 groupes contenant primaire, secondaire et tertiaire. Les couleurs primaires sont le rouge, le bleu et le jaune. Ce sont les 3 couleurs les plus basiques qui peuvent être combinées pour créer (littéralement) toutes les autres couleurs de notre spectre. Lorsque vous mélangez ces couleurs, vous obtenez notre ensemble de couleurs secondaires. À savoir ceux-ci sont orange, vert et violet.
Les couleurs tertiaires sont fabriquées en mélangeant les couleurs primaires et secondaires pour créer des ensembles entièrement nouveaux. Un exemple pourrait être la création d'orange en combinant le rouge et le jaune ensemble. Vous pouvez également obtenir des mélanges vraiment uniques tels que des couleurs bleu-vert ou brun foncé.
En plus des relations pour former des couleurs, nous pouvons également les regrouper en placements en fonction de leurs liens émotionnels. Les groupes de couleurs sont divisés en 3 catégories similaires pour cela: chaud, frais et neutre.
Comme je suis sûr que vous pourriez deviner que les couleurs chaudes contiennent toutes les teintes excitantes. Ceux-ci évoquent la chaleur et l'énergie et peuvent être trouvés vers le haut de n'importe quelle roue chromatique. Les exemples les plus marquants sont le rouge, le jaune et l'orange.
Les couleurs froides sont tout le contraire. Celles-ci évoquent une relation détendue et favorisent la détente, le calme et la tension. Les exemples ici incluent le bleu, le vert et le violet.
Les neutres sont des couleurs non émotionnelles utilisées pour s'adapter aux écarts de couleur. Ils sont sertis de nuances de noir, blanc, gris et parfois brun foncé. Bien que ces formes de couleurs n'évoquent aucun sens de connexion émotionnelle, elles peuvent être utiles pour délimiter des éléments sur une page ou une section. Généralement, nous utiliserons des couleurs neutres pour nos paragraphes et le contenu de la page.
La théorie des couleurs en pratique
L'intérêt de la théorie des couleurs est d'évoquer un ensemble d'émotions à partir de n'importe quel ensemble de couleurs potentielles. Développer un schéma peut être difficile au début, mais c'est une partie importante du processus de conception (cela est particulièrement vrai dans la conception de sites Web et la conception de marque).
Beaucoup diront que les couleurs ne pénètrent aucun type de barrière mentale et ne transmettent pas d'émotion. Cela s'avère faux sur la plupart des comptes et, lorsqu'ils sont utilisés correctement, certains schémas de couleurs peuvent réellement aider l'interface de votre site Web avec plus d'inscriptions et de commandes.
En général, des couleurs plus chaudes apporteront un sentiment de bonheur et d'énergie. Ces couleurs sont fréquemment utilisées pour afficher un appel à l'action pour vos visiteurs. Vous pouvez donner un sentiment d'excitation et d'exigences sensorielles simplement en plaçant des couleurs plus chaudes autour des régions avec lesquelles vous attendez les visiteurs.
Des couleurs plus froides rappellent un sentiment de paix et de ressemblance. Souvent, des programmes plus cool sont utilisés sur les blogs ou les sociétés numériques pour soulager les yeux de leurs lecteurs et les garder «bloqués» sur leur page plus longtemps. Les bleus et les violets profonds gardent les émotions à l'aise et adoptent un type de passivité en matière d'absorption de contenu.
Vous découvrirez également que les couleurs froides représentent une puissance et une autorité potentielles. Vous verrez ces couleurs utilisées au premier plan sur de nombreuses entreprises et banques pour promouvoir la fiabilité de leurs clients. Par exemple, Microsoft et Blackberry utilisent des bleus et des verts profonds pour garder un sentiment d'entreprise calme et respectable tout au long de leurs pages.
Conclusion
Ce ne sont que quelques-uns des concepts utiles aux concepteurs en matière de théorie des couleurs. Les couleurs sont partout et lorsqu'elles sont utilisées correctement, elles peuvent favoriser tout type d'émotion ou d'action que vous souhaitez de vos visiteurs. Il existe de nombreux articles sur le Web liés à la théorie des couleurs et à la gestion des couleurs. Consultez Google si vous souhaitez approfondir la science.
Gardez à l'esprit que les couleurs peuvent être une partie importante du travail de conception, mais elles ne sont pas la seule clé d'une mise en page parfaite. La théorie des couleurs n'est qu'un outil dans la gamme d'innombrables outils que nous utilisons en tant que concepteurs de sites Web. Sortir de la norme et jouer avec de nouvelles règles de couleur ne peut que vous aider à grandir en tant qu'artiste moderne numérique et relationnel.
