Couleur bichromie: conseils et exemples pour cette tendance dynamique
La prochaine grande tendance d'image de conception Web est là, et elle est vibrante, colorée et belle!
Grâce à Spotify, la bichromie gagne en popularité presque quotidiennement. L'effet, qui utilise une paire de couleurs sur une photo, est saisissant, amusant et dynamique. C'est aussi très tendance, avec de nouveaux sites qui changent presque quotidiennement en format bichromie. Voici quelques façons de tirer le meilleur parti de cette technique de conception à chaud.
Qu'est-ce que Duotone?
Tout d'abord, un petit apprêt: Duotone est l'utilisation de deux couleurs.
Le nom et la technique proviennent des presses à imprimer. Les impressions bichromie sont réalisées en deux teintes de la même couleur ou avec du noir et une teinte. Le processus utilise deux plaques de couleur faites avec l'écran réglé à des angles différents.
Le concept bicolore est grand. Pantone a nommé une paire comme Couleur de l'année, le minimalisme a fait penser aux concepteurs que les palettes limitées et les bichromies sont visuellement intéressantes et assez faciles à créer. Vous pouvez créer l'effet à l'aide d'Adobe Photoshop et d'un dégradé bicolore ou d'un outil tel que Colofilter.css pour l'appliquer dans le code.
Mais ce qui a probablement le plus aidé à botter le sol, c'est l'utilisation par Spotify. Les schémas de couleurs Duotone sont utilisés dans l'application de lecture de musique et pour divers micro-sites promotionnels. Duotone ajoute un élément de design unique aux images d'artistes bien connus et largement utilisés.
La technique qui était autrefois un aliment de base imprimé a trouvé une nouvelle vie en ligne, et c'est une tendance que nous verrons probablement beaucoup plus dans les mois à venir.
Comme une image dominante
Utilisez la bichromie pour créer une image dominante.
Le visuel principal du New Deal Design est frappant grâce à un choix de couleurs audacieux et original, grâce à l'imagerie et à la couleur amusantes. N'ayez pas peur de sortir de votre confort quand il s'agit de travailler avec des images bicolores; il est possible d'associer des teintes qui pourraient ne pas correspondre. Le but est de créer un visuel qui demande de l'attention et inclut beaucoup de contraste pour que l'image soit visible.
Voici quelques conseils pour un impact maximal:
- Choisissez deux couleurs contrastées ou associez les couleurs de la marque.
- Sélectionnez une photo avec une zone d'image mise au point. Un paysage peut être difficile à utiliser.
- Commencez avec une image de haute qualité. Les images floues ou médiocres et le bichromie ne se mélangent pas.
- Jouez le contraste.
- Considérez les espaces pour les boutons ou la typographie.
- Choisissez des couleurs qui reflètent l'ambiance de la photo.
- Définissez une image bichromie avec une bordure colorée ou mélangez et assortissez les options de couleur avec un curseur de défilement ou des effets de parallaxe.
Comme une palette de couleurs simple
La bichromie n'a pas à être compliquée. Parfois, les projets bicolores les plus frappants sont de nature simple.
L'assurance-vie utilise une paire de rouges et une typographie propre. Le parchemin comprend également un style plus tramé. Les couleurs sont vives et engageantes. Le rouge est le type de couleur qui fait presque regarder les utilisateurs.
L'astuce ici est qu'elle est juste assez simple pour être efficace. L'utilisateur n'est pas submergé d'éléments. Le rouge vous attire afin que les mots à l'écran deviennent le focus. Ce type d'effet bichromie est presque fait pour les sites Web qui ont une apparence et une sensation plus formelles car il permet d'utiliser une tendance sans se sentir forcé ou écrasant.
Pour augmenter la lisibilité
Utilisez la bichromie pour agir comme un stabilisateur de couleur qui donne au texte beaucoup d'espace et de contraste. Une superposition de couleurs bicolore peut aider à «aplatir» les variations de couleur dans une image afin que le texte puisse être placé en utilisant une seule couleur presque n'importe où sur l'image et toujours lisible.
Les choix de couleurs bichromiques ne seront pas aussi brillants pour cette utilisation et apparaîtront probablement plus sourds, mais peuvent servir un excellent objectif. Holm Marcher & Co. fait cela avec un bichromie corail et bleu qui est intéressant et crée une toile de fond très lisible pour le lettrage. En prime, les éléments de navigation utilisent des nuances de bleu de la palette de couleurs pour encourager le déplacement sur le site.
Comme un accent
Bien que les effets bichromes se prêtent à de grandes images, ils peuvent également fonctionner dans des endroits plus petits. Considérez un accent bicolore dans la navigation, pour les images secondaires ou pour des types de contenu spécifiques.
Ce qui est bien avec les petites zones de bichromie, c'est que vous avez un peu plus de liberté de jeu si vous êtes intimidé par la technique ou si vous ne savez pas trop comment la faire fonctionner pour vous. Lorsqu'il est utilisé dans des espaces plus petits, il peut être visuellement intéressant de jouer avec plusieurs paires de couleurs pour différents éléments de la conception.
Considérez les éléments bichromes pour les éléments de style de carte, comme une superposition pour les liens pour la vidéo ou pour souligner les appels à l'action. Les accents bichromiques peuvent également être des outils efficaces à utiliser dans une palette de couleurs minimale ou en noir et blanc en raison du contraste de couleur qu'ils créent.
Comme arrière-plan
Rien de tel qu'un subtil effet bichromie pour créer une image ou un motif d'arrière-plan intéressant. C'est une utilisation idéale pour les couleurs de marque ou comme un moyen d'incorporer une teinte ou une technique à la mode dans votre conception sans une refonte à grande échelle.
Le fond bicolore gradué pour Join Radio est la perfection. Le changement de couleur est presque imperceptible et se fond parfaitement avec les autres éléments de l'interface utilisateur de la conception. Il y a une animation simple se déplaçant à travers les couleurs qui est apaisante et a un mouvement semblable à de l'eau. Le passage de la lumière à l'obscurité suit des yeux naturels et des modèles de lecture qui se déplacent du haut à gauche de la page d'accueil vers le bas à droite, où l'utilisateur est davantage encouragé à faire défiler et cliquer.
Conclusion
Il est difficile de trouver une technique de conception plus amusante à jouer que la couleur. Les bichromies sont également attrayantes pour les concepteurs. L'effet peut pimenter une image surutilisée, ajouter un élément amusant quand il en manque et simplement aider à engager visuellement les utilisateurs.
De plus, vous le concepteur pouvez vraiment expérimenter lorsque vous utilisez des effets bichromes. Vous pouvez associer des couleurs que vous n'auriez pas imaginées pour un impact majeur ou combiner des couleurs avec des variations subtiles pour un petit élément de surprise. Quoi qu'il en soit, la création de cet effet de couleur semble presque toujours personnalisée et peut être amusante à travailler.