使い方ガイドへスキップ
Baoyu Article Illustrator作者 Jim Liu (Baoyu)

Baoyu Article Illustrator スキル。

すべてのセクションを均等に飾るのではなく、記事の適切な箇所で論旨を図解します。

  • 編集用イラスト
  • コンテンツデザイン
ソースレビュー · Baoyu Article IllustratorSKILL.md
タスク 編集用イラスト 成果物 • 記事内の位置と目的を示した挿絵のアウトライン • 記事ごとに保存された画像プロンプトとラスター画像 • 関連する箇所の近くに挿入されたMarkdownの画像参照 開始前に 利用可能なラスター画像生成バックエンドと、このスキルの参照ファイルおよび設定ファイルが必要です。バックエンドへのアクセスと費用は別です。
編集部による要約 · ソース確認日 2026-10-07 · 生成例ではありません

01 機能概要

記事で説明が必要な箇所に挿絵を配置

記事の内容を踏まえた挿絵ワークフローです。タイプ、スタイル、配色を選べ、プロンプトを保存し、Markdownで配置します。

ソースに基づくワークフロー実行ベンチマークではありません

作業の進め方

Baoyu Article Illustratorは記事の構成を把握し、どこに図があれば理解が深まるかを確認するところから始めます。情報の形式、描画スタイル、配色を切り分けるため、プロセスはフローチャートに、比較は別の構成にしても、ビジュアルの一貫性を保てます。ソースでは、比喩をそのまま描くのではなく、根底にある概念を視覚化することを推奨しています。

このワークフローでは、各画像の位置、目的、ファイル名を記録したアウトラインを作成し、続いてすべての挿絵のプロンプトを保存します。生成されたラスター画像は、相対パスのMarkdownで記事から参照されます。これは編集用イラストの計画と制作の調整であり、ファクトチェックサービスでも、利用可能な画像バックエンドの代わりでもありません。

想定される成果物

  • 記事内の位置と目的を示した挿絵のアウトライン
  • 記事ごとに保存された画像プロンプトとラスター画像
  • 関連する箇所の近くに挿入されたMarkdownの画像参照
サンプルブリーフを見る

ブリーフからレビューまで

  1. 01
    視覚化の必要性を見つける

    記事の論点を読み、場面、流れ、比較、概念構造によって理解しやすくなる説明を見つけます。

  2. 02
    画像の方針を確認する

    タイプ、密度、描画スタイル、配色、言語を選びます。提供されたデータと、参照画像の意味のある役割は維持します。

  3. 03
    生成して配置する

    描画前にプロンプトを保存し、ラベルと概念を確認してから、正しい相対パスの画像参照を記事に挿入します。

02 利用場面

使う場面

利用可能なラスター画像生成バックエンドと、このスキルの参照ファイルおよび設定ファイルが必要です。バックエンドへのアクセスと費用は別です。

向いているケース

  • 技術解説文章だけでは追いにくいプロセスや関係が含まれる長い記事に役立ちます。
  • 統一感のある編集用セット共通のビジュアル処理を保ちつつ、情報構造の異なる複数の挿絵が必要な場合に適しています。

確認すべき制限

  • ラスターバックエンドが必須このスキルは画像の計画と調整を行いますが、利用可能な生成バックエンドが必要です。ソースでは、SVGやHTMLを互換的な代替手段として扱っていません。
  • 記事内の事実は別途確認が必要数値や用語は記事から取られます。挿絵ワークフローがそれらを独自に検証することはありません。

用意する入力

  • 記事のソース記事全文と、変更してはならない内容を示してください。
  • 挿絵の密度必要最小限の少数の画像にするか、セクションごとのより密な構成にするかを選びます。
  • 参考ビジュアル各参考画像が題材、配色、スタイルのどれを示すのかを説明してください。

03 重要な判断

重要な判断

  1. 位置と目的を記録

    画像は特定の説明に紐づくため、不要な装飾を取り除きやすくなります。

  2. 独立したデザイン要素

    図ごとに配色や描画方法を変えなくても、情報構造だけを変えられます。

04 依頼例

焦点を絞ったブリーフで試す

以下のサンプルブリーフはテストされていません。使用前にスキルのセットアップを確認してください。

セットアップを確認

フォルダ全体を保持し、設定のセットアップを完了してください。描画済みの挿絵を約束する前に、実際に使える画像バックエンドを選択してください。

上流のソースファイル
https://github.com/JimLiu/baoyu-skills/blob/1567581c26ec29f4216c6e6835415bf30343b0e3/skills/baoyu-article-illustrator/SKILL.md

利用可能なラスター画像生成バックエンドと、このスキルの参照ファイルおよび設定ファイルが必要です。バックエンドへのアクセスと費用は別です。

まず1つの成果物から

スキルを実行する前に、このブリーフの範囲、素材、制約を調整してください。

サンプルブリーフ
baoyu-article-illustratorを使って、デザイントークン移行に関するこの記事の挿絵を3点計画してください。各画像の配置場所と、それが何を説明するのかを示してください。控えめな配色で統一しつつ、フローチャート、比較、フレームワークは内容に必要な場合にのみ選んでください。記事の用語は保持し、生成前にプロンプトを保存し、アウトラインの承認を待ってください。

結果を確認

実際の出力を、以下の確認可能な基準で点検してください。

  • 各画像が、挿入位置の文章を分かりやすくしている。
  • ラベルとデータが、作り上げた例ではなく記事の内容と一致している。
  • Markdownの参照が、確認済みの画像ファイルに解決され、ビジュアル処理に統一感がある。

OpenDesignは、コーディングエージェント向けのローカルデザインワークスペースを提供します。この掲載は、スキルが同梱されていること、または外部ツール、認証情報、ソフトウェア依存関係が含まれていることを意味しません。

05 ソースとライセンス

ソースとライセンス

このページは、下記にリンクされた固定のソースリビジョンについて説明しています。上流の動作や要件は変更される可能性があります。

ソースの所有者
Jim Liu (Baoyu)
リポジトリ
JimLiu/baoyu-skills
ライセンス
MIT
確認したスナップショット
2026-10-07 · 1567581c26ec
編集用ソース要約
記事の内容を踏まえた挿絵ワークフローです。タイプ、スタイル、配色を選べ、プロンプトを保存し、Markdownで配置します。

リンク先のソースに基づくOpenDesignによるオリジナルの要約です。リポジトリのスター数は日付時点の人気の指標であり、スキルの利用数や品質スコアではありません。

06 開始前の質問

始める前の質問

すべての見出しに画像を追加しますか?

必ずしもそうではありません。密度は意図的に選ぶもので、ソースでも挿絵が価値を加える箇所を問うています。

カバー画像ジェネレーターとの違いは?

記事内の複数のビジュアルとその読み進める位置を計画します。カバー向けワークフローは、メインとなる1枚の画像に集中します。

生成されたラベルが誤っていた場合は?

ソースでは、ビットマップの上に代わりの文字を描き足すのではなく、プロンプトを修正して再生成するか、文字を減らした表現にするよう求めています。

OpenDesign

次のデザイン反復に向けて余裕を持たせましょう。

ブリーフ、素材、デザイン作業をローカルワークスペースにまとめて管理します。ワークフローに追加する前に、スキル自体のセットアップを確認してください。

上流のソースファイル
https://github.com/JimLiu/baoyu-skills/blob/1567581c26ec29f4216c6e6835415bf30343b0e3/skills/baoyu-article-illustrator/SKILL.md