mcpField
T
transformation-builder

transformation-builder

github.com/imagekit-developerクリエイティブ・メディア2484 回インストール3 週間前に更新
リポジトリ

transformation-builder について

transformation-builderは、画像編集の依頼をImageKitの変換ツール向けの具体的なクエリに直す方法をエージェントに示すスキルです。パラメーター選択、処理順序、失敗後の再試行を扱い、複数工程の画像編集に対応します。

主な機能

  1. 01曖昧な依頼を具体的なクエリに変換
  2. 02ImageKit変換パラメーターの選択
  3. 03複数工程の処理順序を整理
  4. 04変換失敗後の再試行

活用シーン

  1. 01顔を中心に画像をクロップ
  2. 02背景除去後にサイズを変更
  3. 03AI編集と画像効果を組み合わせ

インストール

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

$npx skills add https://github.com/imagekit-developer/skills --skill transformation-builder

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

詳細

Transformation Builder スキル

ツールの仕組みを理解し、正確なクエリを記述して、複数ステップのチェーンを正しい順序に並べてから、transformation_builder を呼び出します。

このツールの実際の仕組み(最初にお読みください)

transformation_builder は機能を選択するツールではありません。入力は次のものだけです。

transformation_builder(query, src?, previous_errors?)
  • query — 実行したい変換を説明する自然言語の記述です。
  • src — ImageKit がホストするソース URL(省略するとサンプル画像が使われます)。
  • previous_errors — 以前の呼び出しに失敗した場合、そのエラーテキストを渡すとツールが自動修正を試みます。

内部では、ツールが次の処理を行います。(1)query を使って ImageKit のドキュメントを検索し、(2)LLM が検証済みの変換ステップ一覧に変換し、(3)SDK が最終 URL を生成します。capability 引数はありません。以下のパラメーター名は、query に含める用語であり、直接設定する API フィールドではありません。ステップ 1 では query のテキストを使ってドキュメントを検索するため、正しい ImageKit のパラメーター名と値を query に使うと、結果の精度が大幅に向上します。誤った名前や、実在しない名前を使うと、検索が正しい方向から外れてしまいます。

そのため、あなたの役割は、ユーザーの曖昧なリクエストを、以下のリファレンスセクションにある実在するパラメーター名と値を含む正確なクエリに変換することです。

使用する場面(このスキルが起動する条件)

  • リサイズ、切り抜き、または特定の領域へのフォーカス
  • フィルター、エフェクト、オーバーレイ(画像/テキスト/動画)、ウォーターマーク
  • 複数ステップの変換チェーン
  • 背景の削除、置き換え、または生成塗りつぶし
  • AI を活用した画像編集(オブジェクト/色/スタイルの変更、アップスケール、レタッチ、ドロップシャドウ、バリエーション)

transformation_builder の呼び出し

  • query:正確に書き直した説明です(「クエリの作成」を参照)。ユーザーの曖昧な表現を、そのまま渡してはいけません。
  • src:ユーザーが指定した場合は、変換する ImageKit 配信 URL を指定します。ImageKit がホストする URL でなければなりません。
  • 複数ステップのリクエストは、順序に沿ってステップを説明する1 つのクエリにまとめます。
    • ユーザー:「1)800x600 にリサイズ 2)顔に合わせて切り抜く」
    • クエリ:「幅を 800、高さを 600 にリサイズしてから、顔にフォーカスして切り抜く」

クエリの作成

ルール:曖昧なリクエストを、実在するパラメーター名と値を含む説明に書き換えてください。分かる場合は正確なパラメーター名と値を使い、不確かな場合に限り平易な英語を使ってください。

ユーザーの表現不十分なクエリ適切なクエリ
「赤いボールを緑にして」「赤いボールを緑にする」「プロンプトに、赤いボールを緑に変えるよう指定して、ai_edit を適用する」
「きれいにして、白い背景にして」「きれいにして、白い背景」「ai_retouch を適用し、その後、背景色を白にして ai_remove_background を適用する」
「絵画のように見せて」「絵画風」「プロンプトに、筆跡が見える油絵風と指定して、ai_edit を適用する」
「顔の周りを切り抜いて」「顔を切り抜く」「focus=face でリサイズし、検出された顔の周りを切り抜く」
「下部にテキスト『Hello』を追加」「Hello のテキストを追加」「テキスト『Hello』のオーバーレイを追加し、下部(focus=bottom)に配置する」
「モバイルバナーに合わせて」「モバイルバナー」「width=640、aspect_ratio=2-1 でリサイズする」
「幅 300px、赤い枠線付き」「リサイズして枠線を追加」「width=300 にリサイズしてから、幅 5、色を赤にした border を追加する」
「ぼやけているので、解像度を上げて」「画質を修正」「ai_upscale を適用し、その後 ai_retouch を適用する」
「背景を削除して影を追加」「背景削除、影」「ai_remove_background を適用し、その後 ai_drop_shadow を適用する」
「引き伸ばさずに横幅を広げて」「横幅を広げる」「crop_mode=pad_extract のパディング付き切り抜きを使ってキャンバスを横方向に拡張し、background=genfill を指定して AI に新しい領域を塗りつぶさせる」
Intent → 実際のパラメーター/用語

意図をクエリに指定する適切な用語へ変換する際に使用します。これらは、ツールが検証する実際のパラメーター名です。

ユーザーの意図使用する用語備考
特定のオブジェクト/領域を変更する(「猫を大きくする」「サングラスを追加する」「絵画風にする」)ai_edit(プロンプトベース)テキストプロンプトに基づく AI コンテンツ編集
背景全体のシーンを置き換える(「被写体をビーチに配置する」)ai_change_background(プロンプトベース)被写体はそのままに、新しいシーンを生成します。単なる背景の削除や色の変更には使用しません
背景を削除して透明にするai_remove_backgroundImageKit ネイティブ機能です。外部の remove.bg エンジンを使用する場合は、ai_remove_background_external を使用します
キャンバスを拡張/アウトペイントする(「空をもっと追加する」「パノラマにする」)パディング付きクロップ + background=genfill生成塗りつぶしは独立した AI フィールドではなく、background パラメーターで指定します。プロンプトは不要です
解像度を上げる/低解像度を修正するai_upscaleブール値。パラメーターはありません
修正する/シミを除去するai_retouchブール値。パラメーターはありません
切り抜いた被写体の下にリアルな影を追加するai_drop_shadow透明画像のみ対応します。azimuth、elevation、strength は任意です
別バージョン/リミックスを作成するai_variationブール値。構成を維持します
サイズ変更/アスペクト比/クロップwidth、height、aspect_ratio、crop、crop_mode「サイズ変更とクロップ」表を参照してください
顔/オブジェクトに合わせてスマートクロップするfocus(auto、face、またはオブジェクト名)+ 任意の zoomオブジェクト名は COCO クラスです(person、car、dog、…)
すべてのピクセルで特定の色を置換する(「赤をすべて青にする」)color_replacetolerance を指定してピクセル全体の色を置換します
フィルター/調整(白黒、ぼかし、シャープ化、回転、枠線、角丸)grayscale、blur、sharpen、rotation、border、radius、…「エフェクト」表を参照してください
ロゴ/透かし画像を重ねるテキスト/画像のオーバーレイ型指定された単一の overlay 概念です(「オーバーレイ」を参照)
画像にテキストを追加するtext を指定したテキストオーバーレイ「オーバーレイ」を参照してください

このツールには「画像を一から生成する」手順はありません。常に既存の src を変換します。画像を一から生成するには、ImageKit DAM(デジタルアセットマネージャー)のテキストから画像を生成する機能を使用してください。これは transformation_builder とは別の機能です。

重要な違い:ai_edit と color_replace と ai_change_background
  1. 特定のオブジェクト/領域を変更する(「ボールを大きくする」「車を赤くする」)→ ai_edit
  2. すべてのピクセルで特定の色を置換する(「赤をすべて青に置き換える」)→ color_replace
  3. 背景全体のシーンを置き換える(「被写体をビーチに配置する」)→ ai_change_background

複数ステップの処理を順番に指定する

複数の操作を含むリクエストでは、次の順序で1つのクエリにまとめて指定します。

  1. アップスケール/レタッチ(まず画質を向上)
  2. AI コンテンツ編集(ai_edit)
  3. 背景の削除/置換(ai_remove_background、ai_change_background)
  4. サイズ変更/クロップ(最終寸法)
  5. エフェクト/オーバーレイ(仕上げ)

重要:背景の削除はアップスケール/レタッチの後に行い、先に行ってはいけません。 正しい順序:ai_upscale → ai_remove_background。誤った順序:ai_remove_background → ai_upscale。

例 — 「この写真をきれいにして、背景を削除し、500x500にする」: → クエリ:「ai_retouch を適用し、次に ai_remove_background を適用してから、width=500、height=500 にサイズ変更する」。

背景の削除:意図を確認する

  • ユーザーの「背景を削除する」という指示が曖昧な場合は、次のどちらを希望するのか確認してください。
    1. リアルタイム URL — 配信 URL で ai_remove_background を使用します(何も保存されません)。
    2. 削除して保存 — 背景削除拡張機能を適用し、結果を新しいファイルバージョンとしてアップロードします(このツールではなく、メディアライブラリの操作です)。
  • 新しい背景シーンを希望する場合に限り、ai_change_background を使用してください。透明な切り抜きや単色の背景にする場合は、ai_remove_background を使用します(必要に応じて、その後に background=色を指定します)。

エラーへの対処

  1. 400 / Bad Request または検証エラー:クエリを調整して再試行し、previous_errors にエラーテキストを渡します。search-docs スキルを呼び出し、search_docs を使用して、サポートされているパラメーターや制限を確認します。
  2. 3 回以上失敗した場合:再試行する前に、search-docs を使用してサポートされているメソッドや制約を確認します。
  3. 未サポートの場合:ドキュメントで確認し、最も近い代替手段を提示します。

注意事項

  • ソース URL は ImageKit がホストするものでなければなりません。
  • 背景を削除する順序が重要です(先にアップスケール/レタッチします)。
  • 生成塗りつぶしは、余白を追加/拡大したキャンバス上で background=genfill を指定します。プロンプトは不要です。プロンプトで背景を変更するのは ai_change_background です。
  • ai_drop_shadow には透明な被写体が必要です(先に ai_remove_background を実行します)。
  • 負のオフセット/回転は、最終 URL では N プレフィックスを付けて記述されます(ツールが処理します)。値は通常どおり説明してください。

パラメーターリファレンス

以下は、ツールが検証する実際の名前/値です。クエリに指定してください。

リサイズと切り抜き
パラメーター機能
width出力幅です。整数の px、0~1 の小数(元画像に対する割合)、または算術式を指定します。
height出力高さです。width と同じ形式を指定します。
aspect_ratioアスペクト比(例:16-9)です。width または height と組み合わせて使用します。両方が設定されている場合は無視されます。
cropリサイズ方法:force、at_max、at_max_enlarge、at_least、maintain_ratio、maintain_ratio_no_enlarge。
crop_mode余白追加/切り出しの動作:pad_resize、extract、pad_extract、pad_resize_no_enlarge、pad_extract_no_shrink。
focus焦点:auto、face、custom、方向を示す位置(center、top、left、bottom_right、…)、またはオブジェクト名(person、car、dog などの COCO クラス)。
zoom焦点領域のズーム倍率(顔/オブジェクトを焦点に指定する場合)。
x、y、x_center、y_centerextract 切り抜きの領域座標(左上基準または中心基準)。
dpr高密度ディスプレイ向けのデバイスピクセル比(数値または auto)。
background余白部分の塗りつぶし方法。「背景モード」を参照してください。
背景モード(background)
値意味
色16 進数(FFFFFF)または CSS 名(white、red、…)。
blurred画像をぼかしたもの(オプションで blurred_<intensity>_<brightness>)。
dominant画像の主要色。
genfill余白部分を AI で生成して塗りつぶします(アウトペインティング)。プロンプトは不要です。
gradient主要色から作成するグラデーション(gradient_dominant、オプションでパレットサイズ 2 または 4)。
AI 変換
パラメーター機能
ai_remove_backgroundImageKit ネイティブの背景削除 → 透明化。
ai_remove_background_external外部プロバイダー(remove.bg)を介した背景削除。
ai_editプロンプトに基づく画像コンテンツの AI 編集。
ai_change_backgroundプロンプトに基づいて背景のシーンを置き換えます(被写体は保持されます)。
ai_drop_shadowAI のドロップシャドウ(透明画像のみ)。オプションで azimuth(0~360)、elevation(0~90)、strength(0~100)を指定できます。
ai_upscaleAI による超解像アップスケール。パラメーターはありません。
ai_retouchAI による画質向上/ blemish の除去。パラメーターはありません。
ai_variation画像の構造的なバリエーションを生成します。パラメーターはありません。
エフェクトと補正
パラメーター機能
blurガウスぼかし、0~100。
sharpenシャープ化、0~100。
unsharp_mask高度なシャープ化(radius、sigma、amount、threshold)。
grayscaleグレースケールに変換します。
contrast_stretchコントラストを自動補正します。
shadow透明でないピクセルの下にドロップシャドウを追加します(透明度が必要です)。blur、saturation、x_offset、y_offset は任意です。
gradient線形グラデーションを重ねます(linear_direction、from_color、to_color、stop_point)。
color_replace色と類似する色合いを置き換えます:to_color、tolerance(0~100)、任意の from_color。
colorize画像に色合いを付けます:color、intensity(0~100)。
borderborder_width と color で枠線を追加します。
trim被写体の周囲にある単色の縁をトリミングします。
rotation度数で回転します(または EXIF に基づく auto)。負の値は反時計回りです。
fliph、v、h_v、または v_h。
radius角を丸くします(整数、円形にする max、または角ごとの指定 20_40_80_160)。
opacityレイヤーの不透明度、0~100。
distort透視変換(4 組の座標)またはアーク変形(度数)。
オーバーレイ(overlay)

型付きシェイプを使用する単一の overlay 概念です。各オーバーレイは、position(x、y、x_center、y_center、focus、anchor_point)、動画用の timing(start、end、duration)、layer_mode(multiply、cutter、cutout、displace)、およびネストされた transformation リストに対応しています。

オーバーレイの種類主なフィールド
テキストtext とスタイル設定:font_size、font_family、font_color、inner_alignment、padding、alpha(1~9)、typography、line_height、radius、rotation、flip、background。
画像input(オーバーレイ画像のメディアライブラリパス)。ネストされた変換にも対応しています。
動画input(動画パス)。ネストされた変換とタイミングにも対応しています。
字幕input(字幕ファイル)。スタイル設定:font_size、font_family、color、typography、font_outline、font_shadow、background。
単色color と、width、height、radius、alpha、background、gradient。
動画変換
パラメーター機能
start_offset、end_offset、durationクリップをトリミングします(秒数または算術式)。
audio_codecaac、opus、または none(ミュート/音声の除去)。
video_codech264、vp9、av1、または none。
streaming_resolutionsアダプティブビットレートの解像度設定。例:[360, 720, 1080]。
rotation、radius、border、flip画像エフェクトと同じ設定を動画フレームに適用します。
出力と配信
パラメーター機能
formatauto、webp、avif、jpg、png、gif、mp4、webm、orig、…
quality0~100。
progressiveプログレッシブ JPEG。
lossless可逆 WebP/PNG。
named保存済みの名前付き変換を適用します。
default_imageソースが見つからない場合に使用するフォールバック画像。
条件分岐

画像のプロパティ(幅/高さ/アスペクト比など)に基づいて変換を条件付きで実行できます。条件を自然言語で(「幅が 1000 を超える場合は、…」のように)記述すると、ツールが if/if-else/if-end の連鎖を構築します。

コメント