Blogue - WebSelf

Le flat en webdesign

Exemple Flat Design

Le flat design, une des tendances actuelle du web, est un style graphique, principalement lancé par Microsoft en 2010 avec l’apparition du Windows Phone et par Google.

Le style flat repose sur le minimalisme. Utiliser le minimum d’éléments pour représenter une idée. « Less is more » de Mies Van der Rohe traduit cette idée de la représentation du plus par le moins.

La philosophie du flat design fait écho à notre société qui est de plus en plus rapide, et qui va à l’essentiel. Pour se faire comprendre en peu de temps, il faut être clair, lisible et simple afin de toucher au maximum son d’auditoire.

Donner l’importance au contenu :

L’absence d’éléments décoratifs va renforcer la présence et l’impact des éléments comme le texte, les images ou les icônes. On va rechercher les informations de sens et de reconnaissance de la thématique différemment. L’œil va se diriger vers le texte et vers les informations visuelles, qui vont permettre à l’utilisateur de savoir rapidement de quoi il s’agit.

Le flat design est vraiment au service du contenu.

Les icônes en flat design vont souvent utiliser des objets matériels pour représenter un concept plus abstrait. C’est l’objet qui représente une idée. La complexité du flat est de traduire une idée le plus simplement possible sans perdre le sens de celle–ci.

Expérience utilisateur :

Les principes graphiques utilisés sont les aplats de couleurs, l’absence d’ombres et de dégradés, les formes géométriques simples. L’idée est de bannir tout effet de relief. Tous les éléments sont en 2D.

L’avantage du flat en webdesign est qu’il est mobile friendly. Les formes géométriques et les aplats de couleurs s’adaptent facilement aux différents écrans existants.

Le flat design est aussi au service de la navigation, les aplats de couleurs permettent de différencier rapidement les zones d’un site et la typographie droite et le plus souvent sans empattement rend la lecture fluide. Pas d’élément superflu venant troubler la bonne compréhension du fonctionnement d’un site web. Le mode de navigation se veut intuitif. Il met en avant la fonctionnalité d’un site web, ce qui permet aux plus novices de ne pas se sentir perdu.

Un style actuel :

Le flat design étant très actuel, de nombreuses marques tentent de s’adapter à ce style comme Apple. La marque qui utilisait le Skeuomorphisme, un style se rapprochant plus du réalisme donnant une grande importance aux détails, dans sa version iOS6, a choisi de développer un style flat pour l’interface de l’iphone iOS7. Cependant, le choix de la marque a été quelque peu remis en question notamment par rapport à un manque de cohérence de son identité.

Le flat design est donc un style très en vogue mais qui ne s’adapte pas forcément à tous les projets. Il correspond à un positionnement et répond à des problématiques précises. Les enjeux de la société actuels sont la rapidité, l’efficacité et la simplicité. C’est pourquoi le flat design correspond à la réalité d’aujourd’hui mais il y a d’autres facteurs doivent entrer en jeu dans la création d’un design comme l’identité de la marque, son activité, son positionnement.

Exemple de sites en flat :

Pour terminer cet article, trois exemples de sites en flat design. Ces trois sites ont des utilités différentes : un site e-commerce : http://www.beoplay.com/, un site d’école : http://mmimontbeliard.com/ et un site d’agence : http://nedd.me/fr/. Le flat design est donc multi usage. En fonction du contenu présenté et du positionnement du site, le design va être différent et unique. Le flat design offre donc de larges possibilités de création.