Une tendance webdesign provenant du mobile

Le Material Design est un langage visuel et interactif créé par Google. Il s’inspire d’objets réels et ressemble beaucoup au Flat Design, mais se distingue par son utilisation d’ombres portées, d’éléments en 3D et d’effets de perspective. Le Material Design permet aux webdesigners de créer des sites web plus dynamiques et fonctionnels, en suivant une approche cohérente apportée par la firme de Mountain View par le biais de l’interface éponyme.

3 principes fondamentaux forment le Material Design

Le Material Design est basé sur trois principes fondamentaux : les matériaux, les échelles et les shadowing (ombre portée).

Les matériaux représentent la surface sur laquelle les éléments sont disposés. Ils ont une thickness (épaisseur), une sheet (feuille) et une élévation (hauteur). Ces trois paramètres déterminent l’apparence générale d’un élément.

L’échelle est un aspect important du Material Design, car elle permet de définir la relation entre les différents éléments. Plus un élément est grand, plus il aura d’importance. Enfin, le shadowing permet aux utilisateurs de mieux comprendre l’organisation des différents éléments sur une page. Les ombres plus foncées sont généralement associées à des éléments situés au premier plan, tandis que les ombres plus claires sont réservées aux éléments situés en second plan.

Une cohérence typographique et colorimétrique

La typographie et les palettes de couleurs sont très importantes dans la codification de cette tendance. En effet, une bonne lisibilité est primordiale pour une expérience utilisateur optimale. Les typographies fines et sans empâtements sont idéales, couplées à des couleurs vives, dynamiques et percutantes.

Le mouvement au cœur de la création

Une des règles du Material Design est l’animation. L’aspect de la navigation doit être naturel, cohérent et sans saccades. Cela est rendu possible grâce à l’utilisation de Google Dart (un langage open source qui permet de créer des applications web interactives et fluides). La création de mouvements améliorant énormément l’expérience utilisateur, les développeurs et concepteurs de sites web se doivent de mettre le paquet sur ce point là pour correspondre aux normes de cette tendance graphique.

Polymer, la bibliothèque interactive du Material Design

Afin d’aider les créateurs de sites internet à bien respecter toutes les règles du Material Design, en plus du site Material.io pour les développeurs web, les webdesigners ont aussi le droit à une bibliothèque très détaillée pour concevoir leurs interfaces graphiques. Cette bibliothèque, sobrement intitulée Polymer, regorge de différentes ressources pour créer des mouvements, améliorer l’affordance et l’UX, et conjuguer tout cela à leurs créations. Alors, pourquoi ne pas se laisser séduire vous aussi par un design sobre et efficace pour votre prochain projet web ?