Flat UI : Kit pour création d’interfaces en mode Flat Design

Flat UI : Kit pour création d’interfaces en mode Flat Design

0 8191

Ok, so… vous vous intéressez au design web, vous codez un peu, vous avez entendu parler du Flat Design et vous cherchez de quoi vous faire les dents ?

Je vous propose de découvrir Flat UI, le kit de création d’interface utilisateur de Designmodo, basé sur Bootstrap.

Si par le plus grand des hasards, vous ne savez pas ce que c’est que le Flat Design, sachez que ces dernières années, le design web a été marqué par la tendance (au nom barbare) du skeuomorphisme.

Le skeuomorphisme tente de reproduire dans le monde digital des éléments issus de notre monde bien réel : ombres, textures (papier, bois, métal), ou même objets complets (la boussole pour se diriger sur un iPhone, ou l’application « Notes » par exemple qui reprenait initialement le design d’un petit carnet de notes).

Bref, ces derniers temps, une tendance lourde vient challenger cette ancienne mode : le Flat Design.

Bon ok, c’est quoi le Flat Design ?

Le Flat, c’est un nouveau mode de design qui recherche avant tout une séparation entre l’aspect réel et l’aspect digital. Ici, plus d’ombre, plus de bords arrondis, plus de détails inutiles : on cherche avant tout le coté épuré, clair, et la fonctionnalité avant tout.

Le Flat, c’est le retour aux sources : le design doit servir la fonction (et non l’inverse). Un site web doit être jugé sur la clarté et la facilité d’utilisation, et non sur sa simple apparence parfois trop… confuse.

Il y a trois types de réponses face à un design – oui, non et WOW ! … pour info : WOW est la réponse qu’il faut viser. – Milton Glaser

En reprenant le design de ce site, j’ai voulu que celui-ci soit dans la tendance du Flat. Plus épuré, plus focus sur ce qui est réellement important : le contenu, les articles, l’expérience utilisateur et… bon, j’avoue, pour la page d’accueil : les conversions.

Récemment, sur l’agence, nous avons aussi pu produire plusieurs sites dans cette mouvance pour mon plus grand plaisir. En voici quelques exemples :

NewsEtiquettes - Etiquettes personnalisées

Visiter le site NewsEtiquettes

Leadwork - Développement Commercial

Visiter le site Leadwork

lmktraining

Visiter le site LMK Training

Le trait est plus ou moins appuyé, c’est vrai… mais ce sont trois exemples assez sympathiques, et j’avais envie de pouvoir les partager, donc voilà. ^^

Flat UI, une boite à outils pour designers et développeurs !

Flat UI est un kit de création et de développement web pour les interfaces utilisateurs.

Il s’agit d’une boite à outils basée sur la dernière version de Bootstrap, le fameux framework made in Twitter.

L’intérêt de Flat UI Pro est que c’est une boite à outils qui s’adresse aussi bien aux développeurs qu’aux designers.

Flat UI est disponible en version HTML gratuitement et il existe une version Pro, plus complète, qui est disponible en HTML ou PSD et permet donc de faire gagner du temps à toutes les étapes de la création du design et de la création de prototypes.

Flat UI Pro intègre :

  • Plus de 100 icônes vectorielles pour apporter du sens à vos designs
  • Plus de 50 glyphes pour rendre vos interfaces plus faciles à comprendre
  • Design Responsive pour les mobiles et les tablettes (grille 940/12)
  • Des color swatches pour pouvoir adapter le design à vos couleurs
  • Des polices de caractères gratuites
  • Une documentation complète

Avant d’aller plus loin, une image vaut mille mots. Donc on vous propose de découvrir Flat UI un peu plus en détail avec ces exemples d’éléments que vous allez pouvoir retrouver à l’intérieur du kit :

Flat UI Elements

Ca en jette hein ? ^^

Bref, si vous voulez en savoir plus, je vous invite vivement à télécharger gratuitement Flat UI dans sa version gratuite que vous pourrez retrouver sur le site de Designmodo ou bien sur Github. Si vous avez déjà utilisé Bootstrap, vous ne serez pas en terrain inconnu.

Et si vous appréciez, et que vous souhaitez aller plus loin, jetez un coup d’oeil à ce que peut donner la version Pro, vous ne le regretterez certainement pas.

Découvrir Flat UI Pro sur la boutique Designmodo

>> Et vous ? Avez-vous des exemples de sites en Flat Design que vous appréciez plus particulièrement ? N’hésitez pas à les partager dans les commentaires ci-dessous !

Et si votre présence sur le web était plus productive qu'une simple carte de visite?
Abonnez-vous à la newsletter TRIBELEADR et recevez chaque semaine : les derniers articles, les livres blancs, des ressources exclusives, et plein d'autres surprises !