
Shuffle Design CLI
Shuffle Design CLI est un outil axé sur le terminal qui génère ou redessine des pages de destination complètes à l'aide des meilleurs modèles d'IA et produit un HTML + Tailwind CSS propre et modifiable que vous pouvez prévisualiser, modifier dans Shuffle et télécharger localement.
https://shuffle.dev/design-cli?ref=producthunt&utm_source=aipure

Informations sur le produit
Mis à jour:May 25, 2026
Qu'est-ce que Shuffle Design CLI
Shuffle Design CLI est la version en ligne de commande des outils de conception IA de Shuffle, conçue pour aider les développeurs et les équipes à créer de nouvelles conceptions de sites web ou à moderniser celles existantes directement à partir de scripts, de tâches d'intégration continue ou de flux de travail de terminal quotidiens. Avec une seule commande, vous pouvez générer plusieurs variantes de conception en parallèle à partir d'une invite, ou redessiner un site web en direct en fournissant son URL et une direction de conception. Chaque résultat est livré sous forme de HTML et Tailwind CSS prêts à être modifiés, avec des liens pour prévisualiser la conception et l'ouvrir dans l'éditeur Shuffle pour une itération visuelle.
Caractéristiques principales de Shuffle Design CLI
Shuffle Design CLI est un outil en ligne de commande qui génère de nouvelles conceptions de sites web/pages de destination et redessine des sites web existants depuis votre terminal. Il peut exécuter plusieurs modèles de conception IA de pointe (par exemple, Claude, GPT, Gemini, Kimi) pour produire plusieurs variantes en parallèle, puis fournit des liens de prévisualisation/édition hébergés et vous permet de télécharger des projets HTML + Tailwind CSS propres et éditables pour le développement local. Il est conçu pour l'automatisation – utilisable dans des scripts, des tâches CI et des outils internes – et peut également être intégré dans des flux de travail comme les bots Slack ou les pipelines de prospection.
Génération de conception axée sur le terminal: Créez des pages de destination complètes à partir d'une invite avec une seule commande (par exemple, `npx @shuffle-dev/cli design create "..."`) et recevez plusieurs variantes de conception à comparer.
Refonte de site web alimentée par l'IA à partir d'une URL: Redessinez n'importe quel site en ligne en fournissant une URL et une direction ; la CLI prend des captures d'écran de la page et génère une conception rafraîchie avec le même contenu (par exemple, `npx @shuffle-dev/cli redesign create https://example.com "..."`).
Prise en charge multi-modèles et variantes parallèles: Prend en charge les meilleurs modèles d'IA et peut exécuter les modèles sélectionnés (ou tous les modèles actifs) pour générer des alternatives côte à côte pour une exploration plus rapide et de meilleurs résultats.
Sortie propre : HTML + Tailwind CSS: Génère du code front-end prêt à être édité (HTML et Tailwind CSS) conçu pour être inspectable, modifiable et livrable plutôt que d'être enfermé dans un format propriétaire.
Flux de travail de téléchargement et de synchronisation locale: Téléchargez les projets générés sur votre machine (par exemple, `npx @shuffle-dev/cli get <project_id> --output=...`) et maintenez le travail aligné entre l'éditeur de Shuffle et les environnements de développement locaux.
Options CLI conviviales pour l'automatisation: Inclut des drapeaux pour choisir les modèles, exécuter tous les modèles, télécharger automatiquement les sorties, générer des captures d'écran et enregistrer les métadonnées/URL d'exécution pour des flux de travail scriptés reproductibles.
Cas d'utilisation de Shuffle Design CLI
Propositions de rafraîchissement client pour les agences: Générez rapidement des versions redessinées du site actuel d'un client à partir de son URL pour proposer de nouvelles orientations et accélérer les approbations avant la mise en œuvre.
Pages de destination marketing SaaS à grande échelle: Générez plusieurs variations de pages de destination à partir d'invites, comparez-les et exportez du HTML/Tailwind éditable pour lancer des expériences et des tests A/B plus rapidement.
Offres de refonte pour les ventes/prospection: Automatisez les aperçus de refonte spécifiques aux prospects et envoyez des messages personnalisés (par exemple, via un flux de travail par e-mail) tout en suivant les fichiers générés et les messages envoyés.
Demandes de conception basées sur Slack pour les équipes: Utilisez l'approche du bot Slack fournie afin que les membres de l'équipe puissent demander de nouvelles conceptions ou des refontes directement dans les canaux, centralisant les opérations de conception dans les outils de communication existants.
CI/automatisation pour l'exploration de conception: Exécutez la génération de conception dans des scripts ou des tâches CI pour produire des résultats de conception cohérents et reproductibles pour la révision interne, l'exploration de systèmes de conception ou le prototypage rapide.
Avantages
Création et refonte de conception rapides et reproductibles via de simples commandes de terminal – bien adaptées à l'automatisation et à la CI.
La génération multi-modèles produit rapidement plusieurs variantes, améliorant l'exploration et la prise de décision.
Les sorties sont téléchargeables sous forme de HTML + Tailwind CSS propres et éditables, permettant un transfert simple aux développeurs.
Inconvénients
Nécessite une authentification et l'utilisation de la plateforme de Shuffle pour les liens d'édition/prévisualisation et la gestion de projet.
Convient mieux aux flux de travail HTML/Tailwind ; les équipes utilisant d'autres piles peuvent nécessiter une adaptation ou un travail de conversion supplémentaire.
Le mode de refonte dépend de la capture d'écran d'une URL en direct, ce qui peut être limité par les restrictions d'accès au site ou les pages dynamiques/authentifiées.
Comment utiliser Shuffle Design CLI
1) Prérequis: Installez Node.js (pour pouvoir utiliser npx/npm). Le Shuffle Design CLI s'exécute via npx ou peut être installé globalement.
2) Installer (facultatif) ou exécuter via npx: Option A (pas d'installation) : exécutez les commandes avec `npx @shuffle-dev/cli ...`. Option B (installation globale) : `npm install -g @shuffle-dev/cli`.
3) Authentification: Exécutez `npx @shuffle-dev/cli auth` et complétez le flux de connexion du navigateur qui s'ouvre automatiquement. Vous devriez voir "Authentification réussie !" une fois terminé.
4) Explorer les commandes disponibles: Exécutez `npx @shuffle-dev/cli --help` pour voir les commandes de niveau supérieur. Pour l'aide à la génération de conception, exécutez `npx @shuffle-dev/cli design create --help`.
5) Créer une toute nouvelle conception à partir d'une invite: Générez une page de destination (ou n'importe quelle page) à partir d'un langage simple : `npx @shuffle-dev/cli design create "page de destination pour ..."`. Le CLI renvoie un ID de projet ainsi que des URL d'édition/prévisualisation (et éventuellement une URL de capture d'écran).
6) Choisir les modèles (interactif, spécifique ou tous): Pour générer avec des modèles spécifiques : `npx @shuffle-dev/cli design create -m <id> "..."` (répétez `-m` ou utilisez des ID séparés par des virgules). Pour exécuter tous les modèles de conception actifs sans sélection interactive : ajoutez `--all`.
7) Télécharger automatiquement les fichiers générés après chaque exécution (facultatif): Ajoutez `--download [répertoire]` pour télécharger les fichiers du projet après chaque génération réussie, par exemple `npx @shuffle-dev/cli design create --download ./out "..."`.
8) Télécharger uniquement les fichiers source (facultatif): Lorsque vous utilisez `--download`, ajoutez `--source-only` pour extraire uniquement les fichiers source : `npx @shuffle-dev/cli design create --download ./out --source-only "..."`.
9) Générer des captures d'écran (facultatif): Ajoutez `--screenshot` pour générer une capture d'écran pour chaque projet créé : `npx @shuffle-dev/cli design create --screenshot "..."`.
10) Enregistrer les URL de sortie dans un fichier (facultatif): Ajoutez `--save-output <fichier>` pour stocker la sortie (y compris les URL) dans un fichier : `npx @shuffle-dev/cli design create --save-output results.json "..."`.
11) Redessiner un site web existant à partir d'une URL: Fournissez une URL en direct ainsi qu'une direction de refonte : `npx @shuffle-dev/cli redesign create https://example.com "..."`. Le CLI prend des captures d'écran de la page et génère des variantes redessinées avec le même contenu mais un nouveau look.
12) Ouvrir le projet généré dans l'éditeur Shuffle: Utilisez l'URL "Modifier" renvoyée (par exemple, `https://shuffle.dev/editor?project=...`) pour examiner et personnaliser la conception visuellement dans Shuffle.
13) Télécharger un projet ultérieurement par ID de projet: Si vous avez déjà un ID de projet, téléchargez-le avec : `npx @shuffle-dev/cli get <project_id> --output=./landing-page`.
14) Synchroniser un projet Shuffle localement (flux de travail facultatif): Pour maintenir un dossier local synchronisé avec un projet Shuffle, utilisez : `npx @shuffle-dev/cli sync <project_id>` (l'ID du projet se trouve dans l'URL de l'éditeur Shuffle).
15) Utiliser dans l'automatisation (CI/scripts/bots): Parce que tout est basé sur des commandes (invite, refonte d'URL, sélection de modèle, téléchargement, capture d'écran, sauvegarde de la sortie), vous pouvez l'exécuter dans des scripts, des tâches d'intégration continue ou des outils internes pour générer des variantes de conception et des artefacts reproductibles.
FAQ de Shuffle Design CLI
Shuffle Design CLI est un outil en ligne de commande qui vous permet de générer de nouvelles conceptions de sites web/pages de destination et de redessiner des sites web existants directement depuis le terminal, produisant un code HTML et un CSS Tailwind propres et éditables.
Articles populaires

Atoms : Une plateforme d'IA multi-agents qui transforme les idées en produits prêts à être lancés
May 22, 2026

Nano Banana SBTI : Qu'est-ce que c'est, comment ça marche et comment l'utiliser en 2026
Apr 15, 2026

Atoms : L'outil de création de produits IA qui redéfinit la création numérique en 2026
Apr 10, 2026

Kilo Claw : Comment déployer et utiliser un véritable agent d'IA "Faites-le pour vous" (Mise à jour 2026)
Apr 3, 2026







