UI-kit
Ci-dessous, voici quelques explications qui complèteront le UI-kit de ce site.
Typographie
- Taille : le choix a été fait à partir du site Material Design, permettant notamment de nous fournir une fiche proposant une hiérarchie typographique. Après avoir fait mon choix, je l'ai donc appliqué à mon travail.
- Police : Toujours à partir de Material Design, j'ai choisi deux typos pour ce site : Une serif pour les titres (Roboto Slab) et une sans-serif pour le body (Nunito).
- Serif/sans serif, c'est quoi ?
Couleurs
- White & Black : Ces deux couleurs de base ont été utilisées afin d'avoir un contraste maximal entre le texte et le background.
- Nuances d'orange : Basé sur deux ressources de Material Design, ce choix de couleur vive contraste avec la froideur du noir et du blanc. Les différents degrés de luminosité, selon l'état de l'interaction, ont été choisis via cette ressource.
- Nuances de bleu : Ce bleu est la couleur complémentaire de l'orange choisi.
Liens et boutons
- Les liens possèdent la même typographie que le body. Leur background est noir, à l'instar de mon précédent atelier, afin que la couleur du texte ait un contraste maximum. Les boutons, quant à eux, essaient d'être présentés selon les divers conseils de Material Design. Leurs icones proviennent de cette ressource. Le traitement colorimétrique des deux notions équivaut à celui cité dans la rubrique précédente.