Publié le: 01/04/2019 Publié par: Virginie Delmotte Commentaires: 0

Le flat design et le Material design sont tous deux des langages utilisés dans la conception d’interfaces utilisateurs. Il arrive parfois de les confondre, tant ils partagent de nombreuses similitudes. Mais quelles sont leurs différences ? Pour bien les distinguer, commençons par discuter du terme Skeuomorphism ou design du monde tangible.

Skeumorphisme, là où tout commence

 

Le Skeumorphic web design est un type de langage design utilisé pour concevoir des éléments graphiques tels qu’il nous est possible de les retrouver dans le monde physiques. L’utilisation de la 3D et une police de caractères adaptée permettent un rendu familier et proche de la réalité des éléments ainsi conçus. Ce design engageant améliore en général l’expérience utilisateur en favorisant une compréhension simple et pratique des éléments connus par le plus grand nombre.

Les premières versions du système d’exploitation mobile d’Apple, iOS, utilisaient le Skeumorphisme sur ses applications mobiles (par exemple, des boutons ressemblant à de véritables boutons brillants, des photos aux bordures blanches ressemblant à des photographies physiques, etc.). Skeuomorphisme dans iOS a été largement développé tant il apportait une utilisation intuitive pour les utilisateurs qui n’avaient jamais utilisé un smartphone tactile auparavant.

Le design plat et minimaliste, le Flat design

 

L’image ci-dessus comparer une interface de type skeuomorphique et une interface de type flat design.

Le Flat design est un style de conception d’interface utilisateur, utilisant des éléments simples en deux dimensions et des couleurs vives. C’est pourquoi il est souvent mis en contraste avec le style skeuomorphique qui donne l’illusion de trois dimensions en copiant des propriétés réelles des corps physiques et tangibles. Avec la sortie de Windows 8, l’iOS 7 d’Apple sa cote de popularité n’a cessé de croître.

À l’origine, le Flat design fut conçu pour pouvoir réaliser des interfaces réactives dont le contenu évolue de manière progressive et fonction de la taille de l’écran des différents supports de lecture digitaux (smartphone, tablette…) L’utilisation récurrente de formes simples et de textures minimalistes procure un certain design plat et épuré aux interfaces. Des caractéristiques utiles et pratiques pour garantir des créations d’interface réactives, fonctionnant correctement, se chargeant rapidement. La rapidité de chargement constitue l’un des points fort du Flat design, d’autant plus que les vitesses de connexion des appareils mobiles s’avèrent plus lentes.

La réduction de la quantité de bruit visuel, à l’aide de textures et d’ombres, permet ainsi une conception à plat et offre une expérience utilisateur (UX) simplifiée et optimale.

Le Material design, une suite logique du Flat design ?

Si le Material design s’apparente à du « Flat design à la Google », c’est aussi parce qu’il reprend les règles du design mise en application par son prédécesseur. Son objectif étant de développer la flexibilité et l’interactivité, tout en prenant en compte les dispositions de bases de grille, les animations, le remplissage et la réactivité. Avec ce type de conception, il est possible de concevoir une interaction entre l’application et l’utilisateur, quel que soit le type d’appareil utilisé et son format de lecture.

Le Material design répond aux attentes des utilisateurs de manière à ce que les éléments soient davantage crédibles plutôt que réalistes. L’application de la conception matérielle exige une compréhension efficace de ces principes :

  • La métaphore de la matière
  • Des éléments audacieux, graphiques et bien choisis ajoutent du sens et plaisent à l’œil
  • Le mouvement donne du sens.