Aujourd'hui, nous prenons la conception plate au prochain niveau. Tous les projets ne fonctionnent pas avec certains des choix de couleurs vives et audacieuses généralement associés au design plat.
Alors ne soyez pas coincé en les utilisant. Relookez votre modèle de design plat avec une palette de couleurs plus discrète. Ce changement subtil peut donner à votre site une refonte à la mode et l’aider à se démarquer dans la foule des designers plats. Ici, nous allons sélectionner quelques sites Web qui utilisent ce style de manière exceptionnelle pour vous aider à créer un site utilisant un design plat et une palette de couleurs en sourdine.
Amorce de couleur en sourdine
Vous avez probablement déjà vu des milliers de fois les variations de la palette de couleurs plates, et parfois ces couleurs ne correspondent tout simplement pas à l'esthétique du design que vous recherchez. Même lorsque tout ce qui concerne le design plat l’attire.
Les options de couleur en sourdine peuvent alors fonctionner à merveille. Utiliser une palette de couleurs atténuée avec une esthétique plate est classique, poli et juste assez différent pour le distinguer des autres projets plats.
Mais qu'est-ce qu'une palette de couleurs en sourdine? Pour les besoins de cette conversation, toute teinte hautement saturée (comme celle de Flat UI Colours) est ajoutée et une teinte, une nuance ou une nuance sont rendues moins brillantes et plus atténuées. Le résultat est souvent une couleur plus douce et plus calme qui peut être plus facile à utiliser et à adapter à la conception générale.
Vous pouvez voir à partir des images ci-dessous en quoi les mêmes couleurs de Flat UI Colors peuvent être différentes avec les modifications apportées au blanc ou au noir qui les utilisent. Et, tout simplement, c’est ce qu’est une palette de couleurs en sourdine. Le reste de l’esthétique du design peut suivre aussi étroitement (ou vaguement) les principes du design plat que vous le souhaitez.
Des teintes
Les teintes sont créées lorsque vous ajoutez du blanc à une couleur pour l'alléger. Cette couleur est souvent nettement plus claire que la couleur d'origine et est généralement appelée pastel. Les teintes peuvent varier de presque blanc à quelques touches plus claires qu'une couleur complètement saturée. Ils ont souvent une sensation plus légère et plus douce et créent une esthétique plus apaisante que des options plus audacieuses et plus lumineuses.
Les teintes fonctionnent bien avec les photos et sont populaires sur les sites illustrés. Ces couleurs plus claires se détachent souvent de l'esthétique principale et conviennent mieux à des fins de conception lorsque d'autres contenus, tels que des images ou des mots, doivent vraiment être le point central.
Jack Horner utilise des couleurs teintées dans la conception des côtés pour contraster avec les accents de noir. Le jaune sur la page d'accueil est si clair qu'il pourrait être difficile de voir si ce n'est pour l'accent plus brillant. Le site utilise également un vert teinté pour les appels à l'action et des informations importantes tout au long de la conception pour fidéliser les utilisateurs.
Cake Teacher utilise une palette de couleurs jaune pâle et verte similaire, mais avec des teintes différentes. Les jaunes sont un peu plus brillants et les verts sont un peu plus clairs que les couleurs du site de Jack Horner. La palette teintée subtile permet aux utilisateurs de se concentrer sur les photos de gâteaux au milieu de l'écran, en particulier celles avec des options de couleurs plus vives. Le contraste entre la lumière et la luminosité aide à créer un centre de focalisation pour la conception.
Nuances
Les nuances sont les couleurs du résultat avec l'ajout de noir. Cela rendra une couleur plus sombre et semblera plus lourde à l'œil. La gamme d’ajout de noir va du noir avec une touche de couleur à un toucher plus foncé que la teinte originale.
Les nuances peuvent bien fonctionner dans certains types d'environnements, souvent lorsqu'elles sont utilisées avec moins de noir. Les projets très sombres comprenant beaucoup de noir peuvent entraîner des problèmes de lisibilité s’ils ne sont pas exécutés de manière exceptionnelle. Une chose que beaucoup de gens supposent à tort est que les nuances doivent avoir une apparence noire, mais en particulier, ce n'est pas le cas lorsque l'on passe d'une couleur à un schéma de design plat traditionnel.
La vente contextuelle pour le détaillant Ann Taylor utilise une combinaison de nuances pour une promo verte simple, facile à lire et attrayante à regarder. L'esthétique utilise beaucoup de concepts plats et d'éléments à la mode tels que des boutons fantômes et une typographie audacieuse, mais les teintes ombrées sont tout sauf «traditionnellement». appartement. Combinée avec le texte jaune (grâce à une tonalité), la palette aux tons neutres est saisissante et moderne.
Caf? Frida utilise un ensemble de couleurs pas du tout commun. Les jaunes, les verts et même les blancs ombrés créent une sensation vintage. Les couleurs sont fortes, mais pas irrésistibles. Ils sont intéressants mais pas vraiment excitants. La combinaison définit la scène pour le café ?, qui s’exécute bien à travers le parchemin de la page d’accueil.
Les tons
Les tons sont créés en combinant le blanc et le noir avec une couleur pour le rendre plus doux. La plupart des couleurs sont réellement créées à l'aide de tons. Ce sont des couleurs complexes qui ont un attrait presque universel car elles proviennent de plusieurs parties du spectre de couleurs. C’est cette qualité subtile qui fait de Tone le premier choix des concepteurs et des artistes pour la plupart des projets.
Les tons fonctionnent dans presque toutes les esthétiques de conception en raison de leur nature agréable.
L'arbre source utilise un vert pâle presque apaisant sur tout le site. Il est combiné avec d'autres éclairs de couleur tonique ainsi que pour les autres projets présentés. Ce qui est bien avec cette couleur, c'est que la tonification donne au site une atmosphère accueillante. Imaginez à quel point ce site serait différent s’il utilisait Emerald de la palette à plat ci-dessus à tous les endroits où la couleur utilisée est utilisée. La couleur laisse presque de la place aux petites cases et aux éléments animés, ce qui ne se produirait pas avec une aussi grande facilité visuelle si la couleur était nettement plus lumineuse.
L'Institut de la foi, du travail et de l'économie utilise des combinaisons de nuances de couleurs complexes pour déplacer les utilisateurs de l'image principale vers le bas à l'appel à l'action. La combinaison bleu foncé et jaunâtre est facile à lire, grâce à un contraste élevé, et visuellement intéressante, car les couleurs sont votre combinaison standard bleu / jaune.Les couleurs sont utilisées tout au long de la conception pour aider à définir la focalisation tout au long de la conception et à guider les utilisateurs vers des actions et des clics sur l’ensemble du site Web.
Conclusion
Lorsque vous passez aux couleurs traditionnelles du design plat, vous n’avez pas à choisir l’une des techniques de couleur décrites ci-dessus. Vous pouvez combiner des teintes, des nuances et des tons pour créer quelque chose de absolument attrayant et différent.
La véritable leçon à tirer de ces études de cas simples est la suivante: ne vous laissez pas prendre à utiliser une tendance? Selon le livre. " Détruisez-vous avec un type de technique différent pour personnaliser la tendance et l’utiliser. Ces exemples montrent à quel point il est merveilleux de ne changer que la palette de couleurs, tout en travaillant sur des dessins plats.