Le glassmorphism, ça vous dit quelque chose ?

Dit comme ça, c’est vrai que ça fait un peu nom de Pokémon raté… 🤐

Mais en réalité, le glassmorphism est une technique de design que vous connaissez certainement !

Cela consiste à créer un effet visuel (comme sur votre site internet par exemple) jouant sur la transparence du verre 🤗

Allez, on vous explique plus précisément de quoi il s’agit, et pourquoi c’est intéressant de le mettre en place chez vous ?

Comment ça, jouer avec la transparence du verre ?

Oui, c’est bien ça : le glassmorphism est une technique de design qui consiste à créer un effet de transparence avec du verre !

Dit autrement, il s’agit de décliner des effets visuels qui se superposent, avec un flou plus ou moins prononcé derrière :

• Les éléments les plus proches sont les plus visibles (plus un objet est proche, plus il attire la lumière) ;
• Les éléments lointains sont flous: c’est d’ailleurs l’une des principales difficultés en glassmorphism, flouter l’arrière-plan suffisamment pour que les éléments au premier-plan soient tout de même lisibles… sans le faire disparaître complètement.

(On vous a glissé quelques exemples ci-dessous pour que ce soit plus parlant)

Bref, même si le terme vous était inconnu, vous connaissiez forcément le glassmorphism puisque cette technique est utilisée depuis quelques années déjà…

Et, chose intéressante, elle revient régulièrement au goût du jour, notamment avec les techniques 3D en webdesign dont on vous parlait la dernière fois.

Sans doute parce qu’il s’agit d’une technique intemporelle ? 😋

D’où ça vient, le glassmorphism ?

On vous l’a dit, le procédé ne date pas d’hier.

En fait, on peut déjà retrouver du glassmorphism sous un certain Aero, apparu sous Windows Vista, et activable sous Windows XP… Vous ne nous croyez pas ? Preuve en image :

Vous voyez les bordures des fenêtres avec un effet de verre dépoli ? Eh bien, nous tenons-là nos effets de glassmorphism, et ça date de 2006 😉

Bref, contrairement à ce qu’on peut lire parfois à droite et à gauche, le glassmorphism n’est pas apparu en 2013 avec Apple et iOS 7…

Aujourd’hui, cette technique de design est toujours employée dans certaines interfaces : il faut dire qu’elle dispose d’une réelle utilité, outre le souci esthétique.

À quoi ça sert, le glassmorphism ?

Le principal objectif du glassmorphism, c’est de créer une hiérarchie d’effets visuels afin d’aider l’utilisateur à sélectionner les informations les plus importantes dans le bon ordre.

Comment ? C’est simple : notre vue identifie plus facilement (et plus rapidement) les éléments bien nets, tandis que les éléments flous (créés avec le glassmorphism) sont relégués au second plan.

C’est donc très pratique pour mettre en exergue des éléments clefs sur votre site web, par exemple !

Cela dit, le glassmorphism génère quelques écueils, notamment s’il est utilisé à mauvais escient… Au premier rang desquels, l’accessibilité et la lisibilité pour les utilisateurs, puisque les personnes qui ont des problèmes de vue liront difficilement les informations qui s’y trouvent.