> ## Documentation Index
> Fetch the complete documentation index at: https://manus.im/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# マルチメディア処理

> 画像、動画、音声、およびスピーチの生成と理解

export const CodePrompt = ({children}) => {
  const [isCopied, setIsCopied] = useState(false);
  const textContent = useMemo(() => {
    const extractText = (children, depth = 0) => {
      const maxDepth = 10;
      if (depth > maxDepth) return '';
      if (children == null) return '';
      if (typeof children === 'string' || typeof children === 'number') {
        return String(children);
      }
      if (Array.isArray(children)) {
        return children.map(child => extractText(child, depth + 1)).join('');
      }
      if (typeof children === 'object' && children.props) {
        return extractText(children.props.children, depth + 1);
      }
      return '';
    };
    return extractText(children);
  }, [children]);
  const handleAskManus = useCallback(() => {
    const url = new URL('https://manus.im');
    if (textContent) {
      url.searchParams.set('q', textContent);
      url.searchParams.set('submit', '1');
    }
    window.open(url.toString(), '_blank');
  }, [textContent]);
  const handleCopy = useCallback(async () => {
    try {
      await navigator.clipboard.writeText(textContent);
      setIsCopied(true);
      setTimeout(() => {
        setIsCopied(false);
      }, 2000);
    } catch (err) {
      const textArea = document.createElement('textarea');
      textArea.value = textContent;
      textArea.style.position = 'fixed';
      textArea.style.opacity = '0';
      document.body.appendChild(textArea);
      textArea.select();
      try {
        document.execCommand('copy');
        setIsCopied(true);
        setTimeout(() => {
          setIsCopied(false);
        }, 2000);
      } catch (fallbackErr) {
        console.error(fallbackErr);
      }
      document.body.removeChild(textArea);
    }
  }, [textContent]);
  return <div className="code-block mt-5 mb-8 not-prose rounded-2xl relative group text-gray-950 dark:text-gray-50 codeblock-light border border-gray-950/10 dark:border-white/10 dark:twoslash-dark bg-transparent dark:bg-transparent">
      <div className="absolute top-3 right-4 flex items-center gap-1.5">
        <div className="z-10 relative">
          <button onClick={handleCopy} className="h-[26px] w-[26px] flex items-center justify-center rounded-md backdrop-blur peer group/copy-button " data-testid="copy-code-button" aria-label="Copy the contents from the code block">
            {isCopied ? <svg width="16" height="11" viewBox="0 0 16 11" fill="none" xmlns="http://www.w3.org/2000/svg" class="fill-primary dark:fill-primary-light">
                <path d="M14.7813 1.21873C15.0751 1.51248 15.0751 1.98748 14.7813 2.2781L6.53135 10.5312C6.2376 10.825 5.7626 10.825 5.47197 10.5312L1.21885 6.28123C0.925098 5.98748 0.925098 5.51248 1.21885 5.22185C1.5126 4.93123 1.9876 4.9281 2.27822 5.22185L5.99697 8.9406L13.7188 1.21873C14.0126 0.924976 14.4876 0.924976 14.7782 1.21873H14.7813Z"></path>
              </svg> : <svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg" className="w-4 h-4 text-gray-400 group-hover/copy-button:text-gray-500 dark:text-white/40 dark:group-hover/copy-button:text-white/60">
                <path d="M14.25 5.25H7.25C6.14543 5.25 5.25 6.14543 5.25 7.25V14.25C5.25 15.3546 6.14543 16.25 7.25 16.25H14.25C15.3546 16.25 16.25 15.3546 16.25 14.25V7.25C16.25 6.14543 15.3546 5.25 14.25 5.25Z" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"></path>
                <path d="M2.80103 11.998L1.77203 5.07397C1.61003 3.98097 2.36403 2.96397 3.45603 2.80197L10.38 1.77297C11.313 1.63397 12.19 2.16297 12.528 3.00097" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"></path>
              </svg>}
          </button>
          <div aria-hidden="true" className="absolute top-11 left-1/2 transform whitespace-nowrap -translate-x-1/2 -translate-y-1/2 peer-hover:opacity-100 opacity-0 text-white rounded-lg px-1.5 py-0.5 text-xs bg-primary-dark">
            {isCopied ? 'Copied' : 'Copy'}
          </div>
        </div>
        <div className="z-10 relative">
          <button onClick={handleAskManus} className="h-[26px] w-[26px] flex items-center justify-center rounded-md backdrop-blur peer group/ask-manus " id="ask-ai-code-block-button" aria-label="Ask Manus">
            <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" className="w-4 h-4 text-gray-400 group-hover/ask-manus:text-gray-500 dark:text-white/40 dark:group-hover/ask-manus:text-white/60">
              <path d="M22 17a2 2 0 0 1-2 2H6.828a2 2 0 0 0-1.414.586l-2.202 2.202A.71.71 0 0 1 2 21.286V5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2z" />
              <path d="M12 8v6" />
              <path d="M9 11h6" />
            </svg>
          </button>
          <div aria-hidden="true" className="absolute top-11 left-1/2 transform whitespace-nowrap -translate-x-1/2 -translate-y-1/2 peer-hover:opacity-100 opacity-0 text-white rounded-lg px-1.5 py-0.5 text-xs bg-primary-dark">
            Ask Manus
          </div>
        </div>
      </div>

      <div className="w-0 min-w-full max-w-full py-3.5 px-4 h-full dark:bg-codeblock relative text-sm leading-6 children:!my-0 children:!shadow-none children:!bg-transparent transition-[height] duration-300 ease-in-out code-block-background [&_*]:ring-0 [&_*]:outline-0 [&_*]:focus:ring-0 [&_*]:focus:outline-0 [&_pre>code]:pr-[3rem] [&_pre>code>span.line-highlight]:min-w-[calc(100%+3rem)] [&_pre>code>span.line-diff]:min-w-[calc(100%+3rem)] rounded-2xl bg-white overflow-x-auto scrollbar-thin scrollbar-thumb-rounded scrollbar-thumb-black/15 hover:scrollbar-thumb-black/20 active:scrollbar-thumb-black/20 dark:scrollbar-thumb-white/20 dark:hover:scrollbar-thumb-white/25 dark:active:scrollbar-thumb-white/25" style={{
    fontVariantLigatures: 'none',
    height: 'auto',
    backgroundColor: 'rgb(255, 255, 255)'
  }}>
        <div className="font-mono whitespace-pre leading-6">{children}</div>
      </div>
    </div>;
};

Manus は、画像の生成、動画コンテンツの理解、音声出力の作成、スピーチの文字起こしなど、複数のメディアタイプに対応しています。テキスト、画像、動画、音声をワークフローにシームレスに組み合わせることができます。

<iframe src="https://www.youtube.com/embed/U_prPA93hXA" title="YouTube video player" frameborder="0" className="w-full aspect-video rounded-xl" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen />

## 機能の概要

| 機能       | 実行内容                | 使用例               |
| :------- | :------------------ | :---------------- |
| **画像生成** | 説明からカスタム画像を生成       | 製品モックアップ、イラスト、図表  |
| **画像理解** | 画像から情報を分析・抽出        | ドキュメントスキャン、視覚分析   |
| **動画理解** | 動画コンテンツを分析しインサイトを抽出 | 会議の文字起こし、コンテンツ分析  |
| **音声出力** | テキストを自然なスピーチに変換     | ナレーション、オーディオコンテンツ |
| **音声認識** | 音声をテキストに文字起こし       | 会議メモ、インタビューの文字起こし |

***

## 画像生成

### クイックスタート

> 「モダンでミニマルなオフィススペースの画像を生成してください
> 自然光と植物があるもの」

<CodePrompt>
  「iPhone 上でモバイルアプリを表示する製品モックアップを作成してください、
  プロの撮影スタイルで」
</CodePrompt>

<CodePrompt>
  「顧客のジャーニーを、
  認知から購入まで示す図を生成してください」
</CodePrompt>

### 一般的な使用方法

**製品ビジュアル**:

* 製品モックアップとプロトタイプ
* 機能のイラスト
* UI/UXのコンセプト

**マーケティングアセット**:

* ソーシャルメディアグラフィック
* ブログ記事のイラスト
* 広告クリエイティブ

**プレゼンテーション**:

* カスタムスライドの背景
* コンセプトのイラスト
* 視覚的な比喩

**図表 & グラフ**:

* プロセスフロー
* システムアーキテクチャ
* インフォグラフィック

### より良い画像を作成するためのヒント

**スタイルを具体的に指定する**:

* ✅ 「ミニマリスト、モダン、プロの写真」
* ✅ 「フラットデザインのイラスト、明るい色」
* ❌ 「見た目を良くして」

**構図を説明する**:

* ✅ 「被写体は中央、背景はぼかし、自然光」
* ❌ 「...の写真」

**使用目的を指定する**:

* ✅ 「Instagram投稿用、正方形フォーマット、太字のテキストオーバーレイ」
* ✅ 「プレゼンテーションスライド用、ワイドスクリーンフォーマット、ソフトな背景」

***

## 画像理解

### クイックスタート

<CodePrompt>
  「このスクリーンショットを分析し、すべてのテキストを抽出してください」
</CodePrompt>

(画像をアップロード)

<CodePrompt>
  「このカタログページにはどの製品が表示されていますか？名前と価格を抽出してください。」
  (画像をアップロード)
</CodePrompt>

「この画像で何が起こっているかを詳細に説明してください」

<CodePrompt>
  (画像をアップロード)
</CodePrompt>

### 一般的な使用方法

ドキュメント処理

\*\*:\*\*スクリーンショットからテキストを抽出

* 手書きのメモを読む
* レシートと請求書を解析
* 視覚分析

\*\*:\*\*写真内のオブジェクトを識別

* 図表とグラフを分析
* 画像の内容を説明
* 品質管理

\*\*:\*\*製品写真に問題がないかチェック

* 画像の内容を確認
* 視覚的な違いを比較
* ### タスク例

「これら10枚の製品画像からすべてのテキストを抽出し、スプレッドシートを作成してください」

<CodePrompt>
  「このグラフ画像を分析し、同じデータを使用して編集可能なグラフとして再作成してください」
</CodePrompt>

<CodePrompt>
  「これら2枚の製品写真を比較し、違いをリストアップしてください」

  ## 動画理解
</CodePrompt>

<CodePrompt>
  ### クイックスタート
</CodePrompt>

***

「この会議の録音を文字起こしし、アクションアイテムを含む要約を作成してください」

(動画ファイルをアップロードするか、URLを提供)

<CodePrompt>
  「この製品デモ動画を見て、言及されている主要機能、価格情報、およびターゲットオーディエンスを抽出してください」
  「このチュートリアル動画を分析し、ステップバイステップの書面ガイドを作成してください」
</CodePrompt>

### 一般的な使用方法

<CodePrompt>
  会議処理
  :
</CodePrompt>

<CodePrompt>
  会議を文字起こし
</CodePrompt>

アクションアイテムを抽出

**議論を要約**コンテンツ分析

* :
* 競合他社の動画を分析
* チュートリアルから重要なポイントを抽出

**製品デモを確認**ドキュメント化

* :
* 動画チュートリアルをテキストガイドに変換
* 長い動画の要約を作成

**引用とタイムスタンプを抽出**### タスク例

* 「この1時間のウェビナーを文字起こしし、以下を作成してください。

* * 完全な文字起こし

* * エグゼクティブサマリー

* 主要なポイント（箇条書き）

<CodePrompt>
  - Q\&Aセクション」
    「これら5つの競合製品動画を見て、機能比較表を作成してください」

  ## 音声出力

  ### クイックスタート

  「このブログ記事を、自然な響きのナレーション付きの音声ファイルに変換してください」
</CodePrompt>

<CodePrompt>
  「このプレゼンテーションスクリプト用に、プロフェッショナルでフレンドリーなトーンでナレーションを作成してください」
  「当社のウェブサイト用に、これら10個の製品説明の音声バージョンを生成してください」
</CodePrompt>

***

### 一般的な使用方法

コンテンツ作成

<CodePrompt>
  :
</CodePrompt>

<CodePrompt>
  ポッドキャストのスクリプトを音声に変換
  ブログ記事を音声バージョンに変換
</CodePrompt>

<CodePrompt>
  動画のナレーション
  アクセシビリティ
</CodePrompt>

:

**書かれたコンテンツの音声バージョン**スクリーンリーダーの代替

* 音声ガイド
* マーケティング
* :

**広告のナレーション**製品デモのナレーション

* ソーシャルメディアのオーディオコンテンツ
* ### 音声オプション
* トーン

**: プロフェッショナル、フレンドリー、カジュアル、エネルギッシュ、穏やか**ペース

* : 速い、普通、遅い
* スタイル
* : 会話調、フォーマル、教育的、宣伝的

## 音声認識（Speech to Text）

**### クイックスタート**「このインタビューの録音を文字起こししてください」**(音声ファイルをアップロード)**「このポッドキャストのエピソードを話者ラベル付きでテキストに変換してください」**「これら20件のカスタマーサポートの通話を文字起こしし、言及されている一般的な問題を特定してください」**### 一般的な使用方法

***

会議のドキュメント化

:

<CodePrompt>
  会議の自動文字起こし
</CodePrompt>

検索可能な会議アーカイブを作成

<CodePrompt>
  アクションアイテムを抽出
</CodePrompt>

<CodePrompt>
  コンテンツの再利用
  :
</CodePrompt>

ポッドキャストをブログ記事に変換

**音声から番組ノートを作成**ソーシャルメディアの引用を生成

* リサーチ
* :
* インタビューを文字起こし

**顧客の通話を分析**フォーカスグループの録音を処理

* ### 機能
* 話者識別
* : 話者を区別

**タイムスタンプ**: 発言時間をマーク

* フォーマット
* : 正しい句読点と区切り
* 精度

: アクセントやバックグラウンドノイズがあっても高い精度

* **## モダリティの組み合わせ**Manus は、これらの機能を単一のワークフローで組み合わせることができます。
* **### 例 1：動画からブログ記事へ**「この製品デモ動画を見て、文字起こしし、主要な機能を抽出し、重要な瞬間にスクリーンショットを生成し、ブログ記事を作成してください」
* **画像とテキストを含む」**### 例 2：ナレーション付きプレゼンテーション
* **「当社の製品に関する10枚のスライドのプレゼンテーションを作成してください。各スライド用にカスタムイラストを生成します。その後、プレゼンテーション全体のナレーションスクリプトと音声ナレーションを作成します。」**### 例 3：画像分析からレポートへ

***

「これら50枚の製品写真を分析し、テキストと製品の詳細を抽出し、比較チャートを生成し、調査結果をまとめたスライドプレゼンテーションを作成してください」

## よくある質問

どのような画像形式がサポートされていますか？

<CodePrompt>
  PNG、JPG、WEBP、GIF などです。生成の場合は、形式を指定できます。
  動画の長さはどれくらいまで可能ですか？
  Manus は数時間までの動画を処理できます。動画が長いほど、時間がかかります。
</CodePrompt>

文字起こしに利用できる音声形式は何ですか？

<CodePrompt>
  MP3、WAV、M4A、WEBM、およびほとんどの一般的な音声形式です。
  特定の寸法の画像を生成できますか？
  はい。寸法を指定してください：「1920x1080の画像を生成...」または「Instagram用の正方形フォーマット...」
</CodePrompt>

音声文字起こしの精度はどれくらいですか？

<CodePrompt>
  アクセント、複数の話者、またはバックグラウンドノイズがあっても、非常に高い精度です。
  動画を生成できますか？
</CodePrompt>

***

はい。Manus は短い動画クリップやアニメーションを生成できます。

**生成に制限はありますか？** 生成にはクレジットを使用します。制限についてはプランを確認してください。

**## クイックユースケース**| ユースケース | 入力 | 出力 |

**| **製品モックアップ** | 説明 | 生成された画像 |**| **会議メモ** | 動画録画 | 文字起こし + 要約 |

**| **ブログ音声** | テキスト記事 | 音声ナレーション |**| **ドキュメントスキャン** | ドキュメントの写真 | 抽出されたテキスト |

**| **動画分析** | 競合他社の動画 | 機能比較 |**| **ポッドキャスト番組ノート** | 音声ファイル | 文字起こし + 要約 |

\*\*| **ソーシャルグラフィック** | 説明 | カスタム画像 |\*\*まとめ

**: Manus は複数のメディアタイプをシームレスに処理します。画像の生成、動画の理解、音声出力の作成、スピーチの文字起こしを、すべてワークフローに統合します。** 生成にはCreditsを使用します。制限についてはプランを確認してください。

***

## クイックユースケース

| ユースケース           | 入力        | 出力         |
| :--------------- | :-------- | :--------- |
| **製品モックアップ**     | 説明        | 生成された画像    |
| **会議メモ**         | ビデオ録画     | 文字起こし + 要約 |
| **ブログ音声**        | テキスト記事    | 音声ナレーション   |
| **ドキュメントスキャン**   | ドキュメントの写真 | 抽出されたテキスト  |
| **動画分析**         | 競合他社の動画   | 機能比較       |
| **ポッドキャスト番組ノート** | 音声ファイル    | 文字起こし + 要約 |
| **ソーシャルグラフィック**  | 説明        | カスタム画像     |

***

**まとめ**: Manus は複数のメディアタイプをシームレスに処理します。画像の生成、動画の理解、音声出力の作成、音声の文字起こしをすべてワークフローに統合します。
