Adieu Claude Design ! Voici le MEILLEUR générateur d'UI par IA open source

Ce guide s'adresse aux utilisateurs de Windows qui veulent faire tourner Open Design sur leur propre machine — sans compte cloud, sans crédits mensuels à consommer. Il suit la voie empruntée par AI Automation dans leur tutoriel d'installation sur Windows, réécrit et mis à jour avec la version actuelle pour que vous puissiez suivre commande par commande. Regardez la vidéo ci-dessus pour la démonstration en direct, ou poursuivez votre lecture pour la version écrite.

Open Design tournant en local sur Windows : un espace de travail de conception open source et agent-native que vous contrôlez entièrement.

Qu'est-ce qu'Open Design ?

Open Design est une plateforme de conception open source et local-first — une alternative agent-native à Claude Design et Figma. Au lieu de vous enfermer chez un seul fournisseur de modèle, elle s'appuie sur l'agent de code que vous utilisez déjà : Claude Code, Codex, Cursor, Gemini, Copilot, OpenCode, et une douzaine d'autres. C'est du « apportez votre propre agent » plutôt que simplement apportez votre propre clé.

Quelques points qui valent le détour :

• Open source, Apache-2.0 — clonez-le, auto-hébergez-le, lisez chaque ligne.
• Tourne en local — vos projets vivent dans vos propres dossiers sur votre machine, pas dans le cloud de quelqu'un d'autre.
• Agents enfichables — plus de 21 agents de code sont pris en charge ; vous choisissez quel CLI pilote la génération, et la qualité du résultat suit le modèle que vous retenez.
• Bien plus que des prototypes — prototypes, artefacts vivants, présentations, mises en page de type magazine, génération d'images, et même de la vidéo, le tout depuis un seul espace de travail.
• Une bibliothèque intégrée de design systems et de modèles, pour ne pas partir d'une toile blanche.

Si vous avez utilisé Claude Design, la prise en main sera immédiatement familière — Open Design conserve la même esthétique apaisée, puis ajoute des capacités (et le choix de votre modèle) par-dessus.

Avant de commencer

Vous avez trois façons d'installer Open Design sur Windows. Choisissez celle qui vous convient :

Voie	Idéale pour	Prérequis
Application desktop (Windows x64)	La plupart des utilisateurs de Windows — zéro configuration	Aucun. Téléchargez et ouvrez.
Lancer depuis les sources (WSL)	Les développeurs qui veulent lire ou modifier le code	WSL2 + Ubuntu, Node ~24, pnpm 10.33.x
Installer dans votre agent	Ceux qui vivent dans le terminal	Un CLI d'agent de code déjà installé

La vidéo utilise la voie depuis les sources via WSL, parfaite si vous voulez vivre à l'intérieur du dépôt. Mais pour la plupart des gens, la version desktop native de Windows est la voie recommandée — il existe un installeur Windows (x64) qui ne nécessite ni WSL, ni Node, ni clone. Ce guide couvre les deux ; le tutoriel WSL ci-dessous est réservé aux cas où vous voulez spécifiquement la voie des sources.

Étape 1 — Configurer WSL

Si vous voulez seulement l'application desktop, passez directement à l'Étape 2, Option A. Si vous voulez la voie depuis les sources, il vous faut d'abord un environnement Linux à l'intérieur de Windows. C'est exactement ce que fournit WSL (Windows Subsystem for Linux) — un véritable shell Ubuntu tournant aux côtés de Windows, sans dual-boot, sans machine virtuelle à surveiller.

1. Installez WSL et Ubuntu. Ouvrez PowerShell et exécutez wsl --install — cela active WSL2 et installe Ubuntu par défaut. Redémarrez si Windows le demande, puis lancez Ubuntu depuis le menu Démarrer et définissez votre nom d'utilisateur et votre mot de passe Linux au premier lancement. (Vous avez déjà Ubuntu via un autre outil ? Réutilisez-le — inutile de recommencer.)

2. Mettez à jour les paquets de base. Dans le shell Ubuntu, actualisez l'index des paquets et installez l'essentiel :

sudo apt update && sudo apt install -y curl git

Astuce de dépannage tirée de la vidéo : si une étape ultérieure renvoie une erreur étrange, redémarrez proprement votre instance Linux — depuis PowerShell, exécutez wsl --shutdown, puis rouvrez Ubuntu. Un démarrage à neuf règle la plupart des accrocs du premier lancement.

3. Installez Node 24. La version depuis les sources cible Node ~24. Un Ubuntu propre n'a pas encore nvm, alors installez-le d'abord, puis utilisez-le pour obtenir Node 24 :

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.3/install.sh | bash
source ~/.bashrc            # charge nvm dans le shell courant
nvm install 24
nvm use 24
node --version              # devrait afficher v24.x

Une fois Ubuntu configuré et Node 24 actif, vous êtes prêt à installer Open Design.

Étape 2 — Installer Open Design

Option A — Application desktop Windows (recommandée, zéro configuration)

Rendez-vous sur open-design.ai et cliquez sur Download desktop. Il existe une version native Windows (x64) (en plus de macOS et Linux). Lancez l'installeur, ouvrez l'application, et elle détecte automatiquement chaque CLI d'agent de code déjà présent dans votre PATH, puis charge pour vous les skills et design systems intégrés. Pas de WSL, pas de terminal — c'est la voie la plus simple sur Windows.

Option B — Lancer depuis les sources (à l'intérieur de WSL)

C'est la voie que démontre AI Automation. En travaillant dans votre shell Ubuntu avec Node 24 actif, clonez le dépôt et démarrez le runtime web :

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

corepack enable permet à Corepack de sélectionner la version de pnpm épinglée dans le dépôt (10.33.x), pour que vous n'ayez pas à installer pnpm vous-même. pnpm install récupère les dépendances et compile les composants natifs — cela peut prendre quelques minutes au premier lancement, ce qui est attendu, pas un échec. pnpm tools-dev run web démarre ensuite le daemon local et le serveur web.

Une fois terminé, la commande affiche une URL locale — copiez-la et collez-la dans votre navigateur Windows. WSL redirige automatiquement le port vers Windows, l'application s'ouvre donc directement.

Important : le port est attribué dynamiquement au lancement — lisez l'adresse réelle que la commande affiche. Ne supposez pas un port fixe ; l'adresse peut différer d'une machine à l'autre et d'un lancement à l'autre.

Option C — Installer dans votre agent de code (WSL)

Vous préférez ignorer l'interface graphique et appeler Open Design comme serveur MCP à l'intérieur de votre agent ? Sur WSL, il y a une étape supplémentaire au préalable. Linux fournit déjà /usr/bin/od (l'outil de dump octal), qui masque le od propre à Open Design — sans quoi od mcp install … échouerait avec « file not found » pour mcp/install. Ajoutez un petit wrapper qui pointe od vers votre clone et placez-le en tête du PATH :

mkdir -p ~/.local/bin
cat > ~/.local/bin/od <<'EOF'
#!/usr/bin/env bash
repo="$HOME/open-design"     # le clone ~/open-design de l'Option B
cd "$repo" || exit 127
exec corepack pnpm exec od "$@"
EOF
chmod +x ~/.local/bin/od
export PATH="$HOME/.local/bin:$PATH"
hash -r
type -a od                   # le od d'Open Design devrait désormais l'emporter

Reliez-le ensuite à votre agent :

od mcp install <agent>
# <agent> = claude | codex | cursor | copilot | gemini | opencode | …

Ensuite, à l'intérieur de l'agent, il suffit de demander : Use open-design to generate a landing page with the Airbnb design system.

Premier lancement : connecter votre agent de code

Au premier chargement de l'espace de travail, Open Design analyse votre environnement et affiche chaque CLI trouvé. Comme WSL est une véritable machine Linux, il repère les agents installés à l'intérieur d'Ubuntu — un CLI Gemini ou un autre agent vivant dans WSL y est donc détecté. Cliquez sur rescan si quelque chose ne s'affiche pas encore.

• Choisissez un agent et un modèle par défaut. Laissez le CLI installé piloter la génération, ou pointez-le vers un fournisseur et un modèle précis. Comme le souligne la vidéo, un modèle plus puissant donne un résultat nettement meilleur, alors optez pour un modèle capable quand le résultat compte.
• Ajoutez des fournisseurs de médias (facultatif). Pour générer des images, de la vidéo ou de l'audio, collez vos propres clés API — bring-your-own-key, uniquement pour les fournisseurs que vous utilisez réellement.
• Connectez des services MCP (facultatif). Branchez des connecteurs si vous voulez que l'agent puise dans d'autres sources.
• Définissez vos préférences. Langue, apparence, notifications — et même un animal de compagnie de bureau. Vous pourrez tout modifier plus tard, alors gardez le premier passage simple.

Explorer l'espace de travail

Open Design garde votre travail cantonné au projet : quand vous le lancez sur un dossier, les designs que vous créez vivent à l'intérieur de ce répertoire de projet. Votre première liste de projets sera vide — c'est normal.

Au sein d'un projet, vous pouvez construire des prototypes, des présentations, des images, des vidéos, et plus encore. Deux points de départ font disparaître la toile blanche :

La bibliothèque de design systems : choisissez l'apparence d'une vraie marque — Airbnb, Airtable, et bien d'autres — et Open Design en transpose les tokens, couleurs et typographie dans votre design.

• Les design systems capturent l'apparence d'une marque sous la forme d'un DESIGN.md de tokens — couleurs primaires et secondaires, typographie, espacement. Prévisualisez-en un, et vous pouvez construire directement par-dessus au lieu de définir une palette de zéro.
• Les modèles couvrent les prototypes, les présentations, ainsi que la génération d'images et de vidéos. Filtrez par type et forkez n'importe lequel pour prendre de l'avance.

Modèles : des points de départ pour prototypes, présentations, images et vidéos — filtrez par type et forkez pour commencer.

Vous pouvez parcourir toute la bibliothèque sur le web à l'adresse open-design.ai/plugins avant d'installer quoi que ce soit.

Créer quelque chose

Voici le déroulé que suit AI Automation, réécrit pour la version actuelle :

1. Choisissez un design system. Optez pour celui qui vous plaît — disons Airbnb — et ouvrez-le pour inspecter son DESIGN.md et ses tokens.
2. Importez-le comme point de départ. Utilisez Share → Download as ZIP, puis dans votre projet choisissez Import flat design ZIP. Le design apparaît dans l'espace de travail, prêt à servir de base.
3. Formulez le changement souhaité. Tapez un brief en langage clair — « Peux-tu rendre l'arrière-plan sombre ? » — et envoyez-le. L'agent lit le design system, planifie son travail, et produit une nouvelle version de l'artefact.
4. Itérez librement. Changez les polices, ajoutez ou supprimez un logo, téléversez vos propres ressources et faites-les placer au bon endroit. Chaque prompt produit une nouvelle proposition à conserver ou à écarter.
5. Exportez quand le résultat vous convient. Cliquez sur Share et téléchargez le résultat sous forme de ZIP.

Le résultat est un design réel et modifiable, piloté par le modèle que vous avez connecté — un agent capable se traduit donc directement par ce que vous récupérez.

Conseils pour en tirer davantage

• Choisissez un modèle puissant. La qualité du résultat suit l'agent que vous connectez — un modèle gratuit suffit pour apprendre le déroulé, mais un modèle capable vaut le coup pour le vrai travail.
• Lisez l'URL affichée à chaque fois. L'adresse locale est dynamique ; copiez ce que tools-dev affiche plutôt que de réutiliser un ancien lien.
• Installez vos agents là où Open Design ira chercher. Vous lancez depuis les sources dans WSL ? Installez vos CLI à l'intérieur d'Ubuntu pour que l'espace de travail les détecte ; l'application desktop, elle, lit votre PATH Windows.
• Vous n'avez pas besoin d'un design system pour démarrer. Partez d'un design intégré, importez un ZIP, ou laissez Open Design déduire des valeurs par défaut. Vos designs restent attachés au dossier du projet, alors organisez votre travail en le lançant sur le bon répertoire.

FAQ

Open Design est-il gratuit ? Oui — il est open source sous licence Apache-2.0. Vous pouvez le faire tourner en local gratuitement ; vous ne payez que l'usage du modèle/de l'API de l'agent et des fournisseurs de médias que vous connectez.

Dois-je utiliser WSL ou l'application desktop Windows ? Pour la plupart des gens, la version desktop native Windows (x64) est plus simple — pas de WSL, pas de Node, pas de clone. Utilisez la voie depuis les sources via WSL quand vous voulez spécifiquement lire ou modifier le code. À noter : WSL2 est une voie principale prise en charge, tandis que le natif Windows est au mieux-effort ; si vous rencontrez des frictions avec l'une, essayez l'autre.

Quels agents de code prend-il en charge ? Plus de 21 agents, dont Claude Code, Codex, Cursor, Gemini, GitHub Copilot et OpenCode. Open Design détecte les CLI déjà installés sur votre machine — à l'intérieur de WSL pour la voie des sources, ou sur votre PATH Windows pour l'application desktop.

En quoi diffère-t-il de Claude Design ? La même prise en main familière, mais open source, local-first et avec agents enfichables — vous n'êtes donc pas enfermé chez un seul modèle ni à consommer un pool de crédits fixe. Il va aussi au-delà des prototypes avec des présentations, des mises en page de type magazine, de la génération d'images et de la vidéo.

---

Ce guide écrit s'appuie sur le tutoriel d'installation sur Windows d'AI Automation. Regardez la vidéo complète ci-dessus, et abonnez-vous à AI Automation pour plus de vidéos pratiques sur les outils d'IA.