Pendant les mois d'hiver, il est facile d'obtenir les bleus et de laisser cela transparaître dans le travail de conception avec des palettes de couleurs plus sombres et une sensation de rythme plus lent pour les projets. Mais ce n'est pas la tendance actuelle des projets.

Les concepteurs adoptent de grands concepts audacieux avec des éléments surdimensionnés, des couleurs vives et même un peu de rupture de règles. (La meilleure partie? La plupart de ces tendances semblent se chevaucher quelque peu.) Voici les tendances en matière de conception ce mois-ci.

Accueil Headline Heroes

Les zones de héros de la page d'accueil passent à nouveau des entrées du site Web avec beaucoup de texte, de CTA et d'options pour les utilisateurs à des affichages simples avec de gros titres (et peut-être pas grand-chose d'autre).

L'utilisation de titres et d'éléments de texte surdimensionnés indique clairement dès le départ ce qu'est un site Web ou un design, mais ne donne pas beaucoup d'opportunités aux utilisateurs d'explorer sans faire défiler. Et ça pourrait aller. Grâce à la domination du mobile, les utilisateurs se sont habitués au scroll. Il peut même être en train de passer à la méthode préférée de digestion du contenu. (Encore plus que des clics ou des tapotements.)

Le défilement est rapide et permet aux utilisateurs de consulter le contenu et les informations avec peu de retard ou d'interaction.

Chacun des exemples de sites Web ci-dessous est conçu pour cela:

Le tableau blanc s'ouvre avec un grand titre qui englobe leur énoncé de vision et rien d'autre. En faisant défiler, vous avez accès à des projets et une plongée plus profonde dans les informations sur la marque.

tableau blanc "width =" 1856 "height =" 1280 "srcset =" http://www.guidsite.com/wp-content/uploads/2020/02/whiteboard.jpg 1856w, https://www.webdesignerdepot.com/ cdn-origin / uploads / 2020/02 / whiteboard-300x207.jpg 300w, https://www.webdesignerdepot.com/cdn-origin/uploads/2020/02/whiteboard-768x530.jpg 768w, https: // www. webdesignerdepot.com/cdn-origin/uploads/2020/02/whiteboard-1024x706.jpg 1024w "tailles =" (largeur max: 1856px) 100vw, 1856px "/></div>
<p>Les poèmes évidents ne défilent pas réellement, mais se déplacent dans des invites pour la convivialité. Il est enraciné dans la même zone de héros de titre de page d'accueil conçue pour vous attirer dans le contenu.</p>
<div class=poèmes "width =" 1856 "height =" 1280 "srcset =" http://www.guidsite.com/wp-content/uploads/2020/02/poems.jpg 1856w, https://www.webdesignerdepot.com/ cdn-origin / uploads / 2020/02 / poems-300x207.jpg 300w, https://www.webdesignerdepot.com/cdn-origin/uploads/2020/02/poems-768x530.jpg 768w, https: // www. webdesignerdepot.com/cdn-origin/uploads/2020/02/poems-1024x706.jpg 1024w "tailles =" (largeur max: 1856px) 100vw, 1856px "/></div>
<p>Illume a un contenu supplémentaire sous le parchemin sous un titre géant dans la zone des héros. Ce que cette conception fait différemment, c'est qu'elle inclut des images, bien qu'elle soit encore secondaire par rapport au texte en raison de la taille de la typographie.</p>
<div class=illume "width =" 1856 "height =" 1280 "srcset =" http://www.guidsite.com/wp-content/uploads/2020/02/illume.jpg 1856w, https://www.webdesignerdepot.com/ cdn-origin / uploads / 2020/02 / illume-300x207.jpg 300w, https://www.webdesignerdepot.com/cdn-origin/uploads/2020/02/illume-768x530.jpg 768w, https: // www. webdesignerdepot.com/cdn-origin/uploads/2020/02/illume-1024x706.jpg 1024w "tailles =" (largeur max: 1856px) 100vw, 1856px "/></div>
<p class=

Tons pêche

Battez le blues de l'hiver avec une dose de couleur printanière! Les tons pêche semblent être partout.

Bien que cette tendance puisse être une évolution à partir d'autres couleurs vives telles que les roses et les oranges qui ont été populaires, elle a beaucoup d'application pratique. Utilisez-le comme couleur dominante comme Grain & Mortar et Monokai, ou pour créer un accent comme le portefeuille de Kevin van der Wijst.

Les tons pêche offrent de nombreuses options et peuvent être plus rosés ou pousser vers l'orange. La couleur peut être très saturée ou assez pâle. La bonne chose à propos des tons pêche est qu'ils ne sont pas trop puissants et fonctionnent aussi bien que la couleur d'arrière-plan ou de premier plan. La pêche peut devenir un peu délicate lorsqu'elle est utilisée pour des éléments typographiques, selon le style de police et les éléments contrastés.

De plus grandes portions de pêche ont tendance à mieux résister à d'autres éléments que de minuscules. Notez que même en tant qu'accent dans le portefeuille présenté ci-dessous, les tons pêche englobent une partie importante de la toile. (Vous pouvez également cliquer et jouer avec ce design, qui comprend également une animation liquide cool. Vous pouvez même faire en sorte que la zone de pêche occupe la majeure partie de l'écran.)

gm "width =" 1856 "height =" 1280 "srcset =" http://www.guidsite.com/wp-content/uploads/2020/02/gm.jpg 1856w, https://www.webdesignerdepot.com/ cdn-origin / uploads / 2020/02 / gm-300x207.jpg 300w, https://www.webdesignerdepot.com/cdn-origin/uploads/2020/02/gm-768x530.jpg 768w, https: // www. webdesignerdepot.com/cdn-origin/uploads/2020/02/gm-1024x706.jpg 1024w "tailles =" (largeur max: 1856px) 100vw, 1856px "/></div>
<div class=japon "width =" 1856 "height =" 1280 "srcset =" http://www.guidsite.com/wp-content/uploads/2020/02/japan.jpg 1856w, https://www.webdesignerdepot.com/ cdn-origin / uploads / 2020/02 / japan-300x207.jpg 300w, https://www.webdesignerdepot.com/cdn-origin/uploads/2020/02/japan-768x530.jpg 768w, https: // www. webdesignerdepot.com/cdn-origin/uploads/2020/02/japan-1024x706.jpg 1024w "tailles =" (largeur max: 1856px) 100vw, 1856px "/></div>
<div class=kevin "width =" 1856 "height =" 1280 "srcset =" http://www.guidsite.com/wp-content/uploads/2020/02/kevin.jpg 1856w, https://www.webdesignerdepot.com/ cdn-origin / uploads / 2020/02 / kevin-300x207.jpg 300w, https://www.webdesignerdepot.com/cdn-origin/uploads/2020/02/kevin-768x530.jpg 768w, https: // www. webdesignerdepot.com/cdn-origin/uploads/2020/02/kevin-1024x706.jpg 1024w "tailles =" (largeur max: 1856px) 100vw, 1856px "/></div>
<p class=

Polices de contour

Cette tendance est en train d'exploser, des petits projets aux grandes marques. Les polices de contour sont un gros problème. C’est l’une de ces tendances que vous secoueriez la tête et diriez «pas moyen» si vous ne le voyiez pas en action… et si bien utilisé.

Les polices de contour peuvent être un défi. Ils créent un effet qui est presque le contraire de la typographie surdimensionnée dans une autre tendance mentionnée ici. Mais ils créent un effet accrocheur qui vous attire dans les mots à l'écran.

Les polices de contour sont presque toujours associées à la même police remplie. Il crée un effet yin et yang qui peut aider les utilisateurs à lire plus longtemps et à interagir avec le contenu. Le contraste entre et le contour et la police remplie mettent également l'accent sur l'élément plus audacieux de la paire de lettres.

L'astuce pour le faire fonctionner n'est pas de devenir trop fou avec la conception et les polices de contour de conception afin qu'il y ait beaucoup de contraste pour que les lettres restent lisibles.

Fitlab est le plus actif des exemples de cette tendance avec une utilisation multiple des polices de contour et même un rouleau vidéo à déplacement rapide. Mettez tout cela ensemble et l'accent est mis sur la formation «personnelle». Ça marche.

fitlab "width =" 1856 "height =" 1280 "srcset =" http://www.guidsite.com/wp-content/uploads/2020/02/fitlab.jpg 1856w, https://www.webdesignerdepot.com/ cdn-origin / uploads / 2020/02 / fitlab-300x207.jpg 300w, https://www.webdesignerdepot.com/cdn-origin/uploads/2020/02/fitlab-768x530.jpg 768w, https: // www. webdesignerdepot.com/cdn-origin/uploads/2020/02/fitlab-1024x706.jpg 1024w "tailles =" (largeur max: 1856px) 100vw, 1856px "/></div>
<p>Chilly Source utilise une police de contour pour son nom de marque afin que vous obteniez une autre introduction sans trop de marque sur votre visage. (Le nom est mentionné trois fois sur la page d'accueil.)</p>
<div class=frisquet "width =" 1856 "height =" 1280 "srcset =" http://www.guidsite.com/wp-content/uploads/2020/02/chilly.jpg 1856w, https://www.webdesignerdepot.com/ cdn-origin / uploads / 2020/02 / chilly-300x207.jpg 300w, https://www.webdesignerdepot.com/cdn-origin/uploads/2020/02/chilly-768x530.jpg 768w, https: // www. webdesignerdepot.com/cdn-origin/uploads/2020/02/chilly-1024x706.jpg 1024w "tailles =" (largeur max: 1856px) 100vw, 1856px "/></div>
<p>Vitesse Trucking utilise un texte de contour pour vous dire ce qu'il fait tout au long de la conception. Le texte est une information mais sert également d'élément artistique avec mouvement dans la conception de défilement de style parallaxe. Les éléments de type contour reflètent les mots remplis plus petits et incluent même des couches et des superpositions pour garder les yeux en mouvement. C'est une utilisation intéressante de cette tendance dans une industrie où vous ne vous y attendez peut-être pas.</p>
<div class=camion "width =" 1856 "height =" 1280 "srcset =" http://www.guidsite.com/wp-content/uploads/2020/02/truck.jpg 1856w, https://www.webdesignerdepot.com/ cdn-origin / uploads / 2020/02 / truck-300x207.jpg 300w, https://www.webdesignerdepot.com/cdn-origin/uploads/2020/02/truck-768x530.jpg 768w, https: // www. webdesignerdepot.com/cdn-origin/uploads/2020/02/truck-1024x706.jpg 1024w "tailles =" (largeur max: 1856px) 100vw, 1856px "/></div>
<p class=

Conclusion

Je serai le premier à l'admettre, vous ne me trouverez probablement pas en train de concevoir avec beaucoup de coloris pêche. Bien que cela fonctionne pour ces projets, ce n'est pas un de mes favoris.

D'un autre côté, j'adore toutes les options de police de contour. C'est génial et donne de la profondeur aux éléments de texte que nous n'avons pas beaucoup vus. Et vous? Quelles tendances de conception pouvez-vous vous voir utiliser dans les mois à venir?