返回目錄
A
虛擬偶像 2.0：AI 與數位娛樂的融合指南 - 第 3 章
第三章 3D 建模與即時渲染技術
發布於 2026-03-08 21:13
# 第三章 3D 建模與即時渲染技術
本章聚焦於將虛擬偶像從 **2D 概念圖** 轉化為 **可即時驅動的 3D 角色**，並闡述在 **Unity、Unreal Engine** 以及 **自研渲染管線** 中的完整製作流程、最佳化策略與實務應用。讀者將學習到從模型製作、材質設定、骨骼綁定，到即時渲染、直播輸出、VR/AR 整合的全端技術，為後續的動作捕捉與情感表達奠定堅實基礎。
---
## 3.1 3D 建模基礎概念
| 項目 | 說明 | 常用工具 |
|------|------|----------|
| **拓撲 (Topology)** | 網格佈局決定變形品質與效能。建議使用 **四邊形** 網格、適度的 **邊緣流 (edge flow)**，關鍵部位（如臉部、手指）保留足夠細分。 | Blender、Maya、3ds Max |
| **多邊形數量** | 虛擬偶像多用於即時渲染，建議 **2k‑4k 三角形** 以平衡畫質與 FPS。 | 同上 |
| **UV 展開** | 需避免重疊、拉伸過大，常用 **2x2** 或 **4x4** 佈局以利貼圖分辨率配置。 | RizomUV、UVLayout |
| **法線與切線** | 正確的法線與切線是 **Normal Map** 正常工作前提，需在導出前檢查翻轉與尖銳度。 | 同上 |
> **實務建議**：在概念階段即確定模型細節層級（Low‑Poly → High‑Poly），並以 **Decimation** 或 **Retopology** 工具快速產出即時用版本。
## 3.2 紋理、材質與 PBR 工作流
### 3.2.1 PBR 基礎
- **Albedo (Base Color)**：不含光照信息的顏色貼圖。
- **Metallic**：金屬度 0–1，決定金屬與非金屬的反射特性。
- **Roughness / Glossiness**：控制表面粗糙度，數值越高表面越散射。
- **Normal Map**：模擬細節凹凸。
- **AO (Ambient Occlusion)**：提升陰影細節，可與其他貼圖合併。
### 3.2.2 常用貼圖分辨率對照表
| 角色重要度 | Albedo | Metallic/Roughness | Normal | AO |
|------------|--------|---------------------|--------|----|
| 主角 (Live) | 4K | 2K | 2K | 2K |
| 次要角色 | 2K | 1K | 1K | 1K |
| 群眾模型 | 1K | 512 | 512 | 512 |
### 3.2.3 工具與自動化
- **Substance Designer / Painter**：批次產生金屬度、粗糙度圖。
- **MaterialX**：跨平台的材質描述語言，可在 Unity 與 UE 之間共享同一套 PBR 定義。
## 3.3 骨骼系統與綁定 (Rigging)
1. **骨骼層級設計**：
- 主體（Spine）→ 上半身（Chest）→ 頭部（Head）
- 四肢（Upper‑Leg, Lower‑Leg, Foot）
- 手部與手指（Hand, Finger_01‑03）
2. **控制器 (Control Rig)**：使用 **FK/IK** 切換、**Space Switch** 讓動畫師在同一骨骼上切換參考座標。
3. **表情驅動**：
- **BlendShape / Morph Target**（100–150 個表情）
- **骨骼驅動 (Bone‑Driven BlendShapes)**：減少資料量，適合即時渲染。
> **技巧**：在 Maya 中使用 **HumanIK** 或 **Advanced Skeleton** 產出可直接匯入 Unity 的 **Humanoid** 骨骼結構，降低跨平台適配成本。
## 3.4 Unity 實作流程
### 3.4.1 專案設定
```csharp
// ProjectSettings/GraphicsSettings.asset
using UnityEngine;
using UnityEngine.Rendering;
public class RenderPipelineConfig : MonoBehaviour {
void Awake(){
GraphicsSettings.renderPipelineAsset = Resources.Load<RenderPipelineAsset>("HDRPAsset");
}
}
```
- 建議使用 **HDRP (High Definition Render Pipeline)** 以獲得真實光照與高品質透明。
- 若需求較低，**URP (Universal Render Pipeline)** 可提供更佳的 GPU 效能。
### 3.4.2 匯入模型與材質
| 步驟 | 操作說明 |
|------|----------|
| 1. 匯入 FBX | 確認 **Import Settings → Rig → Animation Type = Humanoid** |
| 2. 設定 Collider | 為角色添加 **Capsule Collider**、**Rigidbody**（若需物理互動） |
| 3. 建立 **Material** | 使用 **HDRP/Lit** Shader，套用 Albedo、Normal、Mask 等貼圖 |
| 4. 連結 **Animator** | 連接 **Animator Controller**，加入 **Idle, Talk, Dance** 等狀態 |
### 3.4.3 即時渲染技巧
- **GPU Instancing**：對於群眾模型必須開啟，以減少 Draw Call。
- **LOD (Level of Detail)**：使用 **LOD Group** 自動切換 0‑2 級模型。
- **光照貼圖 (Lightmap)**：在室內場景使用 **Baked GI** 以降低實時計算。
- **後期處理 (Post‑Processing)**：加入 **Bloom、Depth of Field、Color Grading** 提升舞台感。
### 3.4.4 直播輸出 (Virtual Live)
| 工具 | 功能 |
|------|------|
| **Unity Recorder** | 直接錄製 Render Texture → MP4、Image Sequence |
| **OBS (Open Broadcaster Software)** | 捕捉 Unity 窗口、加入 OBS 插件如 **NDI** 進行遠端多機位合成 |
| **Live Link (Unity‑Unreal Bridge)** | 兩端即時同步骨骼、表情與攝影機資訊 |
## 3.5 Unreal Engine 實作流程
### 3.5.1 專案與渲染設定
- **Engine Version**：至少 5.0 以上，啟用 **Nanite**（虛擬化幾何）與 **Lumen**（全局光照）
- **Project Settings → Rendering → Forward Shading**：適合虛擬偶像舞台的高帧率需求。
### 3.5.2 匯入與骨骼設定
```ini
[ImportData]
ImportMorphTargets=True
ImportMaterials=True
ImportTextures=True
```
- 匯入 **FBX** 時選擇 **Skeletal Mesh**，勾選 **Import Animations**（若已有預製動畫）
- 使用 **MetaHuman** 或 **Control Rig** 建立自訂控制器。
### 3.5.3 渲染優化要點
| 功能 | 說明 |
|------|------|
| **Nanite** | 自動 LOD，適合高細節模型，減少手動 LOD 工作 |
| **Lumen** | 即時全局光照與反射，無需預烘培，適合動態舞台光源 |
| **Virtual Shadow Maps** | 高品質陰影，支援透明物件 |
| **Material Parameter Collections** | 集中管理全局材質參數（如光強度、色溫） |
### 3.5.4 Live Streaming 與虛擬攝影棚
- **Pixel Streaming**：將 UE 畫面以 WebRTC 形式輸出至瀏覽器，支援遠端導播與觀眾互動。
- **LiveLink Face (iOS)**：使用 iPhone 前置鏡頭捕捉臉部表情，直接驅動 UE **Control Rig**。
- **Multi‑User Editing**：團隊可同時操控同一場景，適合演唱會即時切換鏡頭。
## 3.6 自研渲染管線概述
| 項目 | 目的 | 常見實作方式 |
|------|------|--------------|
| **資料驅動渲染** | 以資料表 (Data‑Table) 控制材質與特效 | 使用 **Compute Shader**，在 GPU 上完成粒子、光線追蹤 |
| **自訂光照模型** | 簡化光照計算以提升手機端 FPS | 引入 **BRDF Approximation**（如 Disney BRDF） |
| **跨平台抽象層** | 同時支援 Unity、UE、WebGL | 采用 **Vulkan / Metal** 統一抽象介面，透過 **C++14** 或 **Rust** 撰寫核心模組 |
### 3.6.1 範例：簡易 Forward 渲染 Shader (GLSL)
```glsl
#version 460 core
layout (location = 0) in vec3 aPos;
layout (location = 1) in vec3 aNormal;
layout (location = 2) in vec2 aUV;
layout (binding = 0) uniform sampler2D uAlbedo;
layout (binding = 1) uniform sampler2D uNormal;
layout (binding = 2) uniform sampler2D uMetalRough;
out vec4 FragColor;
void main(){
vec3 N = normalize(aNormal);
vec3 V = normalize(-aPos);
vec3 L = normalize(vec3(0,10,10));
vec3 H = normalize(V+L);
vec3 albedo = texture(uAlbedo, aUV).rgb;
float metallic = texture(uMetalRough, aUV).r;
float rough = texture(uMetalRough, aUV).g;
// Disney Diffuse + Specular
vec3 F0 = mix(vec3(0.04), albedo, metallic);
float NDF = DistributionGGX(N, H, rough);
float G = GeometrySmith(N, V, L, rough);
vec3 F = FresnelSchlick(max(dot(H,V),0.0), F0);
vec3 kS = F;
vec3 kD = vec3(1.0) - kS;
kD *= 1.0 - metallic;
vec3 numerator = NDF * G * F;
float denominator = 4.0 * max(dot(N,V),0.0) * max(dot(N,L),0.0) + 0.001;
vec3 specular = numerator / denominator;
vec3 Lo = (kD * albedo / PI + specular) * max(dot(N,L),0.0);
FragColor = vec4(Lo,1.0);
}
```
> 此範例說明了如何在自研管線中實作 PBR，適合在 **手機端** 或 **WebGL** 建置輕量級虛擬偶像展示。
## 3.7 即時渲染效能管理
| 技術 | 適用平台 | 說明 |
|------|----------|------|
| **GPU Instancing** | PC/Console | 減少 Draw Call，適用於大量相同模型（觀眾、特效） |
| **Mesh Decals** | PC/Mobile | 用於即時貼花（血跡、光斑）而不必重新渲染整個模型 |
| **Shader LOD** | Mobile | 針對遠距離角色切換低階 Shader（僅 Albedo） |
| **Deferred Rendering** | PC/Console | 在光源多樣且場景複雜時減少光照計算成本 |
| **Forward+ Rendering** | PC/Console | 結合 Forward 的透明度與 Deferred 的光源管理 |
### 3.7.1 計算指標
- **FPS**：目標 60 fps（VR 需 90 fps）
- **GPU 記憶體佔用**：不超過 4 GB（手機上限 2 GB）
- **Draw Call**：< 150（使用 Instancing 之後）
### 3.7.2 優化工作流程
1. **Profiler (Unity/UE)** → 找出瓶頸
2. **Stat Unit** → 觀測 Draw, Tris, Batches
3. **Shader Variant Stripping** → 移除未使用的變體
4. **Batching & Culling** → 使用 **Occlusion Culling** 與 **Frustum Culling**
5. **Texture Streaming** → 動態載入高分辨率貼圖
## 3.8 直播、虛擬攝影棚與多平台輸出
### 3.8.1 虛擬攝影棚架構
```
[Motion Capture] → [Live Link] → [Engine (Unity/UE)] → [Virtual Camera] →
├─> [Local OBS] → [Streaming Platforms]
└─> [NDI Output] → [Remote Production Switcher]
```
- **Motion Capture**：可選 **OptiTrack**（光學）或 **Xsens**（慣性）
- **Live Link**：實時傳輸骨骼、表情、攝影機位置
- **Virtual Camera**：在引擎內以 **CineCamera**（UE）或 **Cinemachine**（Unity）控制鏡頭參數，並支援 **Depth of Field**、**Lens Distortion**
### 3.8.2 多平台同步
| 平台 | 輸出方式 | 特色 |
|------|----------|------|
| **YouTube Live** | RTMP 推流 | 支援 1080p/60fps，延遲約 5 s |
| **Twitch** | RTMP 推流 | 低延遲模式 (Chat Interaction) |
| **Bilibili** | RTMP/FLV | 需額外 **TD‑Player** 兼容性測試 |
| **TikTok Live** | RTMP | 垂直畫面 (9:16) 需在引擎內布局 UI |
| **Meta Horizon** | WebRTC (Pixel Streaming) | 直接在 VR 頭盔內觀看 3D 場景 |
> **小技巧**：使用 **OBS NDI Plugin** 將 Unity/UE 輸出的畫面作為 NDI 來源，於 OBS 中同時切換多個角度或加入實時字幕、觀眾彈幕。
## 3.9 VR/AR 整合實務
### 3.9.1 VR 互動模型
- **手部追蹤**：透過 **Valve Index Controllers** 或 **Quest Hand Tracking**，將虛擬偶像的手部骨骼與玩家手部同步。
- **空間音效**：使用 **Steam Audio** 或 **Wwise**，將虛擬偶像的聲源定位於 3D 空間，提升沉浸感。
### 3.9.2 AR 投射與混合實境
- **ARKit / ARCore**：以 **Face Tracking** 捕捉使用者表情，映射至虛擬偶像的 **BlendShape**，打造「同框合照」體驗。
- **使用 Unity AR Foundation**：簡化跨平台開發，僅需一套 **Prefab** 即可部署至 iOS、Android。
### 3.9.3 案例：AR Live Concert
1. 使用 **iPhone 14 Pro** 作為前端捕捉裝置，收集臉部表情與手勢。
2. 透過 **Live Link Face** 將資料即時傳至 Unity。
3. Unity 中的 **RenderTexture** 投射至 **ARCore** 的平面偵測上，形成「舞台」投影。
4. 觀眾使用手機觀賞時，同時看到環境與虛擬偶像的混合畫面。
## 3.10 小結
- **3D 建模** → 以 **拓撲、UV、PBR** 為基礎，確保模型在即時渲染中的表現與效能。
- **即時渲染管線**：根據目標平台選擇 **HDRP/URP**（Unity）或 **Lumen/Nanite**（Unreal），同時掌握 **Shader、LOD、Instancing** 等優化技巧。
- **直播與多平台**：結合 **Live Link、OBS、Pixel Streaming**，打造可跨平台同步的虛擬演出。
- **VR/AR 整合**：透過 **手部/臉部追蹤** 與 **空間音效**，將虛擬偶像的舞台延伸至沉浸式環境。
掌握以上技術，全流程從 **概念 → 3D 建模 → 即時渲染 → 互動直播** 的鏈結即告完成，為後續的動作捕捉、情感表達與粉絲經營奠定堅實基礎。讀者可依照本章提供的工具與最佳實踐，快速原型化並上線具備高品質渲染的虛擬偶像作品。