如何設定表情?Live2D Cubism 表情檔介紹與設定方式

| @amiversedev

如何設定表情? Live2D Cubism 表情檔內容與設定

在開發 amiverse 時,如何讓角色的演出能符合情緒與情境起伏,是聊天體驗沈浸感的關鍵之一。繼先前我們介紹 如何在原生 iOS 中以 AI 驅動 Live2D 角色 後,這裡來介紹在視覺體驗上重要的一環:Live2D 角色表情的設定方式。此外,我們也會稍微介紹一下 amiverse 中的表情設定功能。

表情驅動的核心機制:臉部模型參數與表情檔案

Live2D Cubism 的角色模型通常能夠做出生動的臉部表情,並強調能透過相機捕捉使用者臉部特徵來動態演出角色表情。目前有許多 (也可能幾乎是所有) VTubers 都會透過 Vtube Studio 來操作 2D 角色模型來開直播。其中的關鍵在 Live2D Cubism 角色臉部的模型參數。我們可以透過控制參數數值,來控制角色臉上的各部件,例如眨眼、嘴形、眉形、或角色繪師與建模師在製作角色時實作的臉部部件。

以 amiverse 的星見幽為例,透過 Live2D Cubism Viewer 開啟模型檔案後,可以觀察哪些臉上的部件可以透過參數控制。

uchuu-params.webp

要設定臉部的表情,我們只要選擇部分臉部模型參數並設定數值即可。在 Live2D Cubism 中,我們可以將選定的參數整理成 表情參數檔案 .exp3.json 來提供。

製作表情檔案 exp3.json 的方式

這裡是幾個一般製作表情檔案的方式:

  • 透過 Cubism Editor 製作 .motion3.json 後轉檔: 這個方法適合擁有模型原始檔案 (.cmo3) 的開發者。除非你本身是建模師,或委託建模師時有額外提出需求,否則大多情況下,你只會取得已經輸出的模型檔案 (.moc3),此時便無法使用這個方式。
  • 透過 Cubism Viewer: 若你只有輸出的模型檔案 (.moc3),可以使用 Cubism Viewer 開啟模型檔案後、新增表情檔案 (File > Add > Expression)、在 Viewer 中拖曳各個參數滑桿至理想狀態後,便能輸出成 .exp3.json 檔案。

如果是對建模或 Cubism 工具沒有太多概念的程式開發者,我認為最快製作出表情檔案的方式是用文字編輯器 手動製作並編輯 .exp3.json 檔案。首先,.exp3.json 檔案的結構如下:

{
"Type": "Live2D Expression",
"Parameters": [
    { "Id": "<ParamName>", "Value": <Value>, "Blend": "Add" },
    // ...
]
}

其中 Type 是固定的字串,而 Parameters 則列出需要設定的部件參數 Id、數值 Value、以及套用模式 Blend。以星見幽為例,如果想要一個表情是眼睛看上右上角,我們可以找到對應的眼球參數名稱 (在 Cubism Viewer 內參數按右鍵可以找到 ID),並設定對應的數值:

{
  "Type": "Live2D Expression",
  "Parameters": [
    { "Id": "ParamEyeBallX", "Value": 0.8, "Blend": "Add" },
    { "Id": "ParamEyeBallY", "Value": 0.8, "Blend": "Add" }
  ]
}

關於 Blend 模式可用的數值,參考 Live2D SDK Manual 的說明。預設狀況下,使用 Add 即可。

因為表情是一種靜態動作 (只有固定一個狀態), 且 exp3.json 檔案本身結構不複雜。只需要掌握檔案格式、參數名稱與對應的模型部件,就能做出合法可用的表情檔案。不過,如果遇到你想要的表情無法靠參數組合製作出來時,就得委託建模師幫你處理了 🥺

Live2D Cubism SDK 中處理表情的程式邏輯

Live2D Cubism SDK 的文件跟範例可能會需要開發者花一點時間摸索。未來若有機會,我們會推出一系列的開發教學。若你對這個開發流程有興趣、有想法、或是有相關開發問題,歡迎透過 Threads / 脆 和我們的開發同仁交流。

在 Live2D Cubism Native SDK 中,表情 (exp3.json) 在底層的處理方式其實與一般動作(motion3.json) 基本上是相同的。在播放動作時,我們會讀取動作檔案並隨時間不斷更新模型參數。例如,要讓角色視線看向右邊,我們可以隨著時間不斷將眼球的 X 參數增加。使用 SDK 時,程式的處理邏輯大約如下:

  1. 使用 CubismUserModel 讀取模型檔案,並使用 CubismUserModel::LoadExpression 解析表情檔案中的資料 (CubismUserModel.cpp#L103)
  2. 設定表情管理器 CubismExpressionMotionManager (CubismUserModel.hpp#L255, CubismExpressionMotionManager.hpp#L19)。在需要設定表情時,可以透過管理器使用底層的 StartMotion 來設定前一步的表情資料
  3. 在畫面更新時,使用 CubismExpressionMotionManager::UpdateMotion 更新模型參數 (CubismExpressionMotionManager.cpp#L38)。

如果需要更多資訊,可以參考 官方手冊。此外,個人認為 Live2D Cubism SDK 的組成和說明較為複雜,若是第一次嘗試使用,建議從目標平台的範例開始。

amiverse 中的表情設定方式介紹

未來 amiverse 將提供使用者直接設定角色的表情!使用者可以進入角色互動介面後,點選「外型」,並在選單中找到一系列的角色表情選項:

amiverse-set-expressions.webp

設定了一個表情後,與角色對話的過程中若觸發了其他的表情,多種表情會疊加演出。

我們目前也持續在精進 amiverse 在表情方面遊玩機制。若你對於 amiverse 的遊玩機制有期待,或者希望我們推出什麼特殊的玩法,歡迎透過 Instagram / IGThreads / 脆 留言給我們。感恩。