3 tendances de conception essentielles, juin 2017
Parfois, un simple ajustement de conception peut déplacer la conception de votre site Web d'ordinaire à tendance. Chacune des tendances de ce mois-ci est ce type de technique, de la minuscule typographie aux caractéristiques géométriques en passant par les images floues. Chacune de ces techniques peut fonctionner dans un nouveau projet de conception ou dans un ajustement à une conception existante.
Voici ce qui est tendance dans la conception ce mois-ci:
1. Texte "minuscule"
La typographie surdimensionnée semble-t-elle une chose du passé? Un texte plus petit, presque «minuscule» a commencé à remplacer les gros en-têtes audacieux qui ont été un élément de base de la conception de sites Web pendant un certain temps. Des titres plus petits au texte du corps qui semble rare, il y a eu une tendance nette dans la réduction des effectifs de la typographie.
Bien qu'il puisse y avoir des problèmes de lisibilité en ce qui concerne les petites tailles de texte, en particulier pour le texte du corps, les polices plus petites ne sont pas une mauvaise chose. La typographie surdimensionnée avait presque commencé à évoluer vers la couleur criarde avec des tailles et des caractères presque trop gros pour être lisibles.
Les polices plus petites se sentent un peu plus souples et donnent au design plus d’espace pour que d’autres éléments puissent se déplacer. L'astuce pour l'efficacité avec un petit type est de réduire au minimum le lettrage. Sans trop lire, cette tendance peut être efficace et intéressante. D'un autre côté, les gros blocs de type minuscule sont perdus et peuvent empêcher l'utilisateur de lire facilement et de numériser efficacement.
L'équilibre est également une préoccupation. Toutes les polices doivent réduire quelque peu pour créer une belle harmonie. Moonfarmer utilise une police de caractères légère pour le traitement du logotype et une petite ligne de copie secondaire. Les éléments de type contrastent joliment et le traitement de type léger semble correspondre à l'ambiance de l'image.
Burger HTML adopte presque l'approche opposée avec un titre en gras et de petites lignes de texte secondaires. Les mots descriptifs plus légers fonctionnent peu car ils sont des mots courants - HTML, CSS, e-commerce - et contrastent de manière significative avec le titre encore surdimensionné.
Conception NBA de Mountain Dew pousse tout à petite échelle. Il s’agit de l’un des plus petits traitements que vous trouverez probablement, mais combiné au fond d’écran et à l’arrière-plan vidéo trop gras, les utilisateurs sont toujours attirés par le minuscule texte.
2. superposition géométrique
La nouvelle façon de superposer des éléments ne cesse de gagner en popularité. Révélé pour la première fois en tant que technique de design classique et moderne selon l’idée de Google Material Design, la superposition géométrique est une manière différente d’ajouter un intérêt visuel aux éléments visuels qui pourraient laisser à désirer.
Chacun des exemples ci-dessous utilise un cadre avec des formes audacieuses pour donner une nouvelle vie à des images quelque peu simples - des bâtiments, une photo de réunion, des images de personnes qui travaillent. L'ajout de formes amusantes, de découpes et de couleurs donne à l'utilisateur un point de départ pour entrer dans la conception. Notez comment chaque conception utilise la géométrie pour déplacer efficacement l'utilisateur d'une forme au contenu le plus pertinent, tel qu'un titre ou une image de marque.
La géométrie peut être utilisée de plusieurs manières, qui s'intègrent au reste de la conception:
- couper en images pour mettre en évidence des éléments de test importants comme Projets de sel ;
- utiliser un élément de bordure brillant inattendu pour créer un point focal hors bilan qui conduit les utilisateurs à travers l'écran tels que Bailey et français ;
- mettre des photos dans des formes inhabituelles pour donner un nouvel accent sur les images, comme Alchemy Digital .
La meilleure partie de l’utilisation de la superposition géométrique est qu’elle est simple et fonctionne à peu près avec tout type de contenu. Les utilisateurs s'habituent aux boutons circulaires et à d'autres éléments placés les uns sur les autres pour créer une sensation interactive multi-plan et plus tactile.
Les angles et les courbes des éléments géométriques peuvent aider les utilisateurs à passer d’un élément à l’autre et, s’ils sont utilisés de manière efficace, ils constituent un excellent outil directionnel. Positionnez les angles de manière à ce qu'ils "pointent" vers le contenu que vous souhaitez que les utilisateurs voient et utilisent des cercles pour le contenu à afficher en premier.
3. Imagerie floue
L'imagerie floue est une technique qui n'est pas nouvelle. Mais il semble y avoir une nouvelle vie avec plus de modèles comportant des images ou des vidéos floues, totalement ou partiellement.
Une image floue peut créer une impression distincte pour un site Web comportant un élément de mystère ou aider à repousser les limites de l'image vers une autre partie du design. Chacun des exemples ci-dessous utilise le flou pour différentes raisons:
- Digitalux prend un morceau ennuyeux de vidéastes travaillant dans un bureau et utilise le bleu pour ajouter un peu de mouvement au message principal et à l'appel à l'action;
- Playkot utilise un arrière-plan flou pour mettre l'accent sur le caractère amusant et le traitement typographique intéressant au premier plan, ajoutant un élément de réalité à cette aventure de jeu de style ville virtuelle;
- ESPN "We the Fans" comporte un décor flou de style stade qui serait presque une arène de football pour présenter l’aperçu d’un documentaire télévisé; la toile de fond floue permet de mettre davantage l'accent sur le traitement de type amusant qui est la principale marque de la série.
Conclusion
Parfois, les plus grandes tendances marquent les évolutions des autres tendances. Il peut être intéressant de voir le progrès en petit pas presque comme cela se produit. C'est ce que vous avez tendance à observer lorsque vous examinez des éléments de tendance qui peuvent être appliqués à presque tous les projets, tels que les trois tendances présentées ici.
La bonne chose à propos de ces idées est qu'elles sont applicables à presque toutes les échelles. Vous pouvez par exemple ajouter un petit texte à votre page d'accueil, par exemple, et voir l'impact du changement sur les utilisateurs avant de le déployer à plus grande échelle. Des essais et des tests à ce niveau aideront à prédire si une tendance comme celle-ci restera stable ou s’atténuera rapidement.
Quelles tendances aimez-vous (ou détestez-vous) en ce moment? J'adorerais voir certains des sites Web qui vous intéressent. Laisse moi un lien sur Twitter ; J'adorerais avoir de vos nouvelles.