Le Flat Design est tout ce qu’il y a de plus minimaliste (à ne pas confondre avec « moche »). Il rend la navigation plus agréable et améliore l’expérience utilisateur.

Les surfaces mettent en avant des couleurs uniformes, sans contraste ni intensité particulière. De ce point de vue, le flat design s’oppose au skeuomorphisme.
Les pictogrammes et boutons sont de formes simples, souvent carrée ou circulaire.
Les polices d’écriture n’ont généralement rien d’extravagant puisqu’on privilégie les polices sans empattement et les couleurs ternes sont abolies. On utilise du bleu, de l’orange, du rouge, etc.
Grosso modo, ce design se fait pur.

Un Design sans chichi

Pas de place aux textures, ombres portées, dégradés, reflets ni aux chanfreins graphiques.
On ne mise pas forcément sur le côté réaliste de l’objet. On tire donc, d’emblée, un trait sur le superflu. Il ne s’agit pas d’imitation visuelle.
L’utilisateur n’a pas besoin d’avoir la copie conforme de son appareil Nikon pour savoir où appuyer lorsqu’un selfie s’impose.
Les interfaces ont donc, de ce fait, la vocation d’améliorer la lisibilité et la facilité de navigation. Paradoxalement, ceci rend le flat particulièrement compliqué car il faut savoir abstraire a l’essentiel. Pendant de nombreuses années, Apple a su exceller dans cet art.
L’utilisateur doit pouvoir atteindre la page, l’image ou la fonctionnalité ciblée rapidement sans se perdre en chemin. Le purisme prend tout son sens avec le Flat Design. Cette démarche se combine avec les notion d’ergonomie et de siloing pour obtenir une navigation efficace.
S’étant, à la base, répandu sur les smartphones via les applications mobiles, le Flat Design fait maintenant son entrée sur le web pour contaminer les sites un à un.

Les prémisses de l’apparition du Flat Design

Auparavant, les concepteurs de sites Web exhibaient leurs compétences techniques avec des portfolios design mettant en avant un bourrage d’illustrations et d’animations flashy qui soi-disant ébahissaient les utilisateurs.
Il fût donc un temps où le skeuomorphisme a dominé en essayant d’apporter de la vie aux écrans, avec des caractéristiques d’objets réels.
C’est petit à petit que le Flat Design a émergé pour s’opposer à toutes ces techniques de conception « artificielles », au profit d’une esthétique numérique plus classique et simplifiée.
Ce style de conception Web centré sur l’expérience utilisateur existe depuis un bon moment, depuis que les éléments décoratifs ont été considérés comme encombrants (inutilement).
Les pro-flat design prônent la nécessité de se focaliser sur le principal, l’élémentaire, un aspect qui ne sert à rien, n’a définitivement pas lieu d’être.
Cependant, l’absence de design flashy ne veut pas dire que le style est ennuyeux. Le design attire facilement l’attention et guide l’œil de l’utilisateur. Des images simples véhiculent des messages plus rapidement que des illustrations détaillées.
Les sites Web qui utilisent ce style de conception avec succès sont qualifiés de « user-friendly ». Ils sont donc susceptibles de recevoir nettement plus de commentaires positifs que de feed-backs négatifs.

Pourquoi opter pour du Flat design ?

  • La considération des polices d’écriture : largement utilisées par Apple depuis ses débuts (Steve Jobs vouait une passion pour la calligraphie), la typographie est bien plus utilisée dans le flat design que dans le vieux monde “web 2.0”.
  • Des teintes au lieu de reliefs : l’absence de relief nécessite de véhiculer les messages d’une autre manière. Les couleurs sont utilisées de manière plus plus réfléchies pour atteindre ce but. Cela rend les site plus agréables à consulter.
  • Glorification du vide : les sites en flat design utilisent le vide de manière bien plus importante, afin de concentrer l’attention sur les éléments. Cette pratique permet également de concevoir des sites plus aérés et agréables à consulter.

Quelques outils permettant d’implémenter un flat design

La librairie Bootstrap propose plusieurs éléments “flats”. Historiquement produit et utilisé par Twitter, ce framework CSS et Javascript est maintenant largement répandu.
La bibliothèque de thèmes wordpress Themeforest propose une série de thèmes développés en flat design et directement utilisable sur WordPress.
Flat UI est un autre framework CSS que j’apprécie dans le monde du flat design.