どうもこんにちは、Lineaです。
まともなゲーム制作記事は久々です。

例のACっぽいゲームもといARMEDCOREは冬コミで50(+α)部完売致しました。
売り切れ後にも声をかけていただき現地でCD焼くことになるとは思わなかったですが、それだけ多くの人に買って頂いて圧倒的感謝です。

現在は次回作に向けてUE4を勉強中です。1月くらいからチマチマと弄っています。
次回作はゼログラビティなFPSの予定です。

さて、FPSのシステムを作っていてぶつかったのが ドットサイトのレティクルの処理です。
ドットサイトとは最近のFPSではおなじみな銃につける照準器です。
2015y03m19d_005919176

ドットサイトはハーフミラーを用いて、照準(レティクル)が遠方の目標に投影されているように映ることが特徴です。
Reflector_reflex_sight_howard_grubb_1901
(出典:Wikipedia 照準器)
この遠方に投影されたように見せるというのが曲者です。
サイトを覗きこむ角度によらず常に銃身の直線上にレティクルが表示されなければいけません。

これをUE4で実装しようと思ったのですがWebでは「ドットサイトできたZE~HAHAHA!!」みたいに完成したもの自慢している外人がいるだけで解説が殆ど無かったので書いておこうと思います。
FPS作る人の参考になればいいかな~
ホログラムで投影する表現全般にも使えるのでSFっぽいことするなら色々応用が効くと思います。

というわけでUE4で作ったドットサイト用マテリアルは以下のとおりです
sightnode


今回、作る上で重要なのが「パララックスマッピング」です。
これは本来モデルに凹凸を見せるために用いられるテクスチャマッピング手法の一つです。
視線に応じてテクスチャのUV座標をずらすことで遠近感の錯覚を生みます。
今回は、ノーマルマップ等に比べてより大きい凹凸を表現できる特徴を活かして、凹みの量を10~100メートル先と非常に大きくとることで遠くに投影されてる感を出します。

UE4でパララックスマッピングを使うには「BumpOffsetノード」を使います。
heightに適当な投影先の距離を入れることで距離分凹んだUV座標を返してくれます。
ReferencePlaneは0にしておくと良いでしょう。

BumpOffsetで凹ませると遠近法により、表示されるテクスチャは非常に小さくなってしまいます。
そこで、「ScaleByCenterノード」で凹ませた距離*レティクルの比率倍に拡大します。

このまま表示するとテクスチャはタイリングされてしまい、テクスチャをメッシュにタイル状に敷き詰めて貼られます。
2015y03m19d_025930981
上の画像みたいに非常に気持ち悪いです。

これを防ぐために「TextureCropingノード」を使います。
これは、入力されたテクスチャを指定範囲でトリミングし、指定されたUV座標上に配置した上で、新しいテクスチャを作成します。
更に、このノードの「CroppedMasked」出力はトリミングしたテクスチャ以外の領域を塗りつぶしたテクスチャを作成します。
そのため、タイリングされる部分がマスクで塗りつぶされるので、中央に一つだけレティクルのテクスチャが表示されるようになります。

あとはRGB成分をエミッシブ出力に、アルファ成分をオパシティ(透明度)出力に入れれば完成です。
エミッシブに入力する値に適当な数値をかけて値を大きくしておくと発光するようになるので、よりそれらしく見えます。

完成したマテリアルを板メッシュに貼ったのが以下のものです。
 

ちゃんと視点によらず銃身の先に投影されてますね。
原理が分かれば意外と簡単ですが、シェーダーとか書いたこと無いので3日ほどかかりました。
苦労して作ったので完成時は感動モノでした。
この記事も感動のあまり書いてます。

UE4の基本的な紹介、解説もそのうち記事にしたいところです。
それでは。