easy FPS Editor備忘録　8:HUDの顔を動かす

HUDアニメ実装で表現の幅が増えるよね

(ここから日記)
なんだかけっこう色々なことが起きた。
燃え尽き症候群に陥ったJessicoChanがEasy FPS Editorの開発を放棄したが、なんとClarkという人物にそこらへんの諸々が託されエンジンの開発が継続することに。謎の新キャラ登場である。
素性は不明ながら腕前は確かな謎の男、Clarkの手によってEasy FPS Editor LITE/PROはEasy FPS Editor CEへと名前を変え、2024年2月20日からなんか急速にアプデが決行された。他人任せのユーザーたちの飛び交う要望が着実に叶えられていき、欲しいのになかった新要素が色々実装されたのが2024年初頭の出来事だ。

Dollfenstein 3Dには顔アニメーションがない。これは当時のEasy FPS EditorにHUD画像の制御方法がなかったからで、顔グラフィックは武器アニメーション画像に張り付けるというかなり強引な方法で実装されている。
しかし、CE版ではアプデでHUD制御機能が追加され、好きな画像を任意のタイミングでHUDに表示させることが可能になった。敵のHPバーを実装したり、喋らせたり、もちろん顔のアニメーションだって可能だ。
(ここまで日記)

省力的顔面実装計画

rip and tear

DOOMといえばDOOMGUYであり、DOOMGUYといえば画面中央下で蠢く男の顔だ。武器を取れば微笑み、攻撃を受ければ驚き、負傷すれば血が出る彼の豊かな顔はプレイヤーに彼への愛着を持たせることに貢献している。
HUDの顔が蠢くというのはつまりkawaiiが発生するということであり、やはりそこを実装することによってゲームの価値は跳ね上がるという寸法である。
分かりやすい感じで簡単に顔アニメーションを実装させる場合、構造はこうなる。

ループスクリプト組むとかも一応できるけど条件分岐とか記述すんのめんどくさいし、今のバージョンはテスト段階でなんか不具合とかも起こるらしいからね

敵に適用するHUDステートマシンの書き方はまぁ付属マニュアルかwikiを参照すればだいたいわかるので、そこらへんはまぁ頭痛を感じながら気合で乗り切ればいい。

FSM - Unofficial EFPSE wiki Extended

HUDIMG $imageName $x $y $scale $path $layer - Exactly the same the "hud image" command. Creates or updates a hud image. Using the same imageName will replace the previous hud image with that name. Using 'HUDIMG imageName' without any other parameters will remove the specified hud image.

イメージネームを決めて、位置とサイズを決めて、使用する画像ファイルのある場所を教えて、レイヤー(多いほど手前)を指定するとHUDが生成される。
$path部分で行う画像ファイルの参照の方法はスクリプトの画像参照方法と同じ…なのだが、wikiとマニュアルにはそれが書いていない。開発者サイドとしてはそんぐらい当たり前だろと言うつもりなのだろうが、まァ微妙に読みにくいマニュアルだ。

基礎部分画像を作る

なんかこれまたマニュアルとかWikiとかにどこにも書いてないが、HUD画像はForeground0.pngという名前でHUDファイルに作っておくと自動的に読み込まれるようになっている。
推奨サイズは1280*720。まぁ色々設定すれば高解像度にもできるが、色々調整がめんどくさいしどうせ解像度変更でガバガバにズレまくるのでやめておこう。

下地部分を作って入れておこう

ベースとして使用する正面顔。この上に画像を重ねて色々表現する

ダミー敵を作る

代理：StG44

ぜんぜん動かないし攻撃もできないダミー敵を顔とまばたきで2人分作る。
こいつが信号を送ってHUDを書き換える役。

そんでもって瞬き担当のface1.statesを作成する。
内容はこう。

(前半は通常敵と共通なので省略)
state CHASE NONE 0
frame 1 1 0 0 0 NONE
frame 1 1 0 0 0 NONE
frame 1 0.25 0 0 0 READY
frame 1 0.05 0 0 0 HUDIMG eye 0 0 1 HUD/half.png 2
frame 1 0.3 0 0 0 HUDIMG eye 0 0 1 HUD/close.png 2
frame 1 0.05 0 0 0 HUDIMG eye 0 0 1 HUD/half.png 2
frame 1 0.1 0 0 0 HUDIMG eye
frame 1 1 0 0 0 READY
(後半も省略)

HUDファイルに入っている半目のhalf.pngと閉じ目のclose.pngを探し出して、レイヤー2に「eye」として挿入したり挿入し直したり「eye」自体を削除したりして瞬きを再現している。

閉じた目とその周囲だけのclose.png。ノーマル顔面の上にこれを被せる

　次に目線担当のface2.statesを作成する。

(省略)
state CHASE NONE 0
frame 1 3 0 0 0 HUDIMG face 0 0 1 HUD/lefteye.png 1
frame 1 3 0 0 0 HUDIMG face
frame 1 3 0 0 0 HUDIMG face 0 0 1 HUD/righteye.png 1
frame 1 3 0 0 0 HUDIMG face
frame 1 0.1 0 0 0 READY
(省略)

今度は瞬きレイヤーよりも下のレイヤー1に「face」というイメージを作成し、そこに左を向いた画像であるLefteye.pngを挿入したり削除したりまた作成して右を向いた画像であるrighteye.pngを挿入したり削除したり…を3秒おきに繰り返している。

目だけ。これをノーマル顔面に被せることで視線移動を表現する。

実行

3秒おきに左右を確認しながら瞬きもするHUD顔が完成した。やはり画面が動くというのはそれだけでインパクトが違う。
一年前にこの機能が欲しかった。