mcpField
G
generate-images

generate-images

github.com/ken-guruクリエイティブ・メディア170 回インストール1 週間前に更新
リポジトリ

generate-images について

generate-imagesは、プロジェクトのIMAGE_SPEC.mdを読み、AI画像生成APIを呼び出してPNGを保存するメディアレンダリングスキルです。プロジェクト用の画像を作る人向けで、一括または1枚ずつの確認に対応し、結果に応じて画像フェーズの状態を更新します。

主な機能

  1. 01仕様書から画像生成項目を読み込み
  2. 02一括または1枚ずつ画像を生成
  3. 03対象範囲の選択と既存ファイルの上書き
  4. 04画像ごとの確認、再生成、停止
  5. 05結果に応じた画像フェーズ状態の更新

活用シーン

  1. 01プロジェクトのスライド用画像を生成
  2. 02不足分または選択した画像だけを生成
  3. 03結果を1枚ずつ確認して再生成を判断

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/ken-guru/skills --skill generate-images

インストール後、Claude Code で/generate-imagesを入力して読み込まれたか確認します。

同梱ファイル

SKILL.md と一緒にインストールされる参考資料やスクリプト。

PROVIDERS.md
evals/
generate-images.json
scripts/
.gitignore
check-bundle.mjs
package-lock.json
package.json
scripts/src/
generate-images.js

詳細

画像を生成する(メディアレンダラー)

IMAGE_SPEC.md を読み込み、各項目のプロンプトを AI 画像生成 API に送信し、生成された PNG ファイルをプロジェクトの images/ フォルダーに保存します。

出力の文体

スコープに関する質問、レビュー用プロンプト、結果レポートには、軽く自然な人間らしい表現を取り入れてください。プロンプトとユーザーが指定した Media Intent は、受け渡す際にそのまま保持してください。ファイル名、パス、コマンド、状態値も正確に保ってください。プレゼンテーションに表示するテキストを承認する前に、スタンドアロンの unslop Skill を必須の完全な編集工程として実行し、DISCOVERY.json.editorialPreferences を使用してください。契約上、正確な文言が求められる箇所では、プロンプトと機械可読なメディアメタデータをそのまま保持してください。

プロトコル:Media Scope を解決し、既定では Batch(要望があれば Interactive)で処理し、結果をレビューして報告します。所有するメディアフェーズのみを更新し、キャンセルまたは失敗時は保留状態のままにして、無関係なフェーズの記録は保持してください。プロバイダーの設定はローカルにとどめます。

起動

続行する前に、次の手順を実行してください。

  1. プロジェクトフォルダーを特定します。DISCOVERY.json の paths.imageSpec フィールドを確認するか、不明確な場合は質問してください。
  2. IMAGE_SPEC.md が存在することを確認します。存在しない場合:

    ❌ IMAGE_SPEC.md が見つかりません。画像をレンダリングする前に、画像仕様を作成して承認してください。 中止します。

  3. プロバイダーとモデルはスクリプト内で自動的に解決されます。--provider=/--model= フラグ、GEMINI_API_KEY/OPENAI_API_KEY、または PROJECT.json に保存済みの以前の選択内容が使われます。ここで別途確認する必要はありません。設定に問題がある場合、スクリプトは PROVIDERS.md を示す、明確で実行可能なエラーメッセージを出して終了します。
  4. node が利用可能であることを確認します:which node。見つからない場合は中止します:❌ node がインストールされていません。
  5. 呼び出された SKILL.md がある絶対パスのディレクトリを特定します。ランタイムバンドルのパスを <skill-directory>/scripts/generate-images.js に設定し、そのファイルが存在することを確認してください。呼び出すときは必ず絶対パスを引用符で囲んでください。cwd やエージェントホームの慣例からパスを推測してはいけません。また、ランタイム依存関係をインストールしてはいけません。

手順

Step 1:1つのプロンプトでスコープを特定し、費用を確認する

IMAGE_SPEC.md のすべての項目を解析します。プロジェクトフォルダーにすでに存在するファイル名を確認してください。

画像のレンダリングには有料 API 呼び出しが必要です。そのため、スコープに含まれる件数と、スクリプトで使用するプロバイダーおよびモデルを、平文で1つのメッセージ内に示す Decision Prompt を必ず1つだけ提示してください(ハーネスの構造化質問ツールで提示してもかまいません)。スクリプトでの順序に従って選択します。ユーザーが指定した --provider=/--model= フラグ、次に PROJECT.json の phases.images に保存されたフラグによる選択(providerSource または modelSource が "flag")、次に API キーが設定されているプロバイダー(両方設定されている場合は Gemini)と、そのプロバイダーの既定モデル(PROVIDERS.md を参照)を使用します。

  • 指定されたスコープ: リクエスト、またはユーザーが直前に回答した Decision Prompt によって、スライド番号、ファイル名、「すべて」、「不足分」、あるいは項目が1つだけに完全一致する説明など、対象項目が曖昧さなく特定されている場合です。指定されたスライドまたはファイル名に対応する項目がない場合は、その旨を伝え、スコープを不明として扱ってください。それ以外の場合は、スコープに含まれる既存ファイルごとに Overwriting images/foo.png (Slide N) の行を1つ表示し、次の確認を行います。

    💡 Generate N images with <provider>/<model>? (yes / one at a time / cancel)
       See PROVIDERS.md for pricing details.
    
  • 不明なスコープで、画像が存在しない場合: すべての項目をスコープとし、同じ確認を行います。

  • 不明なスコープで、画像が1つ以上存在する場合: スコープと費用をまとめて確認します。

    💡 images/: N of M present. Generate with <provider>/<model>?
       Already present:    • images/foo.png  (Slide 1 — Title)  [...]
       Not yet generated:  • images/bar.png  (Slide 3 — Title)  [...]
    
       A  Missing only (M−N)     B  Everything (M)
       C  Slides — e.g. "C 1 3"  D  Cancel
       Add "one at a time" to review each image. See PROVIDERS.md for pricing.
    

    C のスライド番号は同じ返信から取得します。回答が C のみの場合に限り、「どのスライド番号ですか?(例:1 3 5)」と質問し、その後、件数をもう一度確認してください。

回答が yes、A、B、または C の場合は Batch で処理します。「one at a time」を含む回答の場合は Interactive で処理します。cancel または D の場合は、スクリプトを呼び出さずに停止し、ファイルと phases.images を変更しないでください。

ステップ 2:生成

一括

node "<absolute skill directory>/scripts/generate-images.js" \
  "<IMAGE_SPEC.md path>" [--force] [--slides=N,M,...] [--provider=<gemini|openai>] [--model=<id>] [--delay=<seconds>]
  • すべてのエントリー、または未生成のもののみ → 追加フラグは不要です(スクリプトは既存のファイルをスキップします)
  • すべて → --force を追加します
  • 選択したスライド → --slides=N,M,... を追加し、既存の画像を上書きする場合は --force も追加します

対話形式(一度に 1 つ)

対象となる画像ごとに、次を実行します。

node "<absolute skill directory>/scripts/generate-images.js" \
  "<IMAGE_SPEC.md path>" --slide=N --force [--provider=<gemini|openai>] [--model=<id>]

実行後、次を表示します。

✅ Saved: images/foo.png  (Slide N — Title)
   Open to review, then choose:

     N  Next  — accept and continue to the next image
     R  Redo  — regenerate with the same prompt (different result)
     S  Stop  — exit and keep what has been generated so far

注:やり直す前にプロンプトを変更するには、まず IMAGE_SPEC.md を編集してから、R を選択してください。

R は同じスクリプト呼び出しを再実行します。S はループを早期終了します。

ステップ 3:結果を報告

スクリプトの要約出力を表示します。失敗した場合は、IMAGE_SPEC.md のプロンプトを編集し、--slide=N を指定して再試行するよう提案します。

オプション

generate-images.js のフラグです。スクリプト自体はプロンプトを表示しません。

フラグ効果
--force既存の画像を上書きします
--slide=Nスライド N のみを生成します
--slides=N,M,...指定したスライドのみを生成します
--provider=<gemini|openai>自動検出されたプロバイダーを上書きします(PROVIDERS.md を参照)
--model=<id>解決されたプロバイダーのデフォルトモデルを上書きします(PROVIDERS.md を参照)
--delay=<seconds>リクエスト間の待機時間です(デフォルト:1s。レート制限を避けるには値を増やしてください。PROVIDERS.md を参照)

プロバイダー

設定されているキー(GEMINI_API_KEY または OPENAI_API_KEY)から自動検出されます。両方が設定されている場合は、Gemini がデフォルトです。--provider=gemini|openai で上書きできます。セットアップとセキュリティに関するガイダンスは、PROVIDERS.md を参照してください。

プロジェクトの状態

DISCOVERY.json から paths.imageSpec と paths.images を読み込みます。存在しない場合は、IMAGE_SPEC.md と images/ を使用します。解決された provider、providerSource、model、modelSource は(docs/state-schema.md を参照)、生成結果にかかわらず、解決時点ですぐに PROJECT.json の phases.images に保存されます。選択したすべてのエントリーの生成に成功したら、phases.images.status を "done" に設定し、完了時刻を記録します。キャンセルされた場合、またはエントリーが 1 つでも失敗した場合は、フェーズを完了としてマークしないでください。

コメント