La première chose à savoir sur l’UI (User Interface), c’est qu’elle est indissociable de l’UX. Elle constitue la deuxième phase du processus de création de tout support (site internet, application mobile, etc.), la première étant l’aspect fonctionnel matérialisé par l’UX.
Pour faire simple : si l’UX est un produit, l’UI correspond à son packaging. L’UI désigne tout simplement l’enveloppe graphique des composants d’une interface.
Après vous avoir dévoilé les tendances UX du moment, c’est au tour des tendances UI d’être passées au crible pour que votre veille graphique soit irréprochable.
Le Material Design pour aller droit au but
Il y a quelques années, on passait du Skeuomorphisme (un nom un peu barbare pour désigner un mode de représentation mimant nos objets du quotidien pour conceptualiser une interface) au Flat Design (en français « design plat » se traduisant par une simplification drastique des icônes en se concentrant sur l’essentiel afin d’éviter une trop grande charge cognitive auprès de l’utilisateur).
Voilà qu’on passe aujourd’hui du Flat Design au Material Design, une tendance tout droit issue du Flat Design à laquelle on a ajouté une touche de profondeur (sans pour autant repasser au Skeuomorphisme, rassurez-vous !). Les contenus digitaux ont alors été enrichis d’ombres pour créer de la profondeur dans l’interface, d’animations pour rendre l’interface fluide et naturelle dans son utilisation (vous savez, comme le produit sélectionné qui saute dans votre panier), etc.
Capter l’attention à tout prix !
Tous les moyens sont bons pour attirer l’œil de l’utilisateur :
- Des couleurs vives et acidulées pour se démarquer des sites plus traditionnels et faire en sorte que votre site marque l’utilisateur
- Des dégradés plutôt que des aplats pour donner plus de personnalité à des fonds ou pour donner du caractère à une image.
- Des motifs à formes abstraites, organiques ou géométriques pour créer du mouvement
- Des ombres portées pour donner une impression de profondeur
Ces procédés viennent rythmer les compositions graphiques et enrichir l’expérience visuelle de l’utilisateur sur un support.
Le titrage comme élément graphique
Des typographies plus assumées
Depuis quelques temps, nous utilisons de plus en plus de typographies plus travaillées : rondes, grasses, voluptueuses, à empattements, etc. Leur utilisation permet d’affirmer une identité visuelle singulière et assumée.
Ce type de police d’écriture est notamment utilisé pour la hiérarchisation des titres : elles marquent une réelle rupture entre les titres et le contenu, apportant ainsi un rythme et facilitant la lecture.
Grâce à l’évolution de la qualité et de la résolution de nos écrans, nous avons par exemple pu observer une plus large utilisation des typographies à empattements. De meilleures résolutions d’écran ouvrent donc de nombreuses possibilités en termes d’UI, mais aussi en termes de positionnement pour une marque (les typographies à empattement peuvent connoter un positionnement haut de gamme, par exemple).
La typographie devient alors un élément pictural, un composant graphique à part entière, au même titre qu’un visuel, par exemple.
La Tab Bar comme alternative au menu burger
Le menu burger, généralement matérialisé dans son iconographie par 3 barres empilées horizontalement, est majoritairement utilisé sur les interfaces d’applications mobiles ou tablettes. Alors qu’il a d’abord rencontré un franc succès dû au peu de place qu’il prenait et aux grandes surfaces libres qu’il laissait sur l’interface, il est aujourd’hui remis en question. Les webdesigners s’interrogent sur l’avenir de ce menu, parfois incompris des utilisateurs qui ne le perçoivent pas toujours comme un outil de navigation.
Facebook, Youtube ou encore Spotify ont donc abandonné le menu burger dans leurs applications au profit de la Tab Bar. La Tab Bar désigne un menu situé en haut ou en bas de l’écran dont les rubriques sont matérialisées par de petites icônes. La Tab Bar constitue une alternative solide au menu burger, en étant bien plus accessible et intuitive pour la navigation. Selon un article de TechCrunch, Spotify a d’ailleurs constaté une augmentation de 30% de clics sur les items du menu depuis son adoption de la Tap Bar.
Cependant, alors que l’abandon de ce menu sur les applications est relativement facile, ce n’est pas le cas pour les sites web qui ont une arborescence bien plus difficilement adaptable aux Tab Bars.
Des illustrations pour dynamiser le contenu
Les illustrations se démocratisent de plus en plus dans le secteur du numérique depuis quelques années. Même les illustrations les plus simples, comme le Flat Design, peuvent représenter une idée ou faire passer un message de manière très précise et très efficace (les infographies, par exemple).
Ces illustrations, si elles sont créées sur-mesure, peuvent même s’inscrire dans la continuité des autres supports de communication d’une entreprise en s’intégrant à sa charte graphique.
Par ailleurs, les illustrations permettent de créer du rythme dans une page : alterner contenu et illustrations rendra la page plus « vivante » et la lecture bien plus agréable à votre cible.
En Bref
On ne vous a pas menti : UX et UI vont de pair. Les tendances UI évoluent au gré des tendances UX qui, elles-mêmes, évoluent en fonction des nouveaux usages. Comme pour l’UX Design, l’utilisateur est au centre de la conception UI. L’enjeu consiste à créer une interface fonctionnelle qui suscitera une émotion particulière et qui inspirera confiance.
