30 ressources pour le material design

material-design

Vous êtes à la recherche de ressources pour le material design ? Découvrez notre sélection de frameworks, templates et bien d’autres ressources très utiles.

Le material design : qu’est-ce que c’est ?

Le material design un nouveau type de web-design inventé par Google qui vise à être accessible à tous, intuitif, interactif et efficace quel que soit le support.

Pour cela, le material design fixe différentes ligne directrices à respecter : ainsi, le choix des couleurs ou des polices d’écriture est particulièrement important (notamment pour des question de lisibilité), de même que la gestion de l’espace ou encore l’utilisation du mouvement.

Besoin d'un développeur ?webmaster ?rédacteur ?

Déposez gratuitement votre projet sur Codeur.com, recevez une quinzaine de devis et sélectionnez le prestataire idéal.

Trouver un prestataire

Après avoir fait ses premières armes sur Android et sur les propres sites de Google, le material design séduit de plus en plus de développeurs et de web-designers. Cela tombe bien, de nombreuses ressources sont aujourd’hui disponibles pour les aider à construire un magnifique site web respectant les règles du material design. Codeur.com vous propose une sélection des meilleures d’entre elles.

SOMMAIRE

  1. Les frameworks material design
  2. Les templates material design
  3. Les UI kits material design
  4. Les icônes material design
  5. Les arrière-plans material design

 

1) Les frameworks material design

Découvrez une sélection de frameworks qui vous permettront de développer vos applications web conformément au material design. Il en existe deux types principaux : les front-end basés sur HTML / CSS et d’autres qui utilisent JavaScript.

 

Framework Front-end :  Material Design Lite

material-design-lite

Framework officiel de Google, Material Design Lite vous donne l’assurance d’être à jour par rapport aux derniers standards du langage visuel web. Ergonomique et simple d’utilisation.

 

Framework Front-end : Angular Material

angular

Soutenu par Google, Angular est un autre framework très apprécié et fourni.

 

Framework Front-end : Materialize

materialize

L’un des principaux avantages de Materialize est qu’il a un fonctionnement très proche de celui de Bootstrap (notamment dans l’utilisation des classes CSS), ce qui en fait l’un des plus populaires.

 

Framework Front-end : LumX

lumx

LumX contient de nombreux composants CSS et JavaScript ainsi qu’une large gamme d’outils pour développer des applications web responsive.

 

Framework Javascript : Material UI

material-ui

Mêlant le meilleur de React et du material design, Material UI est un framework Javascript de référence.

 

Framework Javascript : Essence

essence

Essence permet aux développeurs de construire des interfaces très rapides et agréables prenant en compte les spécifications du Material Design.

 

2) Les templates material design

Vous souhaitez gagner du temps ? Ces templates peuvent vous aider à obtenir un site esthétique et respectueux du material design beaucoup plus facilement.

 

Templates Material Design Lite (Gratuit)

templates-mdl

Une série de templates thématiques (blog, dashboard, portfolio…) proposés par Google dans le cadre du framework MDL.

 

Template MDL pour blog (Gratuit)

template-blog

Également basé sur Material Design Lite, ce template vous permettra de créer un blog au design très léché.

 

WordPress MD Template (Payant)

template-wmd

Sur WordPress aussi, le material design est une réalité. Ce thème WP premium est une des références du genre.

 

Material Kit WP Template (Gratuit)

material-kit-wp-template

Un autre thème material design pour WordPress, gratuit cette fois-ci.

 

Triangular Template (Payant)

triangular

Un template payant mais très complet basé sur Angular. Il est notamment pensé pour l’administration d’un site.

 

Parallax Template (Gratuit)

parallax

Un template complet (header, call-to-action, icônes…) issu du framework Materialize.

 

Pleasure Admin Panel (Payant)

pleasure-template

Ce thème pensé pour l’administration permet notamment d’obtenir un très beau dashboard material design.

One Page Template (Gratuit)

one-page-templateOne Page Template est un autre template basé sur Materialize au design agréable et épuré.

 

3) Les UI Kits material design

Ces UI Kits vous seront tous très utile pour créer des interfaces utilisateurs esthétiques et adaptées au material design. Nous vous proposons une sélection d’UI Kits pour Photoshop, Sketch et même les deux à la fois.

 

UI Kit PSD : Cisco Material App UI (Payant)

cisco-ui
Bien que payant, Cisco propose pas moins de 30 écrans très esthétiques. Toutefois, une version démo comprenant 10 écrans peut être téléchargée gratuitement.

 

UI Kit PSD : Free Material Design Kit (Gratuit)

free-material-ui

Complet, gratuit et simple : parfait pour concevoir tout type d’application.

 

UI Kit Sketch : Android MD Kit (Gratuit)

android-ui

Un UI Kit complet pour Sketch qui offre une grande variété d’éléments d’interface.

 

UI Kit Sketch : Banktag (Gratuit)

banktag-ui

BankTag est un très bel UI Kit conçu en premier lieu pour les applications mobiles de finance.

 

UI Kit multisupports : Material UI Kit (Gratuit)

material-ui-kit

Avec son aspect vivant et énergique, cet UI Kit est adapté pour la création d’une app de divertissement.

 

UI Kit multisupports : Do App UI Kit (Gratuit)

doapp-ui

Avec 130 écrans, 10 thème préconçus et plus de 250 composants, il s’agit d’un UI Kit très riche et complet. Cerise sur le gâteau : il est complètement gratuit.

 

4) Les packs d’icônes material design

Avec ces packs d’icônes faites pour le material design, personnalisez votre site à votre guise.

 

Librairie « Material Icons » de Google (Gratuit)

google-icons

La librairie d’icônes pour le material design officielle de Google : un pack complet au style assez sobre.

Besoin d'un développeur ?webmaster ?rédacteur ?

Déposez gratuitement votre projet sur Codeur.com, recevez une quinzaine de devis et sélectionnez le prestataire idéal.

Trouver un prestataire

 

Icons8 Material Icons (Gratuit)

icons8-material

Un catalogue de plus de 4000 icônes material design avec un grand choix de couleurs.

 

Material Design Icon Bundle (Payant)

icons-color

Une collection d’icônes originales et colorées.

 

System icons (Gratuit)

system-icons

Un pack d’icônes bleues et épurées.

 

Free material design icons (Gratuit)

weather-icons

Un pack d’icônes originales autour du thème de la météo et de la localisation.

 

5) Les arrière-plans material design

Découvrez notre sélection d’arrière-plans material design aux styles variés pour customiser votre site ou application.

 

40 arrière-plans material design (Gratuit)

background-material-design-1

 

10 arrière-plans material design (Gratuit)

background-material-design-2

 

30 arrière-plans material design (Gratuit)

background-material-design-3

 

5 arrière-plans material design (Gratuit)

background-material-design-4

 

5 arrière-plans material design avec des textures originales (Payant)

background-material-design-5

30 ressources pour le material design
5 (100%) 2 votes

Un commentaire

    Laissez un commentaire

    Votre adresse email ne sera pas publiée. Les champs requis sont indiqués *