【Unity】カメラワークによる演出を考える - 原カバンは鞄のお店ではありません。

ふと思い出す

12月に入ったのに気温が高くて全然冬になった気分にはなりませんが、確か昔、このぐらいの時期にひょんなことから足を骨折したことがあって、病院でギブスを巻き、なれない松葉杖をなんとか使いながら自宅に戻る途中で上司に本日は休みを取る旨の電話をしたら、「はぁ？おまえなぁ、有給ってのは病気したとか大怪我したとか、そういう時に使うものだぞ！」ってな感じで延々と説教された出来事を、バカリズムに似た芥川賞作家センセの「いい加減、国に与えてもらった休日に、みんなで一斉に休むとか止めればいいのに」といった高等遊民的なTweetを目にして思い出した今日この頃、私もいつの日か「ゴールデンウィーク？ｗｗ、みんな好きなときに好きなだけ休めばいいのにー(鼻ほじー）」みたいなことを言える立場になってみたいものです。

減衰・FoV・手振れ

そんな感じで私もナチュラルに上から目線で物を言えるような地位を確立すべくゲーム製作を頑張っている訳ですけれども、アレやコレや試行錯誤していく中で、つい最近では@yoship1639氏の書かれた記事が非常に有用で参考になりました。

qiita.com

ゲーム中のカメラワークについての手法に関する記事なんですが、記事の中で紹介されている「Lerp減衰・FoV変動・PerlinNoise手ブレ」を取り入れると、かなりダイナミックが表現が可能となります。

それぞれの手法については上記の記事で詳しく書かれているのですが、掻い摘んで説明すると

Lerp減衰：カメラとカメラの被写体の動きをピッタリ同時にするのではなく、カメラ側が少し遅れて被写体を追随するような動きをさせる手法。これにより被写体の動きが俊敏かつ大きく見える

FoV変動：カメラの画角(FieldOfView)を変化させて画面をダイナミックに変化させる手法。カメラのProjection(投影方法)がPerspective(透視投影)の場合は特に効果が大きい

PerlinNoise手ブレ：文字通り「手ブレ」を表現する。カメラを揺らすことで被写体が激しく動いているように見える。アクションゲームとかRPGなどではダメージを受けた時の表現にも使われる。

となっています。

FoV変動を取りれよう

一般的なレースゲームではマシンにブースとが掛かったり急加速したりするときに、一瞬大きな引きの画になったりしますが、それはカメラの画角(FieldOfView以下、FoV)をあげている為です。

FoVを上げるとはカメラに写る範囲を広げる、という意味で、一般的に大きく引いた画を撮るときにこのFoV値を上げて画面に表示される範囲を広く取ります。

もちろん、カメラ自体を奥行き方向に移動させて画角を広く取るという手法もありますが、カメラの投影方法がPerspective(透視投影)の場合、このFoV値が大きくなると画面の端に行くほど歪みが大きな画像になり、被写体は引き伸ばされて映し出されます。

逆に中央に行くほど歪みは小さいものになるので、結果、奥行きが強調された画面になります。

通常時の画面

f:id:Karvan:20181204223558p:plain

カメラを奥行き方向に移動させて画角を広く取った場合(FoV値は変えない)

f:id:Karvan:20181204223630p:plain

FoV値を大きくして画角を広く取った場合(カメラの位置は移動しない)

f:id:Karvan:20181204223710p:plain

どちらも引いた画になりますが印象はずいぶん違ってきます。

実装してみた

FoV変動の実装は簡単でCamera.fieldOfViewの値をスクリプトで徐々に変えるだけです。今回はLerpを使って変化させてみます。

Camera.fieldOfView = Mathf.Lerp(Camera.fieldOfView, fov, Time.deltaTime * 2.0f);

第二引数のfovが最終的に変化させたいFoVの値です。
Lerpの第３引数にフレーム間の差分時間であるTime.deltaTimeを使い、目標値へ滑らかに変化するようにしています

上記の処理後に同じようにLerpを使って徐々に変化させながら元のFoV値へ戻します。
これで、一瞬大きく引いた画になったかと思うと、一気に元の画に戻る、という演出が行えます。

public class CameraController : MonoBehaviour 
{
    public float FoVTarget = 145;
    public float DefaultFoV;
    
    void Start () {
        m_Camera = GetComponentInChildren<Camera>();
        DefaultFoV = m_Camera.fieldOfView;
    }
    
    void LateUpdate()
    {
        ZoomControl();
    }

    /// <summary>
    /// ズーム処理
    /// </summary>
    void ZoomControl()
    {
        if (inZoom)
        {
            m_Camera.fieldOfView = Mathf.Lerp(m_Camera.fieldOfView, FoVTarget, Time.deltaTime * 2);
        }
        else
        {
            m_Camera.fieldOfView = Mathf.Lerp(m_Camera.fieldOfView, DefaultFoV, Time.deltaTime * 4);
        }
    }
    
    /// <summary>
    /// FoC変更
    /// </summary>
    void OnFoVChange()
    {
        StartCoroutine(DoZoomEffect(1.2f));
    }


    /// <summary>
    /// ズームエフェクト
    /// </summary>
    /// <returns></returns>
    IEnumerator DoZoomEffect(float duration)
    {
        inZoom = true;
        yield return new WaitForSeconds(duration);
        inZoom = false;
    }
}