執筆バージョン: Unreal Engine 5.3
|
![](https://historia.co.jp/wp/wp-content/uploads/2024/03/KeyboFace02.gif)
これを作ります
はじめに
こんにちは
今回はテクスチャでキャラクターの表情を切り替えます。
3Dキャラクターに表情をつける方法としては2つあります。
- 表情を制御するボーンをアニメーションさせる
- 顔のテクスチャを切り替える
今回は後者の方法で表情をつくります。
例としてはどうぶつの森シリーズのキャラクターなんかは今回の方法だと思います。
やりたいこと
- アニメーションに合わせて表情を切り替える。
- 1枚のテクスチャで表情差分を作りたい。
![](https://historia.co.jp/wp/wp-content/uploads/2024/02/2024-02-29_18h04_36-300x280.jpg)
![](https://historia.co.jp/wp/wp-content/uploads/2024/02/2024-02-29_18h53_37-300x246.jpg)
- スケルタルメッシュとアニメーションアセットだけで切り替える。アニメーションブループリントは使わない。
![](https://historia.co.jp/wp/wp-content/uploads/2024/02/2024-02-29_19h09_49-300x188.jpg)
表情差分の描かれたテクスチャを作成
テクスチャを16分割して表情を等間隔に配置しました。
作りたい表情が4つ以下であれば、4分割でも構いません。
![](https://historia.co.jp/wp/wp-content/uploads/2024/03/TX_Face16-300x300.jpg)
マテリアル作成
UE5に移動してマテリアルを作成します。
まずはテクスチャをベースカラーへ接続。
![](https://historia.co.jp/wp/wp-content/uploads/2024/03/2024-03-01_11h45_16-250x300.jpg)
次にテクスチャのUV座標を指定できるようにノードを組みます。
![](https://historia.co.jp/wp/wp-content/uploads/2024/03/2024-03-01_12h57_45-1024x457.jpg)
上記2つのノードはパラメータにしました。
XとYの座標をパラメータにすることで、アニメーションアセットからUVを指定できるようにします。
スケルタルメッシュにCurveデータを追加
Blenderでキーボーの顔部分に当たるUVを編集しました。
また体と顔でマテリアルを分けてマテリアルチャンネルを2つにしました。
![](https://historia.co.jp/wp/wp-content/uploads/2024/03/2024-03-01_12h11_55-300x137.jpg)
作成したモデルをUE5にインポートしてスケルタルメッシュを開きます。
アニメーションアセットで編集するカーブをスケルタルメッシュに追加します。
「カーブ」パネルが必要になりますが、エディタ環境によってはパネルが表示されていない場合があります。
「ウインドウ」→「カーブ」でパネルが出てきます。
![](https://historia.co.jp/wp/wp-content/uploads/2024/03/2024-03-01_16h25_08-1024x383.jpg)
Curveパネルにマテリアルのパラメータを追加します。
1.「カーブを追加」を押すとカーブの名前をつけるよう求められます。
ここの名前はマテリアルで作成したパラメータ名「FaceID_X」「FaceID_Y」とします。
![](https://historia.co.jp/wp/wp-content/uploads/2024/03/2024-03-01_16h38_05.jpg)
2.2つのカーブが作成されました。
![](https://historia.co.jp/wp/wp-content/uploads/2024/03/2024-03-01_16h37_33.jpg)
3.タイプの列にバツマークがありますが、右側のバツマークをクリックして緑色のチェックマークに切り替えましょう。
FaceID_X、FaceID_Yの2つともチェックマークにすれば完了です。
![](https://historia.co.jp/wp/wp-content/uploads/2024/03/2024-03-01_16h37_45.jpg)
アニメーションアセットにカーブを設定
アニメーションアセットを開きます
タイムラインの「カーブ(0)」の右側にあるプルダウンから「カーブを追加」。
一覧の中にスケルタルメッシュで作成したカーブがありますので選びます。
![](https://historia.co.jp/wp/wp-content/uploads/2024/03/2024-03-01_16h53_22-1.jpg)
追加したカーブを編集します。
画像の部分をクリックするとカーブエディタが開きます。
![](https://historia.co.jp/wp/wp-content/uploads/2024/03/2024-03-01_17h04_07.jpg)
カーブエディタで入力する値ですが、UVの値について図解します。
今回使ったテクスチャは16分割されていますので、各表情の値は下記のようになります。
![](https://historia.co.jp/wp/wp-content/uploads/2024/03/2024-03-01_17h21_27-300x296.jpg)
それを踏まえて下記のようにカーブを編集しましょう
画像はFaceID_Xのカーブです。
![](https://historia.co.jp/wp/wp-content/uploads/2024/03/2024-03-01_17h04_21.jpg)
カーブを設定して、アニメーションを再生すると表情が切り替わります。
![](https://historia.co.jp/wp/wp-content/uploads/2024/03/KeyboFace01.gif)
既に完成しているように見えますが、X方向のUVしか編集していません。
FaceID_XとFaceID_Y 両方にカーブを設定することで、すべての表情に切り替えられます。
![](https://historia.co.jp/wp/wp-content/uploads/2024/03/2024-03-01_18h56_06-240x300.jpg)
完成
![](https://historia.co.jp/wp/wp-content/uploads/2024/03/KeyboFace02.gif)
すべての表情に切り替えることができました!
(アニメーションに対して表情が多すぎる…)
ポーズに合わせて表情が変わると、キャラクターのクオリティがグッと上がりますね!
ぜひ皆さんのキャラクターにも表情をつけてみてください。
それでは~