Les tendances UI/DA fin 2020
Avec la révolution des nouvelles technologies et l’utilisation croissante des supports interactifs digitaux (smartphone, tablette…), l’expérience utilisateur (UX) s’impose comme une priorité dans tout processus de conception de produits ou services digitaux.
Dans ce sens, la Direction Artistique (DA) permet d’affiner les choix ergonomiques, de fournir une UX mémorable et d’optimiser le taux de conversion.
Cela s’applique aussi aux optimisations qu’elle doit réaliser pour offrir une interface utilisateur (UI) qui répond aux critères de l’utilisabilité : efficacité, efficience et satisfaction.
Dans cet article, nous allons mettre en lumière les dernières tendances en DA / UI, qui permettent de valoriser la dimension humaine dans une UX et d’offrir une expérience plus agréable à l’utilisateur.
Humanisation des interfaces
Malgré le confort et la valeur ajoutée qu’offre une bonne expérience utilisateur, ce dernier a besoin de renouer parfois avec l’humain, durant son parcours UX, afin d’être rassuré et confiant envers la marque. Dans cette optique, le design émotionnel représente un fort levier d’acquisition qui permet de créer une agréable UX associée aux émotions de l’usager. Ce type d’expérience est plus mémorable par rapport aux autres, puisqu’il fournit une interaction originale et personnalisée.
Le design émotionnel dépasse la valeur d’une simple conception graphique pour provoquer les émotions et l’empathie de l’utilisateur. A cet effet, il utilise certaines techniques ludiques, comme :
- le recours aux commentaires informatifs pour guider l’utilisateur dans son parcours UX, comme la technique du simili chat qui permet de remplir un formulaire sur le ton de la conversation.
- Intervenir lors du parcours UX pour créer des relations personnalisées avec les utilisateurs cibles
- L’UX writing : c’est l’art de composer des mots ou des phrases afin d’offrir aux utilisateurs une navigation plus fluide et plus agréable.
Voir ce que pense Don Norman du design émotionnel :
Le néomorphisme (Neumorphism)
Le néomorphisme (ou néo-skeuomorphisme : combinaison entre les mots : nouveau et skeuomorphisme) est une évolution du style skeuomorphisme, qui repense les objets réels sous forme graphique. Il combine les aspects du Flat design et du skeuomorphisme.
Le néomorphisme fournit une interface minimaliste et épurée qui donne au design un effet plus réaliste et plus profond, tout en utilisant les ombres, les dégradés, les reflets. Il se repose sur le concept de superposition des éléments, dont la forme est presque 3D. La couleur d’un élément est identique ou légèrement différente de celle de l’arrière-plan. Tout cela permet d’obtenir un aspect plastique sobre et souple.
Cette tendance de conception accentue la convivialité, l’accessibilité et la praticité de l’interface, ce qui offre une expérience utilisateur plus agréable.
En voici un exemple d’une interface neumorphique by Samson Vowles sur Dribble :
Flat design
Le Flat design, ou design plat, est un style de conception d’interface utilisateur qui utilise des éléments aux formes simples ou bidimensionnelles et des couleurs vives. Il s’oppose au style skeuomorphe qui donne l’illusion de trois dimensions.
Le Flat Design s’inspire beaucoup du design minimaliste. Notamment, il évite les dégradés, les effets 3D et les ombres et se concentre plutôt sur une expérience utilisateur plus souple, avec l’utilisation d’éléments plats au design simple et des couleurs cohérentes.
Le but du design plat est d’alléger le poids de l’interface et de la rendre plus rapide en temps de chargement. Ce design permet aussi de transmettre un message clair et lisible à l’utilisateur. Notamment, une icône Flat design est très pratique, elle indique à l’utilisateur, d’une manière très explicite, la fonction qu’elle va accomplir lorsqu’il interagit avec elle.
Ce style de conception garantit de produire des interfaces plus réactives et plus intuitives. C’est la clé pour stimuler le bonheur des utilisateurs et leur fournir une expérience utilisateur formidable.
Les principaux avantages du Flat Design résident dans son esthétique, la simplicité de sa mise en œuvre et l’efficacité du responsive design.
En voici une interface mobile avec un design plat ( Flat Design); réalisée par Outcrowd
Les micro interactions
La micro-interaction est un modèle d’interaction basé sur des animations interactives, afin de magnifier le parcours de l’utilisateur lors de son interaction avec le produit et de collecter des retours d’expérience, d’une façon souple.
Les animations interactives permettent de donner une dimension plus humaine aux interfaces, de guider l’utilisateur dans sa navigation et de fluidifier son interaction avec l’interface.
Le processus d’une micro-interaction se compose de 4 éléments:
- Déclencheur : c’est l’élément visuel ou l’animation qui déclenche l’action.
- Règles : ce sont les paramètres appliqués dans une micro-interaction.
- Feedback : c’est le retour de l’utilisateur en réalisant une micro-interaction.
- Boucles et modes : définissent la manière de réutilisation d’une micro-interaction. Cela concerne, par exemple, son fonctionnement et sa durée.
Les micro-interactions représentent de véritables instants alléchants qui stimulent une sensation de bien-être chez l’utilisateur et augmentent sa satisfaction. Même s’il s’agit de petites animations, ces dernières peuvent avoir un impact positif sur l’UX globale, améliorer la compréhension et générer de bons échos sur le produit de l’entreprise.
Voici un exemple d’une micro-interaction correspondant à une application mobile de vente ( by Mauricio Bucardo sur Dribble) :
Les illustrations 3D
Les illustrations 3D sont intégrées dans divers domaines : les jeux vidéos, les publicités, les sites et les applications web. Le rendu 3D permet de créer des interfaces modernes et interactives qui intègrent des éléments 3D surprenants. Cela permet de mettre en évidence le produit et de renforcer l’intérêt de l’utilisateur envers la marque.
En 2020, plus de marques tendent à présenter leurs produits en utilisant les graphiques 3D (notamment les présentations à 360 degrés), afin d’imiter le processus d’achat dans le monde réel et créer une UX plus réaliste et au même temps divertissante.
Illustration 3D by Vago sur Dribble
Asymmetrical layout
La mise en page asymétrique (Asymmetrical layout) est une nouvelle tendance dans le monde de la conception d’interface utilisateur, qui tend vers une mise en page plus dynamique. Elle consiste à remplacer le système de grille standard, qui est basé sur un axe ou un point de référence, par des dispositions asymétriques avec des éléments distribués de manière inégale et en éliminant complètement les marges (ou en réduisant significativement leur espacement).
Afin d’offrir une navigation plus intuitive à l’utilisateur, le concept de l’Asymmetrical layout consiste à profiter de la disponibilité des espaces blancs pour afficher des informations utiles. De ce fait, cette technique permet d’optimiser l’organisation des éléments sur l’interface et d’éviter le gaspillage d’espace sur la page web. Ce qui est susceptible d’améliorer le temps de chargement de la page et sa réactivité.
La mise en page asymétrique permet d’apporter un contraste différent et inhabituel qui suscite l’intérêt de l’utilisateur et permet d’améliorer le taux de conversion.
Illustration by Zhenya Rynzhuk sur Dribble
Le design minimaliste : “less is more”
Le design minimaliste est l’art de faire plus avec moins d’effort. Il peut être décrit comme un style “élégamment simplifié”. Cet art visuel vise à transmettre le message à l’utilisateur de la façon la plus concise et la plus simple possible. A cet effet, il emploie une conception dépourvue de toute inutilité ou incohérence ergonomique ( comme la surcharge d’animations ou des couleurs, la variété des polices…) , afin d’aider l’utilisateur à mieux appréhender le contenu et lui offrir une superbe UX.
Le design minimaliste est le gage d’une UX fluide et conviviale. En effet, il mise sur l’utilisation :
- des couleurs cohérentes
- des images aplaties,
- des typographies lisibles et pas très variées,
- des espaces vides ou blancs,
- un minimum de couleurs : idéalement pas plus que 3 nuances
Cela permet de créer des interfaces rapides (ce qui garantit un fonctionnement sur tous les appareils, notamment sur les supports mobiles qui sont utilisés par un nombre grandissant d’utilisateurs) et un design simple, mais stylé et élégant.
L’objectif du minimalisme est de concevoir des interfaces interactives. A cet effet, il emploie des éléments aussi purs que possible pour créer un rendu sophistiqué offrant l’avantage :
- d’une navigation facile,
- de fonctionnalités claires et accessibles,
- d’une typographie élégante.
De ce fait, l’utilisateur pourra interagir avec une interface épurée des encombrements dans le design et offrant une interaction simple et spontanée. En effet, ce style évite le design trop imposant et les effets chaotiques afin d’attirer l’attention de l’utilisateur et d’optimiser son ressenti durant son parcours UX.
Conclusion
Avec le développement des techniques de conception d’interfaces web, les sites web et applications deviennent plus conviviaux, intuitifs (“friendly”) et responsive. Ils offrent un contenu riche à l’utilisateur qu’il peut l’expérimenter grâce à une navigation simple et rapide. Toutefois, il est important de réaliser un audit UX pour analyser d’une manière exhaustive toutes les pages d’un site ou d’une application web, afin d’identifier les problèmes d’utilisabilité, définir les axes d’amélioration, suivre les tendances adaptées à l’utilisateur moderne ce qui permet d’optimiser par conséquent l’UX et de générer plus de trafic.
Lire aussi :
Le Glassmorphism : la nouvelle tendance pour 2021 ?
by 
