asanchezyali/talking-avatar-with-ai

搭載 AI 的會說話虛擬形象

是什麼 – 一個小型開源示範，讓您能與 3D「數位人類」（命名為 Jack）對話。該虛擬形象透過 Whisper 聽取（語音輸入），透過 OpenAI 的 GPT-3/ChatGPT 思考（邏輯處理），透過 Eleven Labs TTS 說話（語音輸出），並透過 Rhubarb Lip-Sync 與預先定義的動畫片段實現嘴唇與面部表情的動作（口型同步）。整個系統透過 TypeScript/React 前端與 Node/Yarn 單體倉儲後端連結在一起。

核心組件

• LLM 大腦 – @langchain/openai 建構一個提示，強制模型回傳包含 text、facialExpression 與 animation 的 JSON 陣列。回應透過 zod 解析，以確保結構正確。
• 語音轉文字 – OpenAI Whisper 將使用者語音輸入轉換為文字。
• 文字轉語音 – Eleven Labs 根據 LLM 的回應生成高品質音訊。
• 音素生成 – Rhubarb Lip-Sync 將音訊轉換為嘴型提示元資料，使 3D 面部能實現口型同步。
• 前端 – 使用 Tailwind CSS 與 React-Three-Fiber 的 React 應用程式渲染虛擬形象，套用所選的動畫／表情，並播放音訊。

運作流程（高階流程）

1. 使用者輸入 – 任選文字輸入或音訊錄音。
2. 語音轉文字（僅語音輸入）– Whisper → 純文字。
3. LLM 呼叫 – 文字透過自訂提示傳送至 OpenAI 的 GPT 模型，要求回傳包含 text、facialExpression 與 animation 的 JSON 資料。
4. TTS – text 欄位傳送至 Eleven Labs，回傳音訊檔案。
5. 口型同步 – 音訊檔案輸入 Rhubarb，輸出嘴型時間戳（mouthCues）。
6. 渲染 – 前端讀取 JSON，切換虛擬形象的面部表情與動畫，播放音訊，並使用嘴型資料驅動口型同步。

快速上手

1. 前置條件 – OpenAI、Eleven Labs 與 Rhubarb 帳號（建議付費方案）、ffmpeg，以及最新版 Node/Yarn 環境。
2. 克隆與安裝

   git clone git@github.com:asanchezyali/talking-avatar-with-ai.git
   cd digital-human
   yarn   # 安裝單體倉儲套件
   

3. 設定 – 在 /apps/backend/.env 中填入您的 OpenAI 與 Eleven Labs 的金鑰與 ID。
4. 執行 – 執行 yarn dev，開啟 http://localhost:5173/。

您將看到 – 一個網頁顯示一個 3D 虛擬形象，能根據您的語音或輸入文字做出適當的面部表情（微笑、悲傷、憤怒、驚訝、搞笑臉、預設）與身體動畫（Idle、TalkingOne、TalkingThree 等）。虛擬形象的聲音來自 Eleven Labs，其嘴唇動作透過 Rhubarb 實現同步。

限制／注意事項

• 本示範依賴外部付費 API；免費方案可能觸發速率限制，導致虛擬形象卡頓。
• 僅支援固定的表情與動畫集；擴展需修改提示並新增動畫資源。
• 此倉儲僅為概念驗證，非生產就緒框架——錯誤處理、可擴展性與 UI 精細度均較弱。

有用連結

• 詳細教學：https://monadical.com/posts/build-a-digital-human-with-large-language-models.html
• Discord 支援頻道：https://discord.gg/gJ3vCgSWeh
• Rhubarb Lip-Sync 倉儲：https://github.com/DanielSWolf/rhubarb-lip-sync

---

以上所有資訊均直接取自倉儲的 README，未假設任何額外功能。