Claude Code : cadrer l’UI avec DESIGN.md référencé

Rendre un système de design opposable à l’IA passe par une consigne explicite dans CLAUDE.md. L’approche décrite consiste à faire de DESIGN.md la référence unique pour tout le travail d’interface et de visuel, avec des règles d’application claires. Elle s’adresse aux produits déjà dotés d’un design system, lorsque la plupart des tâches UI doivent s’y conformer. D’autres usages de DESIGN.md existent, et la référence dans CLAUDE.md n’en est qu’un.

Inscrire des règles d’UI directement dans CLAUDE.md

La méthode propose d’ajouter dans CLAUDE.md une section « Système de design ». Cette section fixe @DESIGN.md comme référence unique pour tout travail d’interface et de design visuel. Les consignes encadrent la production : suivre les tokens et les modèles de composants déjà définis, conserver les principes visuels documentés dans DESIGN.md, privilégier la réutilisation des patterns existants avant toute création, et signaler explicitement les écarts choisis.

Adopter DESIGN.md comme source unique pour l’interface

La référence persistante de DESIGN.md via CLAUDE.md est présentée comme adaptée lorsque presque chaque tâche d’interface doit respecter le même système de design. L’auteur indique l’adopter surtout à des étapes avancées de la conception, lorsqu’un design system est en place et stabilisé. L’objectif affiché est alors que l’IA s’appuie sur ce système pour produire les écrans et variantes demandés.

DESIGN.md, pivot visuel du projet mais pas l’unique usage

DESIGN.md est présenté comme le deuxième fichier Markdown le plus important pour le contexte de Claude Code, après CLAUDE.md. CLAUDE.md encadre la manière de travailler de l’IA sur le produit, quand DESIGN.md spécifie l’apparence et la sensation du produit. Beaucoup d’équipes relient déjà DESIGN.md à CLAUDE.md, mais ce n’est qu’une possibilité parmi d’autres. Cinq approches sont annoncées pour exploiter DESIGN.md dans Claude Code, dont la référence persistante détaillée ici.