Les bandes sont un ajout amusant qui peut ajouter un intérêt visuel et de la profondeur à la conception de projets de différentes façons. Mais les rayures ne sont pas que les motifs nautiques bleus et blancs que vous pourriez envisager.
Les rayures peuvent prendre plusieurs formes. Verticaux ou horizontaux, des motifs classiques aux bordés de grille et aux composants d’image, les rayures sont une excellente option de conception. Voici quelques façons de les utiliser auxquelles vous n’auriez peut-être pas pensé.
Rayures traditionnelles
Lorsque vous pensez pour la première fois aux rayures dans le design, vous pouvez penser à l’idée de la tradition. Rayures nautiques bleues ou rouges et blanches. Les barres rouges et blanches sur le drapeau américain. Les chaussettes amusantes portées par Raggedy Ann ou Pippi Longstockings. Mais les rayures sont tellement plus polyvalentes que ces motifs traditionnels. Ils peuvent être utilisés de différentes manières.
Mais nous allons jeter un coup d'œil à un usage traditionnel: le site ci-dessus utilise un poteau à rayures de style salon de coiffure comme petit accent dans la conception du site. Ce look traditionnel est un excellent moyen d'attirer l'attention sur une certaine partie de la conception et de créer une emphase.
Design classique
Les rayures peuvent aider à donner le ton avec une apparence classique. Ajoutez de la texture ou créez des bandes dans une conception basée sur une grille pour mettre en valeur ce concept.
Lorsqu'il s'agit de visions classiques de rayures dans le design, la couleur est également un facteur important. Considérez certaines des utilisations classiques des bandes et des couleurs, telles que les uniformes noirs et blancs pour les prisonniers. (Utilisez cette combinaison pour un look minimaliste ou plus sombre.) Des rayures rouges ou bleues pour une sensation traditionnelle ou old school.
Les textures peuvent également créer une emphase pour les rayures en les mettant plus au premier plan. Bien que les rayures soient souvent utilisées dans les arrière-plans - souvent avec peu de contraste dans les couleurs pâles - pour une "texture invisible". de plus grandes rayures avec la texture peuvent être un point focal. L'astuce consiste à garder les textures simples et en ligne avec les autres visuels de la conception.
Les textures à rayures peuvent également vous aider à créer? Plus léger? lignes afin qu'elles ne semblent pas lourdes et alourdissent la conception, même lorsqu'elles sont utilisées avec une couleur vive ou éclatante. Orchard Keepers, ci-dessus, utilise la texture de cette manière pour créer une impression de temps avec une "vieille sensation".
Rayures modernes
Dans la conception de sites Web, les bandes sont utilisées pour aider à créer la focalisation, à diriger la navigation et à aider les utilisateurs à trouver et à se concentrer sur les appels à l'action. La paire de sites ci-dessus utilise les bandes de différentes manières pour faciliter la convivialité.
Industry West utilise une bande horizontale épaisse pour contenir la navigation. En raison du contraste de la bande par rapport aux images d'arrière-plan, elle sert de point de référence statique. La barre large à contraste élevé facilite la lecture des boutons de navigation et la navigation dans le site.
La reconstruction ensemble utilise une fine bande en haut du dessin pour créer un flux de couleurs sur la page. La bande orange (ou le trait orange) aide à tirer l'œil du haut vers le bas de la page, l'utilisateur s'arrêtant alors sur les boutons d'accent orange. La conception intelligente aide les utilisateurs à dire quoi faire (cliquez sur les boutons orange).
Rayures de fond
Les bandes de fond peuvent être plus qu'une simple série de lignes horizontales ou verticales espacées dans un motif. Les rayures peuvent être créées à l'aide d'une série d'autres formes ou même avec un aspect plus aléatoire ou naturel.
Pastaria utilise une série amusante de formes rondes pour créer un motif à rayures dans le fond de la page. Selon votre perspective, le motif peut apparaître vertical ou horizontal. L'astuce pour que cela fonctionne si bien est que le motif crée de l'intérêt et de la profondeur sans être le visuel dominant.
À l’inverse, Night Owl Interactive utilise un motif à rayures naturelles (grain de bois) pour la texture et la profondeur. Ce qui est bien avec ce style à rayures naturelles, c'est qu'il a un aspect aléatoire.
Rayures en images
Bien que vous créiez souvent des motifs en bandes, ils peuvent également faire partie des images que vous sélectionnez pour la page. Que vous envisagiez d'inclure des bandes dans une image dans le cadre de la conception ou qu'elles se produisent par hasard, elles peuvent ajouter un intérêt et une profondeur instantanés.
Les deux exemples ci-dessus incluent des textures de grain de bois pour établir des motifs et des rayures dans les images principales. Les lignes ne sont pas différentes, elles vous aident à regarder et la profondeur supplémentaire qu'elles apportent à la conception globale.
Couleur et motif
L’une des utilisations les plus en vogue consiste à associer des bandes de couleur larges et / ou fines à un motif de blocage des couleurs. En tant que technique de conception pour le numérique, l’impression, la mode et l’intérieur, le blocage de couleurs ajoute immédiatement une emphase.
Les rayures colorées peuvent être un excellent outil pour ajouter des couleurs de marque à un design lourd ou minimaliste. La couleur crée un contraste et une accentuation dans les endroits où elle fait défaut et l’effet général a un aspect moderne. (Ceci est une excellente option si vous voulez essayer un concept branché qui n’est pas trop difficile et qui a un look plus intemporel.)
Mini rayures
Dans les exemples ci-dessus, la plupart des rayures sont grandes et faciles à repérer, mais elles peuvent aussi être de petites coupes ou des accents.
L'un des plus petits exemples de rayures est l'icône de hamburger. Trois petites lignes empilées. C'est tout. Mais c'est un exemple d'utilisation de bandes au plus petit niveau.
La conception du site Web Day of the Dead utilise des rayures comme détail d'accent, ce qui présente également un grand intérêt visuel. Presque retombant dans l’arrière-plan, une paire de rayures complexes entoure le texte et aide à attirer l’œil. Les lignes et les bandes suivantes avec couleur aident à créer un flux dans le défilement de la page d'accueil.
Conclusion
Une dernière pensée pour vous. Bien que l’idée des rayures évoque souvent une image mentale de rangées ou de colonnes, la rayure peut également être utilisée sous une forme singulière. La plupart des exemples ci-dessus incluent des bandes d'une manière qui ne soit pas la première image mentale que vous puissiez avoir, mais chacune est intéressante et permet de créer un visuel puissant.
Pensez à utiliser des bandes de manière légèrement différente pour un impact maximal. Jouez avec la couleur, la texture, la forme et la taille. Expérimentez avec des rayures comme vous le feriez avant d'essayer un autre outil de conception et amusez-vous!
Source de l'image: Bill Lapp.