Catégories
Plugin et site web

3 tendances essentielles du design, septembre 2020

Un changement saisonnier se profile à l'horizon et cela me fait toujours chercher à rafraîchir les projets. Les tendances en matière de design de ce mois-ci proposent différentes manières de le faire sans déchirer l'intégralité de votre site Web.

Voici les tendances en matière de design ce mois-ci.

Héros animés (qui ne sont pas des vidéos)

Les en-têtes et les écrans de héros qui présentent une animation vidéo sont populaires depuis un certain temps, mais de plus en plus de concepteurs de sites Web expérimentent d'autres types de graphiques en mouvement plein écran.

Ce qui est cool avec cette tendance, c'est qu'elle peut prendre de nombreuses formes différentes et se présenter de différentes manières, ce qui signifie qu'aucun site Web n'est identique à cet égard.

L'autre avantage de cette tendance est que vous pouvez ajouter une animation plein écran à presque tous les styles de design sans une refonte complète du site Web. Vous aurez peut-être besoin de quelques petites modifications pour créer une transition transparente d'un écran à l'autre, mais il s'agit d'un élément de conception rapide et moderne que vous pouvez déployer assez rapidement.

Typozon utilise un graphique en mouvement rapide avec de nombreuses marques de marque différentes pour raconter l'histoire de leur travail d'identité de marque. Certes, l'animation peut devenir un peu vertigineuse si vous la regardez trop longtemps, mais les couleurs vives sur le fond olive attirent certainement l'attention.

Day 1 Club by Spotify s'ouvre avec beaucoup de mouvement dans la configuration, puis s'installe dans un mouvement subtil derrière l'appel à l'action principal. Les nuances de noir et de mouvement doux rassemblent tout et vous aident à vous concentrer sur le bouton rouge vif et la superposition de texte.

Kieran Baybutt utilise plusieurs animations pour ce site Web de portefeuille. Le plus intéressant pourrait être sur le «deuxième écran». Il se passe plusieurs choses ici. Les mots changent avec les mouvements de la souris, tout comme l'image d'arrière-plan. Il existe également un pointeur de survol sympa avec des éléments de portefeuille en mouvement constant. Il se passe beaucoup de choses ici, mais cela donne envie de cliquer.

Cercles animés ou flottants

Les cercles pourraient être l'une des tendances de conception les plus en vogue de 2020. Ils sont dans toutes sortes de projets et continuent d'évoluer de différentes manières.

Cela tient peut-être en partie au message que les concepteurs essaient de transmettre dans ces projets. Les cercles sont associés à l'harmonie et à la protection. Ils sont utilisés pour représenter l'unité, la communauté et l'engagement. En mouvement, les cercles peuvent également susciter des sensations de mouvement ou de mouvement, la vitesse déterminant à quel point ce mouvement peut être chaotique (ou non).

L'itération des tendances des cercles de ce mois-ci est animée. Certains cercles s'animent sur place, tandis que d'autres semblent flotter dans l'espace sur la toile.

Les cercles de chaque exemple ont cependant quelque chose en commun: ils vous amènent à la conception et encouragent l'interaction avec elle. (C'est peut-être pourquoi cette tendance de conception de site Web gagne en popularité tout le temps.)

Le mouvement circulaire du logo UX + aide en fait à détourner le regard de toute l'animation presque écrasante sur le côté gauche de la conception en écran partagé. Avec beaucoup d'espace blanc qui l'entoure, le mouvement constant est juste suffisant pour attirer l'attention sur le logo, puis sur l'écran vers des informations importantes sur l'événement.

Katch Me utilise des cercles qui semblent flotter sur la vidéo d'arrière-plan avec un «rebond» doux en place. L'animation change lorsque la souris survole chaque cercle avec une action développée et la possibilité de déplacer le cercle dans un espace plus grand. Les cercles ici sont en fait les boutons d'appel à l'action.

Visuellement, les cercles du site Web d'Anastasiia Afanasieva ressemblent à un mashup des exemples ci-dessus. Il existe une animation de rotation pour les cercles qui semblent flotter dans l'espace. Vous devez cliquer sur cette conception pour voir la vraie brillance qu'elle contient. Chaque cercle a un état de survol qui modifie la couleur d'arrière-plan du site Web (et des images dans chaque boîte) pour correspondre à la couleur affichée.

Coloration jaune vif

Une autre tendance de conception de site Web qui pourrait refléter l'état du monde est l'utilisation de la couleur jaune. Avec une pandémie de santé mondiale, les projets de conception se tournent vers des tons plus vifs et plus gais pour aider à compenser le stress du monde.

Pour beaucoup, le jaune peut briller un peu d'espoir et d'optimisme dans des temps plus sombres.

Alors que la plupart des projets utilisent le jaune vif comme accent accrocheur, d'autres vont à fond.

Next Big Thing AG utilise des images jaunes à l'intérieur d'un lettrage découpé surdimensionné (une autre tendance de conception de site Web cette année) sur un fond sombre. Même avec la palette globale plus sombre, le design est lumineux et séduisant. Vous avez presque envie de plonger plus profondément dans la conception pour voir ce qu'est l'image derrière les lettres et ce que contient le site.

Sonya Mudvex utilise un fond jaune complet sur la page d'accueil de son portfolio pour arrêter les visiteurs dans leur élan. Le reste du design présente un fond gris doux et de nombreux accents jaunes. En plus de la grande utilisation de la couleur ici, il existe de nombreuses autres astuces UX dans cette conception, y compris des outils de géolocalisation si vous interagissez avec le graphique de validation de ticket à l'écran.

Upqode utilise du jaune avec une palette de couleurs pêche pour se démarquer. Les animations illustrées sont beaucoup plus vivantes grâce à des couleurs vives. La palette de couleurs globale est un peu inattendue, et c’est ce qui la rend intéressante.

Conclusion

Si les tendances de conception de sites Web de ce mois-ci vous disent quelque chose, c'est que les éléments interactifs et l'animation occupent une place croissante dans la conversation. Utilisez-vous déjà ces techniques dans des projets? (Sinon, il est probablement temps d'y réfléchir.)

Vous pouvez également voir comment l'influence de ce qui se passe dans le monde qui nous entoure a également un impact sur la conception. Cela peut contrer d'autres émotions pour créer un meilleur espace mental ou refléter ce qui se passe dans le monde qui nous entoure.

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *