mcpField
E
experience-content-media-image-generate

experience-content-media-image-generate

github.com/forcedotcomクリエイティブ・メディア1.1k54 回インストール1 日前に更新
リポジトリ

experience-content-media-image-generate について

画像アセットの生成、ダウンロード、プレビューを行うスキルです。まず`media-management` MCPサーバーの`create_image`を確認し、利用できない場合は固定のプレースホルダーURLを指定します。

主な機能

  1. 01画像生成ツールの利用可否確認
  2. 02`create_image`による画像生成
  3. 03出力形式と品質の設定
  4. 04生成画像のダウンロードとプレビュー
  5. 05固定プレースホルダーへの切り替え

活用シーン

  1. 01自然言語プロンプトからの画像生成
  2. 02生成アセットの保存とプレビュー
  3. 03生成機能が使えない場合の画像ソース提供

MCP 対応

利用可能な場合は`media-management` MCPサーバーの`create_image`ツールを使います。利用できない場合は、代替としてプレースホルダーURLを指定します。

インストール

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

$npx skills add https://github.com/forcedotcom/sf-skills --skill experience-content-media-image-generate

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

同梱ファイルscripts/download-image.sh

詳細

画像の生成

目標

ユーザーが求めるビジュアルアセットをプログラムで生成、ダウンロード、プレビューし、指定された形式と品質の基準を満たすとともに、堅牢なフォールバック手段を提供します。

ワークフロー

  1. media-management MCP サーバーが設定されており、create_image ツールを利用できるか確認します。
  2. 利用できる場合は、create_image を使用して画像を生成します。
  3. 利用できない場合は、以下のプレースホルダーによるフォールバックを使用します。

MCP：media-management

ツール： create_image

利用可能なツールを確認します。create_image がある場合は、主な画像生成方法として使用し、以下の表にある自然言語のプロンプトと該当するパラメーターを渡します。（ここでの media-management は、MCP サーバー名を指し、このスキル自体を指すものではありません。）

ツール一覧に create_image がない場合、media-management MCP は設定されていません。以下のプレースホルダーによるフォールバックを使用します。

画像生成パラメーター

ユーザーから別の指定がない限り、以下をデフォルトとして使用します。

パラメーターデフォルトオプション
modelStandardStandard、Premium
sizeautoauto、1024x1024、1536x1024、1024x1536（ユーザーが指定したサイズに最も近いものを選択）
qualitymediumlow、medium、high
outputCompression750–100（webp/jpeg のみ）
outputFormatwebpwebp、jpeg、png
backgroundautoauto、transparent、opaque

形式のルール： outputFormat が png の場合、outputCompression を 100 に設定します。

生成が成功した後

このスキルの scripts/ ディレクトリにある download-image.sh を実行して、画像をダウンロードし、プレビューします。

bash scripts/download-image.sh \
  --url "<image_url_from_response>" \
  --id "<responseId>" \
  --format "<outputFormat>" \
  --preview

このスクリプトは、認証情報の取得、ダウンロード、VS Code でのプレビューを処理します。デフォルトの generatedimages/ ディレクトリを変更するには、--output-dir <dir> を渡します。

生成した画像を外部ツールでリサイズしたり、後処理したりしないでください。 表示サイズを調整するには、使用箇所で CSS プロパティ（例：width、height、object-fit）を使います。

フォールバック：プレースホルダー URL を使用する

画像の生成に失敗した場合、または画像生成が有効になっていない場合は、画像ソースとして以下の URL を返します。ダウンロードしたり、ローカルに保存したりしないでください。

https://cdn.scs.static.lightning.force.com/content/assets/d5222d4a11e6c2b735152d7eea824ce4/placeholder.svg

コード内で画像を参照する箇所（src 属性や CSS の url() など）には、この URL をそのまま使用します。

プレースホルダーのポリシー

プレースホルダー URL は 1 つだけです。ダウンロード、変更したり、Python、ImageMagick、その他のツールで代替のプレースホルダーを生成したりしないでください。

ユーザーが特定のサイズや形式のプレースホルダーを求めた場合、利用可能なプレースホルダー URL はこれだけであることを伝え、使用箇所で CSS プロパティ（例：width、height、object-fit）を使って拡大縮小するよう案内します。

コメント

Markdown 対応