「図を作る」作業に、どれくらい時間をかけていますか。

記事を書き終えたあと、ヘッダー画像を作り、フローチャートを描き、インフォグラフィックを仕上げる。内容を書くより図を整えるほうに時間がかかる、という経験は珍しくありません。

baoyu-skills は、Claude Code（AIエージェント）に追加できるオープンソースのスキル集です。

コマンド一行で、カバー画像からフローチャート、さらには漫画まで、多様な図を生成できます。

baoyu-skillsとは

baoyu-skills は、AI研究者のBaoyu氏が公開したClaude Code向けスキル集で、21種類のスキルが収録されています。翻訳・整形・SNS投稿など日常的なコンテンツ作業を自動化するものが揃っていますが、特に際立っているのが「図を生成するスキル」の充実度です。

スキルはコマンドとして動作します。たとえば /baoyu-infographic article.md と入力するだけで、記事の内容を読んで最適なインフォグラフィックを提案・生成してくれます。

詳細な使い方や全スキルの一覧は、baoyu-skills詳細紹介ページ を確認してください。

生成できる図の種類

1. カバー画像 — baoyu-cover-image

記事のヘッダー画像を生成します。markdownファイルを渡すと内容を分析し、タイプ・カラーパレット・レンダリングスタイルを組み合わせてデザインを提案・生成します。

/baoyu-cover-image article.md

スタイルを自分で指定することもできます。画像タイプ（hero / conceptual / metaphor など）とレンダリングスタイル（手描き / フラットベクター / 水彩 など）の組み合わせだけで77通り以上の見た目が作れます。

/baoyu-cover-image article.md --type conceptual --palette warm --rendering hand-drawn

2. インフォグラフィック — baoyu-infographic

記事の内容を1枚の図にまとめます。20種類のレイアウト × 17種類のスタイルから最適な組み合わせを提案してくれるため、「どのレイアウトにすればいいか」を自分で考える必要がありません。

# 自動提案モード（まずはこれから）
/baoyu-infographic article.md

# レイアウトとスタイルを指定する場合
/baoyu-infographic article.md --layout funnel --style craft-handmade

代表的なレイアウト（7種）

迷ったときはオプションなしで実行してみてください。内容を読んで最適な組み合わせを提案してくれます。

3. フローチャート・構成図 — baoyu-diagram

フローチャートやシステム構成図をSVG形式で生成します。このスキルの特徴は、画像生成AIを一切使わない点です。ClaudeがSVGコードを直接書くため、生成が速く、ファイルも軽い。ダークモードにも自動で対応しています。

# トピックをテキストで渡す
/baoyu-diagram "ユーザー認証フロー"

# 図の種類を指定する
/baoyu-diagram "マイクロサービス構成" --type structural
/baoyu-diagram "OAuth 2.0フロー" --type sequence

4. 記事への挿図 — baoyu-article-illustrator

長い記事を読んで「ここに図があるといい」という箇所を自動で判断し、挿図を生成して差し込みます。どの段落に何を入れるかを自分で考えなくていい点が、実際に使ってみると一番楽に感じます。

/baoyu-article-illustrator article.md

# スタイルを指定する場合
/baoyu-article-illustrator article.md --style blueprint

スタイルは notion（ミニマルな線画）、blueprint（技術図面風）、warm（温かみのあるイラスト）、watercolor（水彩風）など8種類から選べます。

5. スライド画像 — baoyu-slide-deck

記事の内容からスライド画像を一括生成します。生成後は自動的にPPTXとPDFにも変換されます。

/baoyu-slide-deck article.md

# スタイルとスライド枚数を指定
/baoyu-slide-deck article.md --style chalkboard --slides 10

プリセットは16種類。corporate（ビジネス提案）、chalkboard（教育・チュートリアル）、minimal（シンプル・役員向け）、bold-editorial（製品ローンチ）など、用途に合わせて選べます。

6. 知識コミック — baoyu-comic

記事の内容を漫画形式に変換します。難しいテーマや抽象的な概念を、コミックのパネルで視覚的に伝えたいときに活躍します。

/baoyu-comic article.md --art manga --tone warm
/baoyu-comic article.md --art ink-brush --tone dramatic

アートスタイル（5種）

トーン（7種）：neutral（教育的・落ち着いた）、warm（懐かしさ・温かみ）、dramatic（強調・インパクト）、energetic（活発・明るい）、vintage（歴史・時代感）、romantic（柔らかく装飾的）、action（スピード感・躍動）

技術の仕組みを manga × neutral で解説したり、歴史的なエピソードを ink-brush × vintage で描いたりと、テーマに合わせた組み合わせが見つかります。

インストール方法

Claude Codeで次のコマンドを実行します。

npx skills add jimliu/baoyu-skills

21種類すべてがインストールされます。使わないスキルは読み込み時の負荷になるため、よく使うものだけ選んでインストールすることも可能です。

まとめ

「図を作る」作業の手間を減らしながら、スタイルや構成は自分でコントロールできる。それが baoyu-skills の一番の魅力です。記事全体を図にしたいときは /baoyu-infographic、フローや構成を描きたいときは /baoyu-diagram が向いています。