Maintenir une cohérence visuelle entre projets : le défi du design distribué
Comment garder une identité visuelle cohérente quand on étend un projet vers d'autres plateformes ? Réflexions sur la création d'un système de design réutilisable avec Claude Code.
Je continue toujours à explorer la skill frontend de Claude Code, qui me permet de créer des designs, et ça fonctionne très bien. J'ai pu faire un premier site avec une identité déjà assez marquée – du néobrutalism, style très en tendance actuellement. Le rendu est bon, vraiment stylé.
Le problème de l'extension cross-plateforme
Maintenant j'ai une interrogation : comment créer une extension de ce site, une extension Chrome par exemple, en gardant la même charte graphique pour pouvoir l'exporter et l'utiliser ailleurs ?
Il y a une perte d'informations quelque part. Je ne sais pas exactement ce qui bloque. Est-ce que c'est au niveau du contexte ? Pourtant j'essaie de bien préciser mes intentions et de donner des exemples de code.
Vers un Design System documenté
Je pense qu'il faut créer un document plus complet, un fichier markdown qui décrit à la fois :
- La partie visuelle et l'identité
- Les composants réutilisables
- Des exemples de code
- Peut-être même des images de référence
Pour garder une cohérence visuelle entre différents projets qui ont la même identité, il faudrait peut-être créer un fichier ou un dossier avec la définition graphique complète.
L'idée Storybook
Ça pourrait être fait avec Storybook. Je fais toujours un Storybook que je n'ai jamais encore utilisé, mais je pense que je vais essayer de le mettre en place.
L'objectif serait de comprendre comment automatiser :
- La création de composants depuis Claude avec la skill frontend
- L'injection directe de ces composants dans Storybook
- La réutilisation dans d'autres projets
Ce serait du one-shot design avec création d'assets interactifs. Figma ne serait plus utilisé, remplacé par un workflow Claude → Storybook → Production.
Le workflow idéal
Imaginez : vous créez un design avec Claude Code, les composants sont automatiquement documentés et catalogués dans Storybook, et vous pouvez les réutiliser dans n'importe quel projet (web, extension, app) en conservant parfaitement l'identité visuelle.
C'est sur ce workflow que je vais travailler prochainement.