baoyu-skills — Cas d'usage, Installer & Démo en direct

Pourquoi l'utiliser

Fonctionnalités clés

Générateur de séries de cartes Xiaohongshu avec plusieurs mises en page/styles
Générateur d'infographies avec 21 mises en page × 17 styles visuels
Skills de diagrammes SVG : organigramme / séquence / structurel / illustratif
Skill de présentation + illustration d'articles + skills comics
Routage multi-fournisseurs pour la génération d'images (OpenAI / Google / DashScope / MiniMax)
Documentation bilingue ; nombreuses intégrations internet chinois

Démo en direct

Aperçu en pratique

prêt

Installer

Choisissez votre client

~/Library/Application Support/Claude/claude_desktop_config.json · Windows: %APPDATA%\Claude\claude_desktop_config.json

{
  "mcpServers": {
    "baoyu-skill": {
      "command": "git",
      "args": [
        "clone",
        "https://github.com/JimLiu/baoyu-skills",
        "~/.claude/skills/baoyu-skills"
      ],
      "_inferred": true
    }
  }
}

Ouvrez Claude Desktop → Settings → Developer → Edit Config. Redémarrez après avoir enregistré.

~/.cursor/mcp.json · .cursor/mcp.json

{
  "mcpServers": {
    "baoyu-skill": {
      "command": "git",
      "args": [
        "clone",
        "https://github.com/JimLiu/baoyu-skills",
        "~/.claude/skills/baoyu-skills"
      ],
      "_inferred": true
    }
  }
}

Cursor utilise le même schéma mcpServers que Claude Desktop. La config projet l'emporte sur la globale.

VS Code → Cline → MCP Servers → Edit

{
  "mcpServers": {
    "baoyu-skill": {
      "command": "git",
      "args": [
        "clone",
        "https://github.com/JimLiu/baoyu-skills",
        "~/.claude/skills/baoyu-skills"
      ],
      "_inferred": true
    }
  }
}

Cliquez sur l'icône MCP Servers dans la barre latérale Cline, puis "Edit Configuration".

~/.codeium/windsurf/mcp_config.json

{
  "mcpServers": {
    "baoyu-skill": {
      "command": "git",
      "args": [
        "clone",
        "https://github.com/JimLiu/baoyu-skills",
        "~/.claude/skills/baoyu-skills"
      ],
      "_inferred": true
    }
  }
}

Même format que Claude Desktop. Redémarrez Windsurf pour appliquer.

~/.continue/config.json

{
  "mcpServers": [
    {
      "name": "baoyu-skill",
      "command": "git",
      "args": [
        "clone",
        "https://github.com/JimLiu/baoyu-skills",
        "~/.claude/skills/baoyu-skills"
      ]
    }
  ]
}

Continue utilise un tableau d'objets serveur plutôt qu'une map.

~/.config/zed/settings.json

{
  "context_servers": {
    "baoyu-skill": {
      "command": {
        "path": "git",
        "args": [
          "clone",
          "https://github.com/JimLiu/baoyu-skills",
          "~/.claude/skills/baoyu-skills"
        ]
      }
    }
  }
}

Ajoutez dans context_servers. Zed recharge à chaud à la sauvegarde.

claude mcp add baoyu-skill -- git clone https://github.com/JimLiu/baoyu-skills ~/.claude/skills/baoyu-skills

Une seule ligne. Vérifiez avec claude mcp list. Supprimez avec claude mcp remove.

Cas d'usage

Usages concrets : baoyu-skills

Générer une série de 9 cartes Xiaohongshu depuis un article

👤 Créateurs de contenu sur RED / Xiaohongshu ⏱ ~15 min beginner

Quand l'utiliser : Vous avez écrit un article long format et avez besoin de visuels carrés pour la plateforme.

Prérequis

Skill installé — git clone https://github.com/JimLiu/baoyu-skills ~/.claude/skills/baoyu-skills

Déroulement

Choisir la mise en page + style

Use baoyu-skills. From article.md, generate a 9-card Xiaohongshu series in 'minimal' style with serif title font.✓ Copié

→ 9 cartes SVG/PNG générées, ratio carré
Itérer sur la couverture

Cover (card 1) is too plain — try 'magazine' style with a number badge.✓ Copié

→ Nouvelles variantes de couverture ; vous en choisissez une
Exporter

Export all 9 cards as PNG at 1080×1080, save to /posts/<slug>/.✓ Copié

→ PNGs prêts à uploader

Résultat : Série de cartes prête à publier en moins de 10 minutes par post.

Pièges

Le texte des cartes déborde sur les longues phrases chinoises — Demander au skill de résumer le texte par carte à ≤24 caractères ou de réduire automatiquement la police

Combiner avec : humanizer-skill

Créer une infographie depuis un petit jeu de données

👤 Marketeurs, analystes, toute personne présentant des chiffres ⏱ ~20 min beginner

Quand l'utiliser : Vous avez un CSV avec 5–10 statistiques et voulez une infographie unique et partageable.

Déroulement

Choisir la mise en page

Use baoyu-skills. From data.csv (5 rows), pick the most appropriate of the 21 infographic layouts.✓ Copié

→ Recommandation de mise en page avec justification
Générer

Generate it in 'editorial' style. Use my brand colors #0F172A and #38BDF8.✓ Copié

→ Sortie SVG ; aperçu dans le chat
Affiner

Add a 1-line takeaway under each stat. Reduce icon weight by 30%.✓ Copié

→ SVG affiné

Résultat : Infographie prête pour blog/réseaux sociaux — pas besoin de Figma.

Pièges

21 mises en page × 17 styles = paralysie décisionnelle — Laisser le skill recommander selon la forme des données ; ne surpasser que si vous avez une opinion forte

Combiner avec : filesystem

Générer un diagramme d'architecture SVG depuis une description

👤 Ingénieurs rédigeant de la documentation ⏱ ~12 min beginner

Quand l'utiliser : Vous avez besoin d'un diagramme système pour un README et ne voulez pas ouvrir un outil de dessin.

Déroulement

Décrire le système

Use baoyu-skills. Generate a structural diagram for: web client → API gateway → 3 services (auth, billing, content) → Postgres + Redis. Show external dependencies.✓ Copié

→ SVG produit avec nœuds nommés
Annoter

Add HTTP/gRPC labels on edges; mark Postgres as 'primary' and 'replica'.✓ Copié

→ Annotations appliquées

Résultat : Diagramme dans le dépôt ; s'affiche dans tout lecteur markdown.

Pièges

Le diagramme devient illisible avec de nombreux nœuds — Diviser en deux diagrammes (vue globale + détail par service) ; ne jamais tout entasser

Combiner avec : filesystem

Transformer une conférence YouTube en brouillon d'article

👤 Blogueurs réutilisant du contenu vidéo ⏱ ~25 min beginner

Quand l'utiliser : Vous avez regardé une excellente conférence et voulez un résumé prêt à publier.

Déroulement

Récupérer la transcription

Use baoyu-skills YouTube transcript skill on <url>. Translate if non-English.✓ Copié

→ Transcription nettoyée dans le chat
Restructurer

Convert to a 1200-word post: hook, 4 sections matching the talk's arc, takeaways. Cite timestamps.✓ Copié

→ Brouillon de post avec citations d'horodatages

Résultat : Brouillon d'article sourcé en 15 minutes.

Pièges

Les transcriptions automatiques entendent mal les termes techniques — Demander au skill de signaler les mots peu fiables ; vérifier manuellement sur la vidéo

Combiner avec : humanizer-skill

Combinaisons

Associez-le à d'autres MCPs pour un effet X10

baoyu-skill + humanizer-skill

Générer cartes/posts, puis supprimer les marqueurs IA

Generate the post draft via baoyu-skills, then run humanizer on it before publishing.✓ Copié

baoyu-skill + filesystem

Sauvegarder les sorties dans un dépôt de contenu

Save all generated cards under /content/<slug>/ with a stable naming convention.✓ Copié

Outils

Ce que ce MCP expose

Outil	Entrées	Quand appeler	Coût
make_xhs_cards	source_text, layout, style, count	Séries de cartes pour RED / Xiaohongshu	API de génération d'images pour les images rendues
make_infographic	data, layout, style, palette?	Visualisation de données en image unique	0 (SVG rendu par templates)
make_svg_diagram	type (flow\|seq\|struct\|illust), description	Diagrammes pour la documentation	0
make_slides	outline, theme	Decks pour présentations rapides	0
yt_transcript	url, translate_to?	Réutiliser du contenu vidéo	0
url_to_md	url	Citer proprement un article web	0

Coût et limites

Coût d'exécution

Quota d'API: Les skills de génération d'images dépendent du quota du fournisseur choisi
Tokens par appel: Skills SVG/template : faible. Génération d'images : variable selon le modèle
Monétaire: Gratuit (skill) ; payer la génération d'images si utilisée
Astuce: Utiliser les skills basés sur des templates SVG (cartes, infographies, diagrammes) — ils n'appellent pas de modèles payants

Sécurité

Permissions, secrets, portée

Portées minimales : filesystem-write (pour les sorties)

Stockage des identifiants : Clés API de génération d'images via variables d'env ; le skill lit depuis l'env, pas commité

Sortie de données : Uniquement lors de l'utilisation des sous-skills de génération d'images ; les skills SVG/template sont locaux

Les sorties peuvent contenir de la propriété intellectuelle de marque si vous intégrez des logos/photos — assurez-vous d'avoir les droits

Dépannage

Erreurs courantes et correctifs

Les caractères chinois s'affichent en cases vides

Installer une police compatible CJK ; le skill fournit une liste de repli mais l'OS local peut manquer une correspondance

Vérifier : Vérifier les polices disponibles ; installer Noto Sans CJK

Le sous-skill de génération d'images échoue

Vérifier la variable d'env du fournisseur ; le fournisseur peut être en panne ou à court de crédits

Débordement de texte dans les cartes

Fournir un texte plus court par carte (≤24 caractères pour le titre) ou passer auto_shrink=true

Le SVG ne s'affiche pas dans README GitHub

Convertir en PNG pour GitHub (il supprime certaines balises SVG) ; le SVG fonctionne bien dans la plupart des blogs

Alternatives

baoyu-skills vs autres

Alternative	Quand l'utiliser	Compromis
skyll-skill	Vous voulez un studio de cartes visuelles ciblé plutôt qu'un bundle de 20 skills	Moins de surface, plus ciblé
AntV mcp-server-chart	Vous n'avez besoin que de graphiques de données, pas de cartes visuelles/illustrations	Forme différente — centré sur les graphiques

Plus

Ressources

📖 Lire le README officiel sur GitHub

🐙 Voir les issues ouvertes

🔍 Parcourir les 400+ serveurs MCP et Skills