Un système.
Chaque produit digital RAGT.
Canopy est le héros méconnu des produits que nous utilisons tous les jours chez RAGT, qu'il s'agisse d'applications mobiles, de sites web ou encore de tableaux de bord par exemple.
Canopy est l'ADN de la conception des produits et enregistre les principes et les éléments qui définissent l'expérience des utilisateurs. Les couleurs et les icônes sont choisies avec précision, les boutons ont une taille et une forme homogènes, le langage est clair et compréhensible.
Pourquoi ce système existe
À la base, un design system est un ensemble de blocs de construction et de normes qui aident à préserver la cohérence visuelle des produits et des expériences. Il s'agit d'une sorte de modèle, avec un langage homogène et un cadre structuré, qui guide les équipes tout au long du processus complexe de création de produits numériques. Un design system peut réduire le temps passé à recréer des éléments et des modèles lors de la conception et de l'élaboration de produits et d'interfaces à grande échelle.
Sans design system, nous risquons de nous retrouver dans l'impasse de la conception, à parcourir un labyrinthe pouvant générer de la confusion, une dilution de l'image de marque ou de la frustration pour l'utilisateur.
Ce Design System n'est pas là pour brider la créativité et l'objectif n'est pas de faire joli pour faire joli. C'est d'aller plus vite, d'être plus cohérent, et de donner à voir une expérience que l'on reconnaît comme RAGT, quel que soit l'écran ou l'équipe qui l'a conçu.
À qui s'adresse ce document
Ce document s'adresse d'abord aux équipes internes RAGT : c'est la référence à consulter dès qu'un nouvel écran ou une nouvelle fonctionnalité est à l'étude, pour ne pas repartir de zéro à chaque fois.
Il s'adresse aussi aux agences partenaires et aux prestataires freelance briefés sur un projet RAGT. Ils y trouvent de quoi concevoir et développer en cohérence avec nos standards dès le premier jour, sans passer par un long temps d'onboarding.
Comment utiliser ce document
Si un composant ne couvre pas votre cas, ce n'est pas une raison pour improviser un style ponctuel de votre côté.
Signalez-le plutôt à l'équipe design system, pour qu'il puisse être ajouté à la bibliothèque et publié. Le système grandit par ajout, jamais par exception — c'est ce qui le garde utile à tous, dans la durée.
Principes
Quatre repères simples guident chaque décision du système.
Concevoir avec Canopy prend deux formes complémentaires, détaillées dans Design et Développement : la première couvre le lien graphique — le fichier Figma de référence, à récupérer et appliquer manuellement projet par projet — la seconde le lien technique — les tokens et composants du système intégrés et mis à jour automatiquement dans le code.
Un design system peut ainsi rester purement graphique, avec un fichier Figma bien documenté, ou devenir technique, avec un lien qui se déploie automatiquement sur chaque projet. L'objectif du programme digital Groupe est de généraliser, à terme, le lien technique à l'ensemble des projets digitaux RAGT.
Le détail des tokens (couleur, typographie, mise en page) vit sous Design language ; les composants vivants sous Components.