Redesign

Qu'est-ce que Redesign ?

Redesign est un outil local gratuit et open source qui permet à Claude de créer des carrousels LinkedIn et Instagram en utilisant votre propre codebase comme guide de style. Vous décrivez ce que vous voulez, et Claude construit les slides dans un éditeur de canvas que vous pouvez prévisualiser et modifier.

L'idée principale est d'éviter de partir d'une page blanche : Redesign extrait de vrais composants (tels que cartes, boutons, icônes et choix de typographie) de votre dépôt et les place dans le post, pour que le résultat s'aligne sur votre système de design existant.

Fonctionnalités principales

• Flux de travail de design local et open source (licence MIT) : L'outil s'exécute sur votre machine et est sous licence MIT.
• Style piloté par la codebase : Indiquez à Redesign votre dépôt pour que Claude utilise vos icônes, boutons, couleurs, polices et structure de composants existants comme base pour les nouveaux posts.
• Éditeur de canvas avec prévisualisation en direct : Claude génère des calques et valide les changements avant de les sauvegarder, et vous pouvez suivre la construction dans l'interface.
• Actifs réutilisables issus de calques composés : Vous pouvez sauvegarder des calques ou compositions comme actifs pour les réutiliser dans de futurs posts.
• Intégration MCP pour Claude Code : Redesign est un MCP qui s'intègre aux workflows Claude Code sans nécessiter de clé API pour Redesign lui-même.
• Aucun serveur contrôlé par Redesign : La page indique que Redesign n'a pas de backend qu'il contrôle ; les posts, images et toute clé API restent sur votre machine.

Comment utiliser Redesign

1. Installation en une commande : Exécutez npx @nodewave-io/redesign dans un terminal pour configurer l'app canvas et auto-enregistrer le MCP avec Claude Code.
2. Démarrez le canvas local : Le workflow mentionne l'ouverture de http://localhost:3000 pour voir l'interface de construction.
3. Connectez si les outils n'apparaissent pas : Si vous ne voyez pas les outils dans Claude Code après redémarrage, exécutez npx @nodewave-io/redesign connect.
4. Donnez une instruction : Décrivez le post souhaité. La page indique que Claude crée alors les calques, l'alignement et les validations, et sauvegarde les slides résultants dans l'éditeur.
5. Modifiez et exportez : Utilisez l'éditeur de canvas pour ajuster le contenu des slides et le code des composants, puis exportez le carrousel pour la plateforme cible.

Cas d'usage

• Carrousels de lancement brandés pour LinkedIn/Instagram : Générez un carrousel multi-slides dont les éléments visuels (icônes, styles de cartes, formes de boutons et typographie) proviennent de vos composants de site existants.
• Itération rapide sur des posts promotionnels : Modifiez le copy, la mise en page ou l'espacement via des prompts, tout en conservant les mêmes définitions de composants sous-jacentes de votre dépôt.
• Transformation de sections de slides performantes en templates : Sauvegardez un ensemble de calques ou compositions (ex. : section CTA ou mise en page de slide) comme actifs réutilisables pour les posts de la semaine prochaine.
• Design avec la bibliothèque de composants existante d'une équipe : Pour les équipes qui maintiennent déjà des composants UI en code, Redesign les utilise comme source de vérité partagée au lieu de recréer manuellement les designs.
• Workflows local-first sans upload d'actifs : Si vous préférez une configuration où Redesign n'exécute pas de backend, vous gardez la génération et vos actifs sur votre machine.

FAQ

• Qu'est-ce que Redesign ? Redesign est un outil local gratuit et open source qui permet à Claude de concevoir des carrousels LinkedIn et Instagram dans un éditeur de canvas contrôlé.

• Redesign est-il vraiment gratuit ? Oui. Le site indique qu'il est sous licence MIT et s'exécute sur votre machine. Vous payez Anthropic pour votre usage de Claude, tandis que l'outil Redesign lui-même est gratuit.

• De quoi ai-je besoin pour l'exécuter ? La page précise Node.js 20+ et Claude Code. Elle note aussi qu'une commande terminal configure le reste.

• Redesign uploade-t-il quoi que ce soit sur un serveur ? Non. La page indique que Redesign n'a pas de backend contrôlé par le projet, et que les posts, images et toute clé API restent sur votre machine.

• Comment faire apparaître les outils dans Claude Code ? Redémarrez Claude Code (il lit la config MCP au démarrage). Si les outils n'apparaissent toujours pas, exécutez npx @nodewave-io/redesign connect pour enregistrer le MCP.

Alternatives

• Outils de posts sociaux basés sur templates : Services qui permettent de concevoir des carrousels via des templates. Ils n'intègrent généralement pas votre codebase existante comme guide de style, ce qui peut nécessiter plus de temps pour matcher manuellement votre marque.
• Outils de design avec recréation manuelle de composants : Outils où vous construisez ou recréez des composants UI à la main (ex. : dans un éditeur visuel). Cela peut être flexible pour la mise en page, mais ne réutilise pas automatiquement les composants de votre dépôt.
• Workflows de prévisualisation UI code-first : Approches qui rendent le design en code et le prévisualisent localement. Elles conviennent aux équipes travaillant déjà sur des codebases UI, mais ne fournissent pas nécessairement la même génération et validation de slides pilotées par Claude décrites pour Redesign.