MiniMax Image Understanding Skill

understand_image ツールを使用して、画像の分析、説明、情報抽出が必要な場合にこのスキルを使用します。

使い方

understand_image ツールをプロンプトと画像 URL で直接呼び出します:

understand_image({
  prompt: "Your question about the image",
  image_url: "https://example.com/image.png"
})

使用する場面

understand_image は以下の場合に使用します:

• スクリーンショット: エラーメッセージ、UI の問題、スクリーンショット内のコード
• ビジュアルコンテンツ: 写真、図表、グラフ、表
• ドキュメント: 画像からのテキスト抽出 (OCR)、レイアウトの理解
• UI/UX 分析: デザインの評価、コンポーネントの識別
• ビジュアルデバッグ: ビジュアルバグやレイアウト問題の理解

使用しない場面

以下の場合は understand_image を使用しないでください:

• 画像がすでに説明されている: 会話内で既に説明されている場合
• シンプルなアイコンまたは絵文字: 認識できるシンプルなアイコンや絵文字の場合
• 画像が提供されていない: 画像 URL にアクセスできない場合
• 既存コンテキストと冗長: ファイルコンテンツがすでに表示されている場合など

使用例

understand_image({
  prompt: "What do you see in this image?",
  image_url: "https://example.com/screenshot.png"
})

API の詳細

エンドポイント: POST {api_host}/v1/coding_plan/vlm

リクエストボディ:

{
  "prompt": "Your question about the image",
  "image_url": "data:image/jpeg;base64,/9j/4AAQ..."
}

レスポンス形式:

{
  "content": "AI analysis of the image...",
  "base_resp": {
    "status_code": 0,
    "status_msg": "success"
  }
}

画像処理

このツールは 3 種類の画像入力を自動的に処理します:

1. HTTP/HTTPS URL: 画像をダウンロードして base64 に変換

   • 例: https://example.com/image.jpg

2. ローカルファイルパス: ローカルファイルを読み込んで base64 に変換

   • 絶対パス: /Users/username/Documents/image.png
   • 相対パス: images/photo.png
   • @ プレフィックスが存在する場合は削除

3. Base64 データ URL: 既存の base64 データをそのまま渡す

   • 例: data:image/png;base64,iVBORw0KGgo...

対応フォーマット

対応:

• JPEG (.jpg, .jpeg)
• PNG (.png)
• WebP (.webp)

非対応:

• PDF、GIF、PSD、SVG およびその他のフォーマット

効果的なプロンプトの作成

説明用

• "この画像の内容を詳しく説明してください"
• "この画像の主な被写体は何ですか?"
• "ビジュアルスタイルと構成を説明してください"

コード/技術用

• "このスクリーンショットに表示されているコードは何ですか?"
• "この画像からすべてのテキストを抽出してください"
• "使用されている UI フレームワーク/コンポーネントを特定してください"

分析用

• "この UI デザインを分析してください。何が良く機能しており、何を改善できますか?"
• "この画像はどのような感情または雰囲気を伝えていますか?"
• "このデザインを Material Design の原則と比較してください"

OCR/テキスト抽出用

• "この画像からすべてのテキストを抽出してください"
• "このスクリーンショットのエラーメッセージを読んでください"
• "この画像のラベルは何と言っていますか?"

例

エラー分析

understand_image({
  prompt: "What is the error message and where is it located in this screenshot?",
  image_url: "./error-screenshot.png"
})

コードスクリーンショット

understand_image({
  prompt: "What code is shown in this screenshot? Please transcribe it exactly.",
  image_url: "https://example.com/code.png"
})

デザインレビュー

understand_image({
  prompt: "Analyze this UI design. What is working well and what could be improved?",
  image_url: "https://example.com/mockup.png"
})

OCR

understand_image({
  prompt: "Extract all text from this image",
  image_url: "/Users/username/Documents/scan.png"
})

ヒント

1. 具体的に プロンプトで知りたいことを指定してください
2. 形式を指定 構造化されたアウトプットが必要な場合 (例: "すべての要素をリストアップ")
3. コンテキストを含める 画像が大きなタスクの一部である場合
4. スクリーンショットの場合 フルページが必要か、特定の領域だけが必要かを指定してください
5. 複雑な分析 は確認プロンプトをトリガーする可能性があります (分析、抽出、説明、認識、転記、読み取り)

エラーハンドリング

• ステータスコード 1004: 認証エラー - API キーと地域を確認してください
• ステータスコード 2038: 実名認証が必要です
• 無効な画像: ファイルが存在しないか URL にアクセスできません
• 非対応フォーマット: 画像フォーマットが JPEG、PNG、WebP に含まれていません