文章目錄

• • • 一、前言
    • 二、原神模型下載
    • • 1、第一期模型
      • 2、第二期模型
      • 3、第三期模型
      • 4、第四期模型
      • 5、第五期模型
      • 6、第六期模型
      • 7、第七期模型
      • 8、模型合集打包下載
    • 三、pmx轉(zhuǎn)fbx
    • • 1、Blender下載與安裝
      • 2、Cats插件下載與安裝
      • 3、導(dǎo)入pmx模型
      • 4、修復(fù)材質(zhì)問題
      • 5、修復(fù)模型：Fix Model
      • 6、導(dǎo)出fbx
    • 四、Unity部分
    • • 1、導(dǎo)入fbx和貼圖
      • 2、從fbx中導(dǎo)出材質(zhì)球
      • 3、卡通渲染
      • • 3.1、簡(jiǎn)單粗暴，使用Unlit/Texture
        • 3.2、基于光照的卡通渲染
        • 3.3、UnityToonShader項(xiàng)目
        • 3.4、ToonMultiStepShader.shader
        • 3.5、材質(zhì)球設(shè)置
        • 3.6、效果演示
      • 4、添加動(dòng)畫
      • • 4.1、人形動(dòng)畫資源獲取
        • 4.2、設(shè)置人形動(dòng)畫
        • 4.3、添加Animator動(dòng)畫
        • 4.4、運(yùn)行效果
    • 四、Demo工程下載
    • 五、完畢

一、前言

嗨，大家好，我是新發(fā)。
我這兩天在做一個(gè)RPG打群架的個(gè)人作品，涉及到一些渲染和人物動(dòng)畫控制的問題，順手寫篇教程，這里角色模型我用原神的模型來演示。

效果如下

原神模型使用守則：
◆允許完善物理，修正模型權(quán)重、表情等bug
允許改色，適度更改衣裝，添加spa、toon等
◆請(qǐng)勿二次配布，以及拆取部件以用于改造其他模型
請(qǐng)勿用于18禁作品，極端宗教宣傳，血腥恐怖獵奇作品，人身攻擊等
請(qǐng)勿用于商業(yè)用途
◆他人使用本模型所造成的一切不良后果，不由模型改造者與miHoYo承擔(dān)，請(qǐng)向使用者追究全部責(zé)任

二、原神模型下載

原神的模型可以在官網(wǎng)直接下載到。

1、第一期模型

官網(wǎng)：https://ys.biligame.com/gczj/

2、第二期模型

官網(wǎng)：http://ys.biligame.com/pjdkx/

3、第三期模型

官網(wǎng)：https://ys.biligame.com/beyel

4、第四期模型

官網(wǎng)：https://ys.biligame.com/ysl

5、第五期模型

官網(wǎng)：https://www.bilibili.com/blackboard/activity-raop07Ymhm.html

6、第六期模型

官網(wǎng)：https://www.bilibili.com/blackboard/activity-kiOl0D1nF8.html

7、第七期模型

官網(wǎng)：https://www.bilibili.com/blackboard/activity-btLCSzTTsK.html

8、模型合集打包下載

如果你不想一個(gè)個(gè)下載，可以從我的網(wǎng)盤下載，我已經(jīng)全部打包好了，
網(wǎng)盤地址：https://pan.baidu.com/s/1gUCyDuu9D2Aoug6weK2WxA
提取碼：bbr5

三、pmx轉(zhuǎn)fbx

我們下載下來后，模型的格式是pmx，

我們需要把它轉(zhuǎn)為fbx格式才能導(dǎo)入U(xiǎn)nity中使用。pmx轉(zhuǎn)fbx可以通過Blender來轉(zhuǎn)，剛好我之前自學(xué)了Blender，也寫過幾篇Blender配合Unity的文章，大家感興趣的可以看看：
《【游戲開發(fā)創(chuàng)新】上班通勤時(shí)間太長，做一個(gè)任意門，告別地鐵與塞車（Unity | 建模 | ShaderGraph | 搖桿 | 角色控制）》

《【游戲開發(fā)創(chuàng)新】自學(xué)Blender建模，自制孔明燈，在Unity中點(diǎn)亮整個(gè)星空，愿新年，勝舊年（Unity | 建模 | 粒子系統(tǒng) | 預(yù)設(shè)）》

《【游戲開發(fā)創(chuàng)新】當(dāng)我學(xué)了Blender 建模，自制3D電腦桌面，回收站爆發(fā)了，把我做的模型都吐了出來（Blender | Unity | FBX）》

回歸正題，下面就來教大家如何使用Blender將pmx轉(zhuǎn)為fbx格式。

1、Blender下載與安裝

Blender官網(wǎng)：https://www.blender.org/
中文手冊(cè)：https://docs.blender.org/manual/zh-hans/2.79/about/introduction.html

由于Blender官網(wǎng)的下載速度太慢，建議去Blender中國社區(qū)下載，地址：https://www.blendercn.org/

根據(jù)你的電腦系統(tǒng)下載對(duì)應(yīng)的版本，我是windows系統(tǒng)，點(diǎn)擊下載windows平臺(tái)的安裝包，

下載完后直接傻瓜式安裝即可~

2、Cats插件下載與安裝

Blender是開源免費(fèi)的，輕量又強(qiáng)大，易于上手，很適合個(gè)人獨(dú)立開發(fā)者學(xué)習(xí)和使用，它具有豐富的插件生態(tài)，就像VSCode一樣，我們這里要將pmx轉(zhuǎn)為fbx格式，就需要用到一個(gè)Cats插件。
Cats插件自身也是開源的，我們直接從GitHub上下載。
地址：https://github.com/GiveMeAllYourCats/cats-blender-plugin
如下，點(diǎn)擊Cats Blender Plugin，下載下來的是一個(gè)zip文件，

現(xiàn)在我們打開Blender，然后點(diǎn)擊菜單Edit / Preferences，打開偏好設(shè)置窗口，

點(diǎn)擊Add ons，然后點(diǎn)擊install按鈕，

然后選擇我們剛剛下載的Cats插件文件，點(diǎn)擊Install Add-on，

安裝完畢后，記得勾選上它，（如果你沒勾選，插件就是禁用狀態(tài)的）

現(xiàn)在，我們就可以在編輯區(qū)的側(cè)邊欄那里看到CATS插件了，（注：側(cè)邊欄顯示和隱藏的快捷鍵是N）

3、導(dǎo)入pmx模型

我們?cè)贑ATS插件中點(diǎn)擊Import Model按鈕，

然后選擇pmx文件，點(diǎn)擊Import Any Model按鈕，

此時(shí)導(dǎo)進(jìn)來的模型的材質(zhì)有問題，是這樣子的，

4、修復(fù)材質(zhì)問題

我們打開側(cè)邊欄的Misc，然后點(diǎn)擊Shadeless（即使用卡通材質(zhì)），

此時(shí)我們就可以看到正常顯示了，

看下細(xì)節(jié)

5、修復(fù)模型：Fix Model

我們可以看到，模型的節(jié)點(diǎn)命名并不是按照Unity骨骼映射的英文命名，

我們點(diǎn)擊CATS插件的Fix Model按鈕，即可自動(dòng)進(jìn)行修復(fù)，除此之外，它還會(huì)幫我們刪除多余無用的骨骼，將使用同一張貼圖的節(jié)點(diǎn)合并為一個(gè)Mesh并重命名為Body等，

修復(fù)后可以看到變成英文命名了，

6、導(dǎo)出fbx

點(diǎn)擊CATS插件的Export Model按鈕，即可導(dǎo)出fbx文件，

建議導(dǎo)出fbx文件放在pmx文件同級(jí)目錄中，

如下，

四、Unity部分

1、導(dǎo)入fbx和貼圖

我們上面的fbx文件和tex文件夾（里面是貼圖）一起拷貝到Unity工程中，（如果你沒有拷貝tex文件夾，在Unity中顯示的就是白模）

此時(shí)我們把模型拖入場(chǎng)景中，看到的效果是這樣的，

2、從fbx中導(dǎo)出材質(zhì)球

上面我們看到，模型的材質(zhì)效果不是 卡通渲染風(fēng)格，當(dāng)你去定位模型的材質(zhì)的時(shí)候，會(huì)發(fā)現(xiàn)材質(zhì)是嵌在fbx文件里的，

我們并不能對(duì)fbx內(nèi)的材質(zhì)進(jìn)行編輯，

沒關(guān)系，我們把材質(zhì)導(dǎo)出來。
選中fbx文件，在Inspector窗口中點(diǎn)擊Materials，設(shè)置Location為Use External Materials (Legacy)，然后點(diǎn)擊Apply按鈕，

此時(shí)材質(zhì)球就會(huì)從fbx文件中導(dǎo)出來了，

接下來我們就可以修改材質(zhì)球的shader了，默認(rèn)是Standard，

3、卡通渲染

卡通渲染不像 PBR那樣有標(biāo)準(zhǔn)流程和衡量準(zhǔn)則，可以說卡通渲染是人們主觀審美 + 現(xiàn)實(shí)環(huán)境抽象的結(jié)合，不同人對(duì)卡通渲染的理解理念不同，不過隨著卡通渲染的不斷發(fā)展，也形成了一套固定思路。

3.1、簡(jiǎn)單粗暴，使用Unlit/Texture

最粗暴的方式就是直接使用Unlit材質(zhì)，在貼圖上表現(xiàn)出卡通效果。
我們把材質(zhì)球的shader全部改成Unlit/Texture（也就是無光照模型，直接顯示貼圖紋理），

效果如下：

當(dāng)然，這過于簡(jiǎn)單了，缺點(diǎn)很明顯，沒有光照效果。

3.2、基于光照的卡通渲染

我們對(duì)比看下原神游戲中的畫面效果，是一種次時(shí)代卡通效果。我們可以看到，它是有光照效果的，太陽在右側(cè)，人物面朝太陽方向時(shí)，光照面會(huì)有高光，背面會(huì)有陰影；當(dāng)背朝太陽時(shí)則相反。

我們需要考慮光照，也就是基于光照模型的卡通渲染。

3.3、UnityToonShader項(xiàng)目

基于光照模型的卡通渲染，我在GitHub上找到了一個(gè)項(xiàng)目，地址：https://github.com/Sorumi/UnityToonShader
如果你訪問不了GitHub，可以訪問我的CODE CHINA，我已將它Fork過來了，

3.4、ToonMultiStepShader.shader

進(jìn)入上面這個(gè)項(xiàng)目的Assets/Shaders目錄，可以看到一些shader腳本，我使用的是這個(gè)ToonMultiStepShader.shader，

shader代碼如下：

Shader "Toon/Basic/MultiSteps" {Properties{// 顏色_Color ("Color", Color) = (1, 1, 1, 1)_HColor ("Highlight Color", Color) = (0.8, 0.8, 0.8, 1.0)_SColor ("Shadow Color", Color) = (0.2, 0.2, 0.2, 1.0)// 貼圖_MainTex ("Main Texture", 2D) = "white" { }// 漸變_ToonSteps ("Steps of Toon", range(1, 9)) = 2_RampThreshold ("Ramp Threshold", Range(0.1, 1)) = 0.5_RampSmooth ("Ramp Smooth", Range(0, 1)) = 0.1// 鏡面_SpecColor ("Specular Color", Color) = (0.5, 0.5, 0.5, 1)_SpecSmooth ("Specular Smooth", Range(0, 1)) = 0.1_Shininess ("Shininess", Range(0.001, 10)) = 0.2// 邊緣_RimColor ("Rim Color", Color) = (0.8, 0.8, 0.8, 0.6)_RimThreshold ("Rim Threshold", Range(0, 1)) = 0.5_RimSmooth ("Rim Smooth", Range(0, 1)) = 0.1}SubShader{Tags { "RenderType" = "Opaque" }CGPROGRAM#pragma surface surf Toon addshadow fullforwardshadows exclude_path:deferred exclude_path:prepass#pragma target 3.0// 基礎(chǔ)色fixed4 _Color;// 高光顏色fixed4 _HColor;// 陰影色fixed4 _SColor;// 主貼圖sampler2D _MainTex;// 漸變閾值float _RampThreshold;// 漸變平滑度float _RampSmooth;// 漸變階數(shù)float _ToonSteps;// 鏡面平滑度float _SpecSmooth;// 光滑度fixed _Shininess;// 邊緣顏色fixed4 _RimColor;// 邊緣閾值fixed _RimThreshold;// 邊緣光滑度float _RimSmooth;struct Input{float2 uv_MainTex;float3 viewDir;};// 線性階躍float linearstep(float min, float max, float t){return saturate((t - min) / (max - min));}inline fixed4 LightingToon(SurfaceOutput s, half3 lightDir, half3 viewDir, half atten){half3 normalDir = normalize(s.Normal);half3 halfDir = normalize(lightDir + viewDir);float ndl = max(0, dot(normalDir, lightDir));float ndh = max(0, dot(normalDir, halfDir));float ndv = max(0, dot(normalDir, viewDir));// 平滑階躍float diff = smoothstep(_RampThreshold - ndl, _RampThreshold + ndl, ndl);float interval = 1 / _ToonSteps;// float ramp = floor(diff * _ToonSteps) / _ToonSteps;float level = round(diff * _ToonSteps) / _ToonSteps;float ramp ;if (_RampSmooth == 1){ramp = interval * linearstep(level - _RampSmooth * interval * 0.5, level + _RampSmooth * interval * 0.5, diff) + level - interval;}else{ramp = interval * smoothstep(level - _RampSmooth * interval * 0.5, level + _RampSmooth * interval * 0.5, diff) + level - interval;}ramp = max(0, ramp);ramp *= atten;_SColor = lerp(_HColor, _SColor, _SColor.a);float3 rampColor = lerp(_SColor.rgb, _HColor.rgb, ramp);// 鏡面float spec = pow(ndh, s.Specular * 128.0) * s.Gloss;spec *= atten;spec = smoothstep(0.5 - _SpecSmooth * 0.5, 0.5 + _SpecSmooth * 0.5, spec);// 邊緣float rim = (1.0 - ndv) * ndl;rim *= atten;rim = smoothstep(_RimThreshold - _RimSmooth * 0.5, _RimThreshold + _RimSmooth * 0.5, rim);fixed3 lightColor = _LightColor0.rgb;fixed4 color;fixed3 diffuse = s.Albedo * lightColor * rampColor;fixed3 specular = _SpecColor.rgb * lightColor * spec;fixed3 rimColor = _RimColor.rgb * lightColor * _RimColor.a * rim;color.rgb = diffuse + specular + rimColor;color.a = s.Alpha;return color;}// 表面著色器void surf(Input IN, inout SurfaceOutput o){fixed4 mainTex = tex2D(_MainTex, IN.uv_MainTex);o.Albedo = mainTex.rgb * _Color.rgb;o.Alpha = mainTex.a * _Color.a;o.Specular = _Shininess;o.Gloss = mainTex.a;}ENDCG}FallBack "Diffuse" }

將其導(dǎo)入U(xiǎn)nity工程中，

3.5、材質(zhì)球設(shè)置

把材質(zhì)球的shader改為Toon/Basic/MultiSteps，如下

調(diào)整一下高光、陰影、漸變閾值、鏡面、邊緣等參數(shù)，

3.6、效果演示

效果如下，我們?cè)谛薷奶柟夥较?#xff0c;觀察不同角度的效果，

4、添加動(dòng)畫

我們要給角色添加動(dòng)畫，加入你現(xiàn)在已有一些人形骨骼動(dòng)畫，想套用在原神的模型上，怎么弄呢？我來教你~

4.1、人形動(dòng)畫資源獲取

假設(shè)你手頭上沒有人形動(dòng)畫，這個(gè)時(shí)候，我就要推薦你一個(gè)高級(jí)網(wǎng)站了：Mixamo，地址：https://www.mixamo.com/

Mixamo是Adobe旗下的一個(gè)產(chǎn)品，可以上傳靜態(tài)人形模型文件，在網(wǎng)站上綁定人形模板動(dòng)畫，并可以下載綁定動(dòng)畫后的模型文件。

我之前有寫過一篇文章專門介紹這個(gè)網(wǎng)站：《在線免費(fèi)角色動(dòng)畫網(wǎng)站：mixamo》

我們選擇一個(gè)喜歡的動(dòng)作，比如我選這個(gè)

點(diǎn)擊Download按鈕，

格式選擇FBX，不要包含網(wǎng)格（選Without Skin），然后點(diǎn)擊DOWNLOAD，

這樣我們就得到了一個(gè)含動(dòng)畫的fbx文件，

4.2、設(shè)置人形動(dòng)畫

我們把動(dòng)畫fbx文件導(dǎo)入U(xiǎn)nity中，如下

選中動(dòng)畫fbx文件，在Inspector窗口中點(diǎn)擊Rig，把Animation Type設(shè)置為Humanoid，然后點(diǎn)擊Apply，

此時(shí)我們點(diǎn)擊Configure，可以看到人形動(dòng)畫Avatar的綁定信息，

如下

同樣的，把我們?cè)竦膄bx模型的Animation Type也改為Humanoid，

同樣點(diǎn)擊Configure按鈕，檢查一下Avatar，

4.3、添加Animator動(dòng)畫

最后一步，把動(dòng)畫文件拖給模型父節(jié)點(diǎn)，此時(shí)會(huì)自動(dòng)掛一個(gè)Animator組件，我們?cè)O(shè)置一下Avatar對(duì)象，如下

注意，如果要讓動(dòng)畫循環(huán)播放，需要把動(dòng)畫的Loop Time勾選上，如下

4.4、運(yùn)行效果

加個(gè)背景圖，運(yùn)行效果如下，

emmmm，還是少一點(diǎn)效果，我們加上泛光屏幕后處理，如下

注：關(guān)于屏幕后處理，我在之前一些文章中與講到，可以看我之前的文章：
《【游戲仿真實(shí)驗(yàn)】使用Unity仿真電視機(jī)光學(xué)三原色顯示畫面，我是要成為海賊王的男人》
《Unity后處理（圖像優(yōu)化特效技術(shù)），實(shí)現(xiàn)影視級(jí)別的鏡頭效果，輔助標(biāo)簽：PostProcessing》

好了，剩下的就是大家自由發(fā)揮了，添加一些其他動(dòng)畫，進(jìn)行組合、控制。
關(guān)于Animator動(dòng)畫控制，我之前寫過相關(guān)教程，推薦大家看下，《Unity動(dòng)畫狀態(tài)機(jī)Animator使用》

四、Demo工程下載

本文Demo工程我已上傳到CODE CHINA，感興趣的同學(xué)可自行下載學(xué)習(xí)，
地址：https://codechina.csdn.net/linxinfa/MiHoYoModelTest

五、完畢

好啦，就到這里吧~
我是林新發(fā)：https://blog.csdn.net/linxinfa
原創(chuàng)不易，若轉(zhuǎn)載請(qǐng)注明出處，感謝大家~
喜歡我的可以點(diǎn)贊、關(guān)注、收藏，如果有什么技術(shù)上的疑問，歡迎留言或私信~

總結(jié)

以上是生活随笔為你收集整理的【游戏开发实战】下载原神模型，PMX转FBX，导入到Unity中，卡通渲染，绑定人形动画（附Demo工程）的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。