Vous trouverez sur cette page toutes les ressources nécessaires pour composer des interfaces utilisateurs en suivant les principes du Material Design.
Typographie
Téléchargez la police "Roboto"
Téléchargez la police "Roboto Mono"
Téléchargez la police "Noto sans"
Couleurs
Retrouvez les codes hexadécimaux de la palette de couleurs.
Téléchargez la palette sous Illustrator et/ou Photoshop.
Aidez-vous du Color Tool de Google pour faire des associations harmonieuses et correspondre aux critères d'accessibilité.
Icônes
Téléchargez les icônes (pictogrammes) Material Design librement.
Téléchargez la grille de composition d'une icône système (sous Illustrator).
Téléchargez la grille de composition d'une icône produit (sous Illustrator).
Grille de composition
Téléchargez les modèles de composition pour le mobile (sous Illustrator)…
Téléchargez les modèles de composition pour la tablette (sous Illustrator),
Téléchargez les modèles de composition pour le desktop (sous Illustrator),
Téléchargez les whiteframes (sous Illustrator ou Sketch).
Retrouvez toutes les tailles d'écrans avec Device Metrics.
Testez si la structure de votre site web est responsive avec Resizer.
Eléments d'UI
Téléchargez le kit UI des composants du Material Design pour Sketch, Figma, Adobe XD.
Etudiez les propriétés des éléments d'UI et implémentez-les avec Material Components.
Ombres et élévation
Téléchargez la table des tailles des ombres pour Sketch.
Téléchargez la table des tailles des ombres pour Photoshop.
Téléchargez la table des tailles des ombres pour Illustrator.
Frameworks et outils d'implémentation
Utilisez le framework Flutter.
Utilisez le framework Materialize CSS (celui vu dans le cours).
Utilisez le framework Get Material Design Lite (getmdl).