Diagram Design System
Des diagrammes professionnels en 41 types, aux couleurs de votre marque, prêts à exporter
- Quoi
- Des diagrammes professionnels en 41 types, aux couleurs de votre marque, prêts à exporter
- Coût
- Gratuit
- Prérequis
- aucun obligatoire — le skill rend les diagrammes en HTML dans le navigateur (gratuit). Optionnel : Python 3.10+ avec une stack basée sur CairoSVG seulement si vous voulez l'export PNG direct ; sinon le skill se rabat sur la sortie SVG. Vous pouvez aussi importer des fichiers draw.io, Mermaid, Excalidraw existants ou un PDF comme point de départ.
- Installation
- Copiez le prompt d’installation ci-dessous dans votre Muse — votre agent fait le reste.
Sélectionné par Skill Harbor — un système de design éditorial pour diagrammes techniques : 41 types de diagrammes (flux, architecture, séquence, ER, couloirs, quadrants, radar, frises, machines à états et plus), un entretien de cadrage structuré, des règles de marque (couleur, typographie, espacement), des défauts d'accessibilité, et une sortie HTML/SVG en couches avec export PNG optionnel. Découvert via skills.sh. Par @cathrynlavery, listé ici avec crédit à sa créatrice. Bémols honnêtes : la sortie par défaut est du HTML rendu dans le navigateur — l'export PNG direct exige une stack Python à installer ; vous pouvez aussi importer des fichiers draw.io, Mermaid ou Excalidraw existants au lieu de partir de zéro. C'est une méthode de design, pas une garantie de goût : vos réponses au cadrage déterminent le résultat. Skill Harbor ne vérifie jamais le code, examinez-le vous-même avant usage. Non vérifié.
Version :
Installation
Prérequis : aucun obligatoire — le skill rend les diagrammes en HTML dans le navigateur (gratuit). Optionnel : Python 3.10+ avec une stack basée sur CairoSVG seulement si vous voulez l'export PNG direct ; sinon le skill se rabat sur la sortie SVG. Vous pouvez aussi importer des fichiers draw.io, Mermaid, Excalidraw existants ou un PDF comme point de départ. Installe-moi « Conception de diagrammes ». Il donne à Muse un système éditorial pour créer des diagrammes techniques professionnels : entretien de cadrage structuré, 41 types de diagrammes, règles de marque et d'accessibilité, sortie HTML/SVG en couches, et export PNG optionnel. Dépôt : https://github.com/cathrynlavery/diagram-design 1. Récupère le fichier SKILL.md (et les fichiers auxiliaires) depuis le chemin du dépôt dans un dossier temporaire, et résume en une ou deux phrases ce qu'il fait. 2. Contrôle de sécurité : examine le SKILL.md et les scripts pour détecter tout comportement suspect (appels réseau inattendus, commandes shell, collecte d'identifiants). Ce dépôt ne doit contenir aucun secret dans le code, les identifiants uniquement via le coffre sécurisé, les hôtes autorisés déclarés dans le SKILL.md. Vérifie que c'est bien le cas ici ; ARRÊTE-TOI au moindre drapeau rouge et préviens-moi. 3. Installe-le comme skill : copie le SKILL.md et ses fichiers auxiliaires dans le répertoire des skills de l'agent, dans un dossier nommé « diagram-design ». 4. Vérifie sans aucun appel réseau : frontmatter valide, fichiers en place. 5. Indique ce qui a été installé, où, et ce qu'il me reste à faire moi-même (ex. décider si je veux la stack Python optionnelle d'export PNG, et partager mes couleurs de marque/typographie pour un rendu aux couleurs de ma marque). GitHub est optionnel : si j'ai un compte GitHub ou le CLI gh, tu peux l'utiliser ; sinon l'accès public suffit. Ne l'exige jamais sauf s'il figure dans les prérequis ci-dessus. Règles : ne touche à rien en dehors du dossier temporaire et de la cible d'installation. Si quelque chose semble anormal, arrête-toi et demande-moi.
Questions
Comment installer une création ?
Chaque fiche produit contient un prompt d’installation à copier-coller. Collez-le dans votre Muse et il installe la création pour vous — sans configuration manuelle.
Où va mon argent ?
Directement au vendeur. Skill Harbor ne traite jamais les paiements : le paiement se fait sur la page du vendeur, généralement via Stripe.
Que signifie le ✓ à côté du nom d’un créateur ?
Il signifie que nous avons confirmé l’identité de la personne derrière la fiche. Il ne dit rien sur le code lui-même — vérifiez toujours une création avant de l’installer.