Vous retrouverez sur cette page tous les matériaux, ressources et contenu autour de l'identité et de la marque Smarteo.
Les logos et icones et matériaux ne sont pas sous licence MIT, et sont soumis à copyright. Les licences des polices sont détaillées plus bas.
Charte graphique
Ce document regroupe toutes les bonnes pratiques et directives liées au design et à la dirtection graphique de Smarteo.
Logos
La marque Smarteo possède 3 idéogrammes qui se complètent et marque l'identité de l'entreprise. Il s'agit du mot SMARTEO stylisé, su robot et de son icone en forme de fleur à 4 pétal. Ce dernier idéogramme est repris et décliné en éléments graphiques, pour les boutons notamment (l'angle inférieur droit).
Les logos doivent être utilisés autant que possible sur fond blanc (ou clair).
Tous les logos incluent un espace de sécurité de 150px.
Motif / Image de fond
Les images ci-dessous peuvent ête utilisées comme fond - pour des présentations, des templates etc.
Pack
Modèle porte-clé
pour impression 3D
Modèle pour impression 3d
Fichier STL - ZIP (0.1 Mo)
Couleurs
Les couleurs doivent être utilisées pleines, sans dégradés.
Couleurs principales
Bondi Blue
#3996B0
rgb(57, 150, 176)
Cinnabar
#E54240
rgb(229, 66, 64)
California
#F89D0E
rgb(248, 157, 14)
Couleurs Secondaire
Ces couleurs se réfèrent aux 3 grandes activitées de Smarteo: BotCamp, Lab et Club
Boston Blue (Fab
#468FB1
rgb(57, 150, 176)
Fiord (Smart
#325372
rgb(229, 66, 64)
California (Smarteo Club)
#F89D0E
rgb(248, 157, 14)
Police
Les polices sont sans serif et à penchant humaniste et moderne, mieux adapté à la lecture sur écran. Elles sont légèrement arondis, pour se distancer d'un univers trop formel.
Par ailleurs, elles ont été choisis pour être libre de droit, et ainsi refléter les valeurs de Smarteo, qui s'appuie sur des technologies Open Source, telles que Scratch
Pour les titres et têtes de section
Les titres sont surtout noirs ou foncés, et peuvent occasionnelement être de couleur bleu
(.,;:?!@#$€%&*+=)
Le corps de texte doit être noir ou gris foncé. Les couleurs sont réservé à mettre l'emphase sur certains mots (en complément ou substitut de la graisse) ou liens. Les paragraphes sont majoritairement alignés à gauche - et rarement centrés.
(.,;:?!@#$€%&*+=)
Police monospace, utilisé pour afficher des codes source et extraits de code
Par ailleurs, comme il s'agit d'une police monospace, elle fonctionne particulièrement pour les nombres alignée à droite ; les dizaines et centaines sont alignés ce qui facilite la lecture en colonne.
(.,;:?!@#$€%&*+=)
Police monospace utilisée pour mettre en avant des nombres
Elle s'utilisent beaucoup plus ponctuellement, pour mettre en avant des statistiques, des data etc.
(.,;:?!@#$€%&*+=)
| Usage | Police |
|---|---|
| Titre | Cabin |
| Corps de textepopper | Nunito |
| Monospace (pour code) | Ubuntu Mono |
| Nombres et devises | Rajdhani |