Flat design – un concept graphique en vogue ces derniers temps, mais peut être pas si jeune qu’on le croit.

De nombreux webdesigners l’emploient aujourd’hui pour le redesign ou la réalisation de nouveaux sites Web et applications. Cette tendance popularisée par le Metro style de Windows 8 et la refonte de l’univers Google, fait des émules dans de multiples créations.

Flat design – une question de typographie ?

Certains vous diront que le flat design ne s’apparente pas à un style ou à une période mais plutôt aux bases fondamentales du design graphique. Une utilisation efficace de la couleur, de la typographie et de l’espace pour communiquer un message.

Aucune 3d-ification, ni surcharge du design par des effets de textures, de profondeurs ou de dégradés. La simplicité prime avant tout.

Le design se limite à l’emploi de couleurs souvent très vives et la typographie y occupe une place prédominante. Le flat design prône la clarté et la lisibilité.

Exemple flat design – The Experiential Company

Cela passe par l’utilisation d’une police sans-serif de grande taille. Les textes sont concis, l’accent est mis de préférence sur le message. La forme sert l’information de manière simple via une mise en page proposant de grands espaces vides.

C’est par sa quête de la simplicité et son affection pour la typographie que le flat design peut être apparenté au Swiss style, aussi connu sous la dénomination d’International typographic style.

Exemple flat design – Erscheinungsbild Flughafen Munchen Exemple flat design – Karl Gerstner: Review of 5 X 10 Years of Graphic Design — Andy Hills

Reprenant à son compte les principes du modernisme, le Swiss design a favorisé l’émergence d’un style graphique centré sur le travail de la typographie avec une mise en page parfois étriquée mais le plus souvent très structurée.

La mise en valeur du travail typographique se traduit par une utilisation à minima des textures et des illustrations, la préférence allant à l’emploi d’aplats de couleurs et de photographies.

On retrouve cette approche graphique dans le flat design. La typographie y occupe une place centrale. C’est elle qui habille et donne un rythme au design par ses variations de tailles, de gras et de couleurs. La photo accompagne les textes et structure la mise en page.

Le flat design emprunte en grande partie l’esprit d’un concept graphique apparu dans l’univers du print dont le Swiss design en internationalisa la popularité durant les années 50.

Toujours pas de définition pour le flat design

Je ne me risquerai pas à vous soumettre une définition du flat design. Une aventure bien trop périlleuse pour moi.

Néanmoins, des principes de mise en oeuvre peuvent être proposés, comme Designmodo l’a très bien fait. Pour faire court, selon cet article, le flat design gravite autour de ces 3 fondements :

• Focus sur la couleur,
• Focus sur la typographie,
• Focus sur la hiérarchisation.

3 termes que l’on peut associer facilement au Swiss style.

Si vous souhaitez participer au débat, consultez les différentes discussions concernant la dénomination et la définition du flat design proposées dans Branch.

Flat design inspiration

Comme le titre de cet article l’indique, il y était question d’inspiration. Consultez ces chefs d’oeuvres de flat design disponibles sur Dribbble pour vous faire une idée de comment vous intégrerez le flat design dans vos prochains projets.

Ne perdez pas votre temps à réinventer la roue, utilisez Flat UI Pro, le kit PSD & HTML compatible avec Twitter Bootstrap.