Skip to main content
Un système de design, c’est votre marque rendue exploitable par la machine. Il capture les décisions qui font ressembler votre produit à votre produit — tokens de couleur, typographie, espacement et exemples de composants — afin que Design puisse générer des résultats fidèles à votre marque plutôt que génériquement jolis.

Ce que contient un système de design

Un système de design généré comprend :
  • Tokens — les valeurs nommées (couleurs, espacements, rayons) que tout le reste référence
  • Couleurs — votre palette, avec ses rôles (primaire, surface, accent…)
  • Typographie — familles, tailles et graisses
  • Exemples de composants — quelques composants construits (boutons, cartes…) illustrant l’usage du système
  • Logos et ressources de marque, lorsque vous les fournissez
Le système peut aussi être exprimé sous forme de fichier DESIGN.md dans votre projet — voir la référence.

D’où viennent les systèmes de design

Deux façons d’en créer un :
  1. À partir de zéro — demandez-en un depuis la page d’accueil de Replit, et répondez à un court questionnaire sur votre marque.
  2. À partir d’un design existant — extrayez un système depuis une maquette que vous aimez déjà (menu à trois points sur la frame → extraire).
Vous pouvez aussi en amorcer un à partir d’une source : une URL Figma, un site web, du code, des images de référence, ou un fichier DESIGN.md existant. Détails dans Créer un système de design.

Quand un système de design est rentable

  • Vous concevez plus d’une fois. Le deuxième design est là où l’incohérence commence ; un système fait en sorte que la génération N ressemble à la génération 1.
  • Une équipe conçoit ensemble. Enregistrez le système dans votre espace de travail et tout le monde génère à partir de la même marque.
  • Vous l’appliquez à un travail existant. Un artefact existant peut être reconstruit sous le système — voir Appliquer un système de design, y compris ce que signifie l’avertissement sur le temps/les crédits.

Où ils vivent

Les systèmes de design sont enregistrés dans votre espace de travail, sélectionnables lorsque vous créez un nouvel artefact, et interchangeables par projet.