/ Annuaire / Playground / baoyu-skills
● Communauté JimLiu ⚡ Instantané

baoyu-skills

par JimLiu · JimLiu/baoyu-skills

Transformez des idées en visuels partageables — cartes Xiaohongshu, infographies, diagrammes SVG, présentations — le tout depuis des prompts en langage naturel.

baoyu-skills regroupe plus de 20 skills de contenu visuel pour Claude Code. Fort sur les formats de l'internet chinois (cartes Xiaohongshu, prêt pour WeChat), mais les skills SVG/infographie/slides sont language-agnostiques. Inclut le routage multi-fournisseurs pour la génération d'images (OpenAI, Google, DashScope, MiniMax) et des utilitaires de contenu comme l'extraction de transcription YouTube et URL-vers-markdown.

Pourquoi l'utiliser

Fonctionnalités clés

Démo en direct

Aperçu en pratique

prêt

Installation

Dépôt de l’auteur · Documentation officielle des Skills Claude

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.

Déroulement
  1. 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é
  2. 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
  3. 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
  1. 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
  2. Générer
    Generate it in 'editorial' style. Use my brand colors #0F172A and #38BDF8.✓ Copié
    → Sortie SVG ; aperçu dans le chat
  3. 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
  1. 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
  2. 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
  1. Récupérer la transcription
    Use baoyu-skills YouTube transcript skill on <url>. Translate if non-English.✓ Copié
    → Transcription nettoyée dans le chat
  2. 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

OutilEntréesQuand appelerCoû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

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

AlternativeQuand l'utiliserCompromis
skyll-skillVous voulez un studio de cartes visuelles ciblé plutôt qu'un bundle de 20 skillsMoins de surface, plus ciblé
AntV mcp-server-chartVous n'avez besoin que de graphiques de données, pas de cartes visuelles/illustrationsForme 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