Icônes
Les icônes Spaceship traduisent des actions et des idées complexes en symboles instantanément reconnaissables, aidant les utilisateurs à naviguer et à interagir facilement.
Universelles mais distinctives, nos icônes sont les plus petits éléments constitutifs de la marque, conçus pour être reconnues instantanément tout en conservant clairement l’identité de Spaceship.
Versions
Toutes les icônes Spaceship sont disponibles en deux versions : contour (principale) et remplie (secondaire).
Construction
Les icônes sont conçues selon des règles définies — de la grille de base aux paramètres de trait — afin de garantir des résultats cohérents et équilibrés.
Taille
Conçues pour être redimensionnables, les icônes doivent être utilisées en cinq tailles afin de préserver la clarté et l’harmonie visuelle dans l’ensemble du système.
Couleurs
La couleur est un élément essentiel qui aide les utilisateurs à identifier plus facilement leurs produits dans une interface donnée. Pour garantir la cohérence dans ces contextes d’interface utilisateur, les icônes utilisent les couleurs du Spaceship Design System.
Couleurs de la marque
En tant que couleurs principales de Spaceship, elles doivent être le choix prioritaire pour les icônes, que ce soit dans des contextes fonctionnels comme l’interface utilisateur de la plateforme ou dans des usages plus illustratifs, comme la représentation des fonctionnalités sur les pages produit. Consultez la page des couleurs pour plus de détails.
Couleurs des produits
Les couleurs principales d’un produit doivent être appliquées à ses icônes respectives. C’est essentiel pour la reconnaissance et la visibilité des produits dans l’écosystème Spaceship.
Couleurs de notification
Utilisez les couleurs de notification pour renforcer les messages d’alerte. Elles doivent être appliquées uniquement aux icônes d’alerte, avec quelques exceptions occasionnelles lorsqu’une autre icône représente également des états de succès, d’erreur ou d’avertissement.
Consignes
Voici quelques exemples de ce qu’il faut éviter lors de l’utilisation des icônes.
Ne déformez pas, ne faites pas pivoter et ne retournez pas les icônes. Redimensionnez-les toujours de manière proportionnelle.
N’utilisez pas d’icônes plus grandes que 40x40px. Visez un bon équilibre entre les éléments.
N’utilisez pas de teintes ni de nuances.