ChatGPT peut-il créer un design system ?

Faites l’expérience : demandez à un modèle de chat « un design system complet pour un produit SaaS — des échelles de couleur, une échelle typographique, des tokens d’espacement, un contraste accessible ». Ce qui revient est impressionnant. Des couches bien organisées, une échelle de 50 à 900 par teinte, une échelle typographique avec un ratio nommé, des espacements sur une grille cohérente, des noms de tokens qui suivent les conventions du terrain, des annotations de contraste à côté des paires de couleurs. On dirait le travail de quelqu’un qui a étudié un millier de design systems — ce qui, dans un sens réel, est le cas.

ChatGPT peut poser l’ossature d’un design system, mais il ne peut pas en maîtriser les valeurs de façon fiable. La structure qu’il produit — conventions de nommage, couches de tokens, suggestions de ratio pertinentes, rappels d’accessibilité — est réellement solide. Les nombres à l’intérieur de cette structure survivent rarement à une vérification : des ratios de contraste qui ne se reproduisent pas une fois calculés, des pas d’échelle qui ne suivent pas le ratio annoncé, et un jeu de valeurs différent à chaque nouvelle requête. Utilisez le modèle comme échafaudeur et conseiller ; laissez une source déterministe être responsable de chaque valeur.

Ce partage — et comment le mettre en pratique — est ce que cet article, qui fait partie de notre guide sur l’IA et les design systems, détaille.

Qu’est-ce que ChatGPT réussit vraiment ?

Plus que ne l’imaginent les sceptiques. La couche structurelle d’un design system est un savoir qui vit dans le texte — articles, documentation, conférences — et synthétiser du texte est précisément ce pour quoi un modèle de langage est conçu. Demandez-lui comment organiser les tokens et il décrira le découpage primitif → sémantique → composant vers lequel convergent les systèmes matures. Demandez-lui quel ratio typographique convient à un tableau de bord dense et il raisonnera avec justesse sur la densité de contenu. Demandez-lui de nommer les choses et les noms suivront des conventions que vos futurs collègues reconnaîtront.

Pour une équipe sans spécialiste des design systems, cet échafaudage à lui seul peut justifier la conversation. Il est honnête de dire que le modèle joue ici le rôle d’un conseiller cultivé — et qu’il le joue bien.

Où les valeurs déraillent-elles ?

Les défaillances se répartissent en catégories qui restent reconnaissables quel que soit le modèle ou la version que vous utilisez :

1. Approximation arithmétique. Une échelle typographique, c’est du calcul exponentiel — base × ratio^n — et un modèle qui répond directement à partir du langage tend à approximer le résultat plutôt qu’à le calculer. Les pas paraissent plausibles et s’écartent du ratio annoncé ; notre article sur pourquoi l’IA se trompe dans le calcul des échelles typographiques détaille les nombres exacts.
2. Des vérifications affirmées plutôt que calculées. Les chiffres de contraste arrivent avec une précision assurée — « 4,6:1, passe AA » — mais recalculez-les à partir de la vraie paire de couleurs et une part notable ne correspond pas. Le nombre a été généré pour ressembler à une vérification, pas produit par une vérification.
3. Variance d’échantillonnage. Redemandez demain et vous obtenez un système différent, tout aussi assuré. Rien n’ancre une réponse à la suivante — le même comportement qui fait que les interfaces générées par l’IA dérivent hors de la marque avec le temps.

Une réserve honnête : les assistants capables d’exécuter du code calculent correctement quand ils le font réellement. La catégorie de défaillance concerne les valeurs produites directement à partir du langage — et le problème plus profond, c’est que la sortie ne vous donne aucun moyen de savoir laquelle des deux vous avez reçue. Un nombre calculé et un nombre approximé sont identiques dans un joli tableau markdown.

Comment vérifier une échelle typographique annoncée ?

Prenez l’échelle typographique de la réponse du modèle et placez-la à côté d’une échelle calculée. Ouvrez une échelle de quarte juste calculée dans Scale Composer — base 16, ratio 1,333, chaque pas calculé comme base × ratio^n et arrondi par rapport à la valeur exacte. Si les nombres du modèle correspondent, ils étaient justes. Là où ils divergent — généralement dans les pas supérieurs, où l’erreur exponentielle a eu de la place pour s’accumuler — vous regardez l’approximation en face.

Cette vérification prend environ une minute, et elle change votre façon de lire le reste de la sortie du modèle : structure et conseils, dignes de confiance ; nombres non vérifiés, en attente.

Qu’est-ce qui devrait être responsable des valeurs à la place ?

Une source où chaque valeur est calculée, stockée et référencée — des design tokens produits par un système déterministe plutôt qu’échantillonnés par un système génératif. Notre article sur les design tokens comme interface entre le design et l’IA couvre ce contrat ; en résumé, chaque catégorie de valeur que le modèle de chat a devinée a une bonne réponse qu’un système peut calculer. Une seule échelle globale — base, ratio, pas — peut piloter ensemble la typographie, l’espacement et les rampes de couleur. Les pas de couleur peuvent être placés sur des courbes de luminosité perceptuelle en OKLCH plutôt qu’estimés à l’œil. Les rôles sémantiques peuvent être dérivés en imposant un plancher de contraste WCAG et notés avec APCA. Un thème sombre peut être dérivé comme sa propre variante plutôt qu’inversé. Rien de tout cela ne demande un jugement à chaque fois ; cela demande le même calcul à chaque fois.

À quoi ressemble l’aller-retour ?

Le dispositif de travail, ce n’est pas ChatGPT contre un système déterministe — c’est une boucle entre les deux :

1. La direction dans le chat. Demandez des recommandations de ratio, l’ambiance de la palette, des conventions de nommage, la structure. C’est là que le modèle gagne sa place.
2. Les valeurs calculées. Injectez la direction choisie dans la source déterministe et laissez-la calculer les vrais nombres.
3. Les tokens exportés. Sortez le résultat sous forme de propriétés personnalisées CSS, d’un bloc @theme Tailwind v4, de JSON DTCG ou de Figma Variables — quel que soit le format que votre projet lit.
4. Les tokens de retour dans la conversation. Collez le fichier dans le projet IA et demandez au modèle de référencer les noms de tokens, jamais d’inventer des valeurs. Référencer un nom depuis une courte liste visible est une tâche que les modèles de langage gèrent de façon fiable ; garder cinquante valeurs exactes stables d’une session à l’autre ne l’est pas.

La boucle fait jouer chaque participant sur son terrain : le modèle raisonne sur le système en langage, le système tient le système en nombres.

Bouclez la boucle

L’étape d’export est le moment où la réponse à la question du titre devient concrète : ouvrez la même échelle à l’étape d’export et regardez ce qui repart réellement dans le chat — des tokens nommés avec des valeurs calculées, dans un format que le modèle ne peut que référencer, pas ré-imaginer. ChatGPT peut-il créer un design system ? Il peut en esquisser l’architecture. Le fichier qui part en production, c’est la partie que vous calculez.