Les tendances UI 2019

Dis Adobe…

Depuis son lance­ment Adobe XD n’avait pas fait énor­mé­ment parler de lui. C’était sans comp­ter sur sa nouvelle fonc­tion­na­lité, annon­cée depuis peu. Adobe entre dans la cour des grands en ajou­tant à son outils de proto­ty­page (Adobe XD), le voice proto­ty­ping. Il est main­te­nant possible de dire à votre maquette : « Quand je dis telle ou telle phrase, tu passes sur un autre écran ». Voici une démons­tra­tion de ce que cela donne.

Super­mas­sive fonts

Des titres toujours plus gros. Cette année les sites devien­dront plus clairs pour tout le monde. Les H1 des pages sont de plus en plus gros et impor­tants avec de larges fonts, alors que les sous-titres et les para­graphes restent dans des tailles plus stan­dard. De quoi faci­li­ter consi­dé­ra­ble­ment la hiérar­chi­sa­tion de l’in­for­ma­tion et mettre faci­le­ment en exergue l’in­for­ma­tion que l’on cherche. Pour que cela soit effi­cient, il est impor­tant de veiller à ne pas surchar­ger les pages avec des titres à rallonge. La fron­tière entre un titre impac­tant et un titre illi­sible est mince, prenez vos précau­tions.

Les empat­te­ments toujours tendance

Ils avaient fait leurs come-back cette année et seront toujours là en 2019. La nouvelle année verra la multi­pli­ca­tion des titres de grande taille, et l’avè­ne­ment des typo à empat­te­ment. Quoi de plus beau qu’une belle font serif pour accueillir les visi­teurs sur votre site ? Les typos à empat­te­ments sont toujours des nôtres et contrastent toujours aussi bien avec les fonts sans serif utili­sées pour les textes courants.

Let’s groove tonight!

Oubliez les vieux arrières-plans rigides : 2019 sera une année dyna­mique ! Vous avez très proba­ble­ment eu l’oc­ca­sion d’en faire l’ex­pé­rience vous-même, de plus en plus de back­grounds sont animés, en perma­nence ou lors du scroll. Ce trick vous permet­tras de mettre en avant vos travaux ou encore de montrer encore plus votre univers aux utili­sa­teurs. Alors foncez, mais atten­tion aux perfor­mances d’af­fi­chage !

Bye Bye les droites !

Les rondeurs n’ont jamais eu autant le vent en poupe. Les illus­tra­tions web voient depuis peu leurs angles et leurs formes géomé­triques dispa­raitre pour lais­ser place à plus de rondeur. Des formes orga­niques qui apportent du dyna­misme, de la douceur et du mouve­ment à votre design et qui mettront parfai­te­ment en avant vos blocs de textes.

Entrez dans la 3ème dimen­sion

Qu’on parle typo­gra­phie ou illus­tra­tion, la 3D est partout aujourd’­hui. Elle permet d’ob­te­nir des rendus réalistes pour des compo­si­tions surréa­listes. Certains font le choix d’imi­ter la réalité avec des desi­gns fait de papier, plas­tique, etc alors que d’autres laissent parler leur imagi­na­tion pour nous offrir des rendus toujours plus surpre­nants.

Ça va piquer ! ( Mais pas tant que ça…)

Ces dernières années, la tendance a clai­re­ment laissé une place de plus en plus grande aux couleurs vives. 2019 n’y échap­pera pas mais cette fois plus en douceur tout de même. Les couleurs seront au rendez-vous pour cette nouvelle année mais avec des teintes plus claires, douces et pastels que les années précé­dentes. Pas de couleurs ternes qui endorment, mais des couleurs présentes qui animent vos pages et mettent en avant les éléments impor­tants.

Le mini­ma­lismes fait de la résis­tance

Toujours présent, cette année encore. Le mini­ma­lisme sera bien de la partie, malgré ce que vous avez pu lire au dessus, les sites sont de plus en plus épurés et traitent les infor­ma­tions impor­tantes et c’est tout. Les pages se veulent sobres avec des titres impac­tants et des photos et illus­tra­tions colo­rées mais pas plus. Pas la peine de char­ger inuti­le­ment vos pages. L’uti­li­sa­teur doit pouvoir navi­guer simple­ment et accé­der aux diffé­rentes infor­ma­tions du site sans se perdre.

Neve­ren­ding stories

Après Snap­chat, Insta­gram et Face­book, c’est Google qui sort son format de stories. Les AMPs de Google sont des pages qui appa­raissent lorsque vous utili­sez le moteur de recherche et qui vous permettent d’ac­cé­der à l’in­for­ma­tions plus rapi­de­ment. Ces AMPs ( Acce­le­ra­ted Mobile Pages ) sont juste­ment des pages créées pour les utili­sa­teurs mobile qui veulent accé­der au conte­nus de plus en plus rapi­de­ment. C’est pages sont donc plus légères et se chargent donc plus vite. Il existe déjà de nombreux plugins propo­sés par les diffé­rents CMS mais il est forte­ment recom­mandé de person­na­li­ser vos pages vous même pour un meilleur rendu.

Un menu mobile s’il vous plait !

La part d’uti­li­sa­teurs sur des devices mobiles ne cesse de croître, et les inter­pré­ta­tions respon­sive sont de plus en plus pous­sées. Ainsi, 2019 signera proba­ble­ment l’ar­rêt de mort des burger menus (quand c’est possible tout du moins) et lais­sera place à des barres de navi­ga­tion hori­zon­tale en bas de l’écran, bien plus confor­table pour l’uti­li­sa­teur. Ce design tradi­tion­nel­le­ment reservé aux apps mobiles devient main­te­nant un mode de navi­ga­tion clas­sique sur les sites en version mobile.

Asymé­trie

Après des années à se caler à tout prix sur la grille, à produire des webde­si­gns bien alignés, sans vie, qui rendent les pages parfois mono­tone, on assiste enfin à une sortie de piste avec la multi­pli­ca­tion des webde­signes plus dyna­miques. Les grilles sont évidem­ment toujours de rigueur, mais les blocs, lames, et compo­sants se chevauchent et donnent à votre site plus de mouve­ment. Les textes et les images sont super­po­sés et n’ap­pa­raissent pas force­ment en même temps. C’est la fin des pages ennuyeuses où tous les éléments se ressemblent.

Google Power

Une fois encore Google impose son style, l’ère des desi­gns plats et sans relief touche à sa fin. Le Mate­rial Design est une fois de plus à l’hon­neur et partage son style avec les desi­gners : des blocs mini­ma­listes, des boutons d’ac­tion hauts en couleurs et de la profon­deur avec des ombres qui viennent soute­nir et déta­cher certains éléments du fond de la page. Retrou­vez tout ce que vous devez savoir sur le Mate­rial Design sur leur site dédié.

En fin de compte

En 2019, il sera impor­tant de faire atten­tion à son style, de bien faire en sorte que la hiérar­chie des infor­ma­tions mises à la dispo­si­tions des utili­sa­teurs soit bien claire, que les pages ne soient pas trop char­gées et dyna­miques, pour que chaque utili­sa­teur navigue faci­le­ment et surtout, prenne du plai­sir à reve­nir.