Claude Design open source — un système de design IA entièrement gratuit

Ce guide est le pendant écrit de la présentation d'Open Design par WorldofAI — moins un tutoriel d'installation qu'une mise au point sur « ce qu'est réellement cette chose et pourquoi elle compte ». Nous reprenons le fil de la vidéo de WorldofAI, réécrit et actualisé pour correspondre à la version actuelle. Regardez ci-dessus pour la visite en direct, ou lisez la suite pour la version qui part des concepts : ce qu'est Open Design, pourquoi il a décollé, ce que vous pouvez construire et comment démarrer.

L'espace de travail Open Design : prototypes, présentations, images et vidéos partent tous du même endroit.

Qu'est-ce qu'Open Design ?

Open Design est une plateforme de design open source et local-first — une alternative agent-native à Claude Design et Figma. L'idée centrale est simple mais inhabituelle : au lieu d'être une application fermée câblée à un seul fournisseur de modèle, Open Design fonctionne par-dessus l'agent de code que vous utilisez déjà.

Pointez-le vers un dossier de projet et il analyse votre machine à la recherche des CLI d'agents de code installés — Claude Code, Codex, Cursor, Gemini, Copilot, OpenCode, et bien d'autres — puis vous laisse en choisir un pour piloter la génération. Ce CLI devient votre agent de design. Vous n'apportez pas votre propre clé en payant une marge par-dessus ; vous apportez votre propre agent et faites tourner le design via l'abonnement ou le forfait que vous payez déjà.

Et c'est véritablement local. Il y a en dessous un démon doté d'un véritable accès au système de fichiers : il lit et écrit des fichiers, exécute des commandes et conserve l'état dans une base de données SQLite locale. Vos créations vivent dans vos propres dossiers, vos projets vous appartiennent, et rien n'a besoin de faire un aller-retour par le cloud de quelqu'un d'autre. Par-dessus ce runtime local s'ajoutent des pipelines d'export (HTML, PDF, présentations, ZIP), l'import de ZIP Claude Design et des serveurs MCP pour un accès agent-à-agent à vos fichiers de design — de sorte que cela s'intègre aux outils que vous avez déjà plutôt que de les remplacer.

Pourquoi il a décollé

Open Design est devenu l'un des projets open source à la croissance la plus rapide sur GitHub, et WorldofAI explique clairement pourquoi. Cela tient à trois choses.

Il est open source et gratuit. Sous licence Apache-2.0 — clonez-le, auto-hébergez-le, lisez-en chaque ligne. Aucun abonnement ne conditionne l'accès et aucun siège supplémentaire à acheter. Vous ne payez que l'usage du modèle et des médias de l'agent et des fournisseurs que vous connectez. Claude Design, à l'inverse, se trouve derrière un paywall et épuise vite les limites de débit ; quelques générations sérieuses et vous pesez déjà la facture d'usage supplémentaire.

C'est « apportez votre propre agent », pas seulement « apportez votre propre clé ». C'est la partie qui renverse le calcul. La plupart des « alternatives ouvertes » vous attachent encore à un seul modèle — vous changez de clé d'API mais restez dans l'écosystème de quelqu'un. Open Design détecte les CLI d'agents de code déjà présents sur votre système et achemine la génération via celui que vous choisissez. Envie de faire tourner Codex avec un effort de raisonnement élevé ? Vous préférez Claude Code, OpenCode, Gemini CLI ou un modèle ouvert efficace comme MiniMax pour le travail web ? C'est votre choix, projet par projet. Pas de verrouillage multi-modèle. Et si vous n'avez pas de CLI configuré, un proxy « apportez votre propre clé » compatible OpenAI exécute le même flux de travail sans la configuration locale.

Des design systems concrets que vous pouvez intégrer à n'importe quel projet — pour ne pas partir d'une page blanche.

Le design est bâti sur du code, pas seulement sur un modèle d'image. C'est le facteur de différenciation discret. Open Design embarque une bibliothèque de compétences composables et de design systems complets, de sorte que vous ne générez pas une image isolée — vous générez un design réel, structuré, de qualité production. Comme la sortie est construite comme on construit du code, elle passe du design directement à la production : confiez les fichiers générés à un autre agent de code et continuez à construire. Le verdict de WorldofAI : la qualité de sortie tient la comparaison avec Claude Design tout en en faisant plus — et sans vous enfermer chez un seul fournisseur.

Ce que vous pouvez construire

Open Design n'est pas un générateur d'interfaces à usage unique. Depuis un seul espace de travail, vous pouvez produire :

• Des prototypes et des landing pages haute fidélité — des pages entièrement stylées, pas de simples wireframes, bâties sur un véritable design system.
• Des présentations et des pitch decks — des présentations structurées et animées, avec de vraies sections.
• Des mises en page de magazine et éditoriales — des articles éditoriaux à long défilement, des documents de type rapport annuel et d'autres mises en page riches.
• Des interfaces d'applications mobiles — des interfaces soignées qui se lisent comme conçues, pas générées automatiquement.
• Des images — des ressources générées via les fournisseurs de médias que vous connectez (par exemple le modèle d'image d'OpenAI).
• De la vidéo et de l'audio — du mouvement et du son depuis le même endroit, là encore via vos propres clés de fournisseur.

La galerie d'exemples intégrée à l'application — landing pages, présentations, design systems — rend l'éventail évident au premier coup d'œil. Tout sort d'un seul outil, piloté par l'agent que vous avez choisi, et vous pouvez mélanger les modèles librement plutôt que d'être restreint à un seul fournisseur.

Premiers pas

Vous avez trois façons de faire tourner Open Design. Choisissez celle qui vous convient :

Méthode	Idéale pour	Ce qu'il vous faut
Application de bureau	La plupart des gens — zéro configuration	Rien. Téléchargez et ouvrez.
Exécution depuis les sources	Les développeurs qui veulent lire ou modifier le code	Node ~24, pnpm (via Corepack)
Installation dans votre agent	Les gens qui vivent dans le terminal	Un CLI d'agent de code existant

Application de bureau (recommandée). Rendez-vous sur open-design.ai, téléchargez la version de bureau pour votre plateforme et ouvrez-la. Pas de Node, pas de pnpm, pas de clonage — l'application détecte automatiquement les CLI d'agents de code dans votre PATH et charge pour vous les compétences et design systems intégrés.

Exécution depuis les sources — la voie empruntée par WorldofAI dans la vidéo — tient en quatre commandes :

git clone https://github.com/nexu-io/open-design.git
cd open-design
corepack enable && pnpm install
pnpm tools-dev run web

Ouvrez ensuite l'URL locale qu'il affiche (le port est attribué dynamiquement — copiez celui de votre terminal, ne supposez pas un numéro fixe). Vous avez besoin de Node ~24 ; Corepack sélectionnera pour vous la version de pnpm épinglée.

Installation dans votre agent de code — pour appeler Open Design en tant que compétence à l'intérieur de votre agent sans jamais ouvrir l'interface graphique :

od mcp install <agent>
# od est livré avec Open Design ; <agent> = claude | codex | cursor | copilot | gemini | opencode | …

Au premier lancement s'ouvre le démon d'accueil, où vous configurez l'essentiel : choisissez un agent et un modèle par défaut (l'application détecte automatiquement les CLI locaux, ou branchez une clé compatible OpenAI), ajoutez si besoin des clés de fournisseurs de médias pour l'image/la vidéo/l'audio, et raccordez les services MCP de votre choix. Enregistrez, lancez-vous, puis créez un prototype — donnez-lui un nom, choisissez la haute fidélité plutôt que le wireframe, et rédigez votre brief. L'agent pose quelques questions de clarification (plateforme, angle de l'article, direction de design), planifie son travail, lit le design system et construit l'artefact. Lors de l'essai de WorldofAI, Codex a produit une landing page de newsletter soignée en cinq minutes environ — facturée sur son propre forfait Codex, acheminée entièrement à travers les compétences d'Open Design.

Conseils

• Choisissez le bon agent pour la tâche. Open Design achemine via le CLI que vous sélectionnez — essayez un modèle efficace comme MiniMax pour un travail web rapide, ou réglez Codex sur un effort de raisonnement élevé pour le rendu le plus soigné.
• Commencez en haute fidélité quand vous voulez voir le résultat réel ; ne descendez au wireframe que pour esquisser rapidement la structure.
• N'apportez vos propres clés de médias que pour les fournisseurs que vous utilisez vraiment — vous n'avez pas besoin de toutes pour commencer à concevoir.
• Vous n'avez pas besoin d'un design system au préalable. Partez d'un système intégré, importez un ZIP Claude Design, ou laissez Open Design déduire des valeurs par défaut sensées.
• Les créations restent avec le dossier du projet. Organisez votre travail en exécutant Open Design sur le bon répertoire.

FAQ

Open Design est-il vraiment gratuit ? Oui — il est open source sous licence Apache-2.0, sans abonnement. Vous ne payez que l'usage du modèle et des médias de l'agent et des fournisseurs que vous connectez.

En quoi « apportez votre propre agent » diffère-t-il de « apportez votre propre clé » ? Apportez votre propre clé vous lie encore à un seul fournisseur — vous ne faites que fournir la clé. Open Design détecte les CLI d'agents de code déjà présents sur votre machine et vous laisse choisir lequel pilote la génération, projet par projet. Pas de verrouillage sur un seul modèle.

Suis-je obligé d'utiliser Claude ? Non. Claude Code n'est qu'une option parmi d'autres — Codex, Cursor, Gemini, Copilot, OpenCode et bien d'autres sont tous pris en charge, et vous pouvez changer d'agent depuis l'espace de travail quand bon vous semble.

Est-ce réservé aux maquettes d'interface ? Non. Le même espace de travail produit des landing pages, des présentations et des pitch decks, des mises en page de magazine, des interfaces d'applications mobiles, des images et de la vidéo — et comme le design est bâti sur du code, il passe du design directement à la production.

---

Ce guide écrit s'appuie sur la présentation d'Open Design par WorldofAI. Regardez la vidéo complète ci-dessus, et abonnez-vous à WorldofAI pour découvrir d'autres outils et workflows IA récents.