# Talking Avatar 使用マニュアル Talking Avatar は、入力した文章を読み上げながら、2Dアバターや写真が一緒に喋るアプリケーション（Web版 & macOS / Windows デスクトップアプリ版）です。 声に合わせて口がリアルタイムに動き、まばたきをし、頭が自然に揺れます。 内蔵アバターのほか、お手持ちの顔写真や自作のイラストアバターを読み込んで喋らせることができ、動画ファイル（WebM / MP4）としての保存も可能です。 すべての処理はお使いのブラウザ / デバイスローカル上で行われます。文章や写真が外部サーバーへ送信されることはありません。 --- ## 1. 動作環境とアプリの入手 - **Web 版**: Chrome, Edge, Safari, Firefox 等のモダンブラウザ - **デスクトップアプリ版 (macOS / Windows)**: - GitHub リポジトリ（[tztechno/talking-avatar-desktop](https://github.com/tztechno/talking-avatar-desktop)）の Releases または Actions Artifacts よりダウンロード可能です。 - **macOS**: `Talking-Avatar_x.x.x_aarch64.dmg`（Apple Silicon）または `x64.dmg`（Intel） - **Windows**: `Talking-Avatar_x.x.x_x64-setup.exe` または `.msi` - **WebGL**: 写真アバターの動作に必要です（近年のPCでは標準で有効）。 - **インターネット接続**: 初回のみ AI 音声モデル（約 90MB）や顔認識モデルのキャッシュダウンロードに使用します。 --- ## 2. 起動のしかた ### デスクトップアプリ版（推奨） - **macOS**: DMG ファイルを開き、`Talking Avatar.app` を `Applications` フォルダへドラッグ＆ドロップして起動します。 - **Windows**: インストーラー（`.exe`）を実行し、画面の指示に従ってインストールして起動します。 ### Web 開発版 自分のパソコンで Web 版の開発サーバーを動かす場合は、[Node.js](https://nodejs.org/) 20 以上を用意して、次を実行します。 ```sh cd talking-avatar npm install # 初回のみ npm run dev ``` ターミナルに表示されたアドレス（通常は `http://localhost:5173`）をブラウザで開きます。 --- ## 3. 画面構成と説明 | 場所 | 役割 | |---|---| | **ステージ**（左） | アバターが表示されます。写真やアバターのファイルをここにドロップできます。 | | **Background** | 背景を選びます。透明（Transparent）、好きな色（Colour）、グリーンバック（Chroma green）の3種類です。 | | **Load photo / Load folder / Load .zip** | 自分の顔写真や自作アバターを読み込みます（5章）。 | | **アバター選択欄** | 内蔵の *Sample photo*（写真）と *Illustration*（イラスト）を切り替えます。 | | **Mark mouth** | 写真のときだけ表示されます。口の位置を手動で指定し直します。 | | **Mouth shapes (debug)** | 口の形（A, I, U, E, O, X）を1つずつ手動で表示確認できます。フレームレート（FPS）も表示されます。 | | **音声エンジン / Voice** | ・**デスクトップ版**: **Edge Neural Voice**（日・英合わせて50種近い高品質Neural音声、Nanami/Keita/Jenny等）または **OS System Voice**（オフライン用）<br>・**Web版**: Kokoro AI 音声（英語・WebGPU）または Browser voice（日本語対応） | | **Voice / Speed** | 声の種類と、読み上げの速さ（0.5〜2倍）を選びます。 | | **テキスト欄** | 読み上げる文章を入力します。読んでいる文が強調表示されます。 | | **Speak / Pause / Stop** | 読み上げの開始・一時停止・停止です。 | | **Speak & record video** | 読み上げながらアバターを録画し、音声付き動画ファイルとしてダウンロードします。 | | **ステータス欄** | メッセージ、進み具合、エラーが表示されます。 | --- ## 4. 文章を読み上げる 1. **音声（話者）を選びます**: - **デスクトップアプリ版**: **Speech engine** で **Edge Neural Voice**（推奨・高品質AI音声）または **OS System Voice**（オフライン）を選び、**Voice** ドロップダウンからお好みの日本語・英語音声（Nanami, Keita, Jenny, Guy 等）を選択します。 - **Web版**: - **Browser voice**: ブラウザ内蔵音声（日本語対応）。 - **Kokoro (AI voice, English)**: 高品質 AI 音声（英語のみ）。初回のみ「Download & load model」を実行します。 2. **Speed** で読み上げ速度（0.5〜2倍）を調整します。 3. テキスト欄に文章を入力・貼り付けます。 4. **「Speak」** を押すと読み上げが始まり、アバターが連動して喋ります。 --- ## 5. 顔写真や自作アバターを読み込む ### 5.1 顔写真を使う（Photo Avatar） - 正面を向いた顔写真（JPG / PNG / WebP）をステージにドラッグ＆ドロップするか、「Load photo」から選びます。 - 自動的に目・口・あごが認識され、喋るようになります。 - うまく認識されない場合は「Mark mouth」を押し、写真上の口の「左端」と「右端」をクリックしてください。 ### 5.2 自作イラストアバターを使う（Custom Avatar） - パーツ分けされた自作アバター画像を含むフォルダまたは `.zip` ファイルを読み込みます。 - 構成例：`avatar.json`, `base.png`, `eyes_open.png`, `eyes_closed.png`, `mouth_A.png`, `mouth_I.png`, `mouth_U.png`, `mouth_E.png`, `mouth_O.png`, `mouth_X.png` --- ## 6. 動画として書き出す 1. 必要に応じて背景を「Chroma green（グリーンバック）」にします。 2. **「Speak & record video」** を押します。 3. 読み上げ終了後、動画ファイル（`.webm`）が自動的にダウンロード・保存されます。