DevOps95

Skill Canvas

Skill Canvas - VSCode visual workflow editor for Claude Code agents and skills

r/ClaudeAIu/Alaturqua29 septembre 2026

Capture du projet

Résumé

Skill Canvas est une extension VS Code qui permet de créer et d'éditer des workflows d'agents et de compétences pour Claude Code de manière visuelle. Elle utilise un canvas pour représenter les étapes et les connexions entre les agents, les compétences et les outils, et peut exporter les workflows sous forme de fichiers Claude Code. L'outil est gratuit et disponible sur le marché VS Code.

Pourquoi c’est intéressant

Skill Canvas offre une approche visuelle innovante pour la création et l'édition de workflows d'agents et de compétences, ce qui peut faciliter le développement et la maintenance de ces workflows. L'utilisation de Claude Code pour générer les fichiers d'agents et de compétences ajoute une couche d'automatisation et de flexibilité.

Comment Claude est utilisé

Développé en grande partie avec Claude Code, l'extension utilise Claude Code pour générer des fichiers d'agents et de compétences à partir des workflows créés sur le canvas.

Idées dérivées

  1. 01

    Extension pour d'autres éditeurs de code

    Créer un outil similaire pour d'autres plateformes de développement, comme IntelliJ ou Sublime Text, pour étendre la compatibilité de Skill Canvas.

  2. 02

    Plateforme de partage de workflows

    Développer un système de partage et de collaboration pour les workflows créés avec Skill Canvas, permettant aux utilisateurs de partager et de réutiliser des workflows existants.

  3. 03

    Intégration avec d'autres outils de développement

    Intégrer Skill Canvas avec d'autres outils de développement, comme des systèmes de gestion de versions ou des outils de débogage, pour améliorer l'efficacité du développement de workflows.

Afficher le post original
I built Skill Canvas, a VS Code extension for sketching multi-step agent workflows on a canvas and turning them into files Claude Code can use directly. You put agents, skills and tools on the canvas, connect them, and add decision and retry paths. Then you export the whole thing as standard Claude Code agent and skill files. It can also export for GitHub Copilot. It works the other way too. You can import your existing agents and skills, edit them on the canvas and export them again. I built it with Claude Code and Opus 5.5. I came up with the idea, the block types and how the canvas should behave. Claude Code wrote most of the code, and I went feature by feature: First the basic canvas with connectable nodes Then decision and retry paths, which needed changes to the graph model underneath, not just more arrows Then the exporter that maps each block to the Claude Code file format And finally import, which was the hardest part, because the canvas has to rebuild all the connections from plain files For the UI design I used the impeccable plugin in Claude Code. It's free on the VS Code Marketplace: https://marketplace.visualstudio.com/items?itemName=alaturqua.skill-canvas Project page: https://alaturqua.github.io/skill-canvas/ I'd appreciate feedback, especially from people who run multi-step workflows in Claude Code.