Unity を検索

Cinemachine を 2D で使用する ― ヒントとテクニック

2018年7月17日 カテゴリ: Engine & platform | 8 分 で読めます
取り上げているトピック
シェア

Is this article helpful for you?

Thank you for your feedback!

2D ゲームの制作に昔ながらのカメラシステムを使用し続けている皆様、2D で Cinemachine が使用できたら、と思うことはありませんか?実は、あまり知られていませんが、これはすでに可能なのです!本記事では、Cinemachine を最大活用するためのヒントや、このツールがどのように 2D ゲームの開発に役立ち、開発のスピードを大幅にアップさせるかをご紹介します。Cinemachine Virtual Camera や Cinemachine Confiner その他の 2D ゲームへの活用法を知りたい方は、ぜひ以下を読み進めてください。

Cinemachine を入手する

バージョン 2018.1.0b7 以降の Unity をお使いであれば、Unity 上でパッケージマネージャーを使って Cinemachine を入手できます。

Cinemachine を入手するには、メニューを Window > Package Manager > All の順に選択し、「Cinemachine」を選択してください。

パッケージマネージャーからのインポート

2D 用カメラの作成

Cinemachine を使用すると、2D 環境用のカメラシステムの作成が比較的簡単に行えます。2D 用 Virtual Camera の作成方法は以下の通りです。

  1. 2D Virtual Camera を作成するには、メニューバーから Cinemachine > Create 2D Camera の順に選択します。これにより Virtual Camera が 2D 環境用に設定されます。これがシーン内の最初の Virtual Camera である場合は、メインカメラに Cinemachine Brain コンポーネントも追加されます。
  2. ヒエラルキーからプレイヤーを Follow のターゲットにドラッグしてください。
  3. 「LookAt」のターゲット内には何もないことを確認してください。「LookAt」のターゲット内に何かがある場合は、それを選択し、バックスペースキーまたは削除キーを押して参照を削除してください。
  4. Orthographic Size と Body の設定を必要に応じて調整してください。

2D Virtual Camera と 3D Virtual Camera の最も分かりやすい違いは、2D Virtual Camera では Framing Transposer が使われていることです。この特殊な Transposer はカメラの X-Y 平面上でターゲットをフォローし、カメラの回転を止めます。Framing Transposer が正常に機能するためには Virtual Camera の「LookAt」のターゲットが null になっている必要があります。また、2D ゲームは Orthographic(垂直投影)ビューを使用するため、Virtual Camera の初回作成時にはシーンの Cinemachine Brain Camera の投影方法を「Orthographic」に変更する必要があります。

Cinemachine では、ひとつのカメラにすべてを行わせようとしないことが重要です。そうではなく、シーンの周囲に複数の Virtual Camera を設置して Cinemachine Brain を使用してそれら同士をブレンドします。このブレンドは、プレイヤーの体力が低くなっている時やプレイヤーが特定の領域に入った時など、カメラのフレーミングやポストプロセッシングに変更が必要になる各種状況が発生した時に起こります。Cinemachine Brain のブレンド設定は希望のビジュアルになるように調整することができます。

下の動画のように、再生モードで Virtual Camera の調整を行うことができます。

このコンテンツはサードパーティのプロバイダーによってホストされており、Targeting Cookiesを使用することに同意しない限り動画の視聴が許可されません。これらのプロバイダーの動画の視聴を希望する場合は、Targeting Cookiesのクッキーの設定をオンにしてください。

(ヒント)カメラの設定は再生モード中に変更可能です。Virtual Camera の「Save During Play」チェックボックスがオンになっていれば、変更が保存されます。

カメラの移動範囲の限定

Cinemachine のもうひとつの便利な機能は、バウンダリーボックスを使用して Virtual Camera の移動範囲を特定の領域内に限定できるというものです。これは Virtual Camera の拡張機能セクションから利用可能です。このエフェクトの作成手順は以下の通りです。

  1. ステージ用のバウンダリーボックスを設定します。これによってステージのカメラの移動範囲が限定されます。これは以下の手順で行います。
    • 空のゲームオブジェクトを作成する
    • ゲームオブジェクトに CompositeCollider2D を追加する
    • CompositeCollider2D の「Geometry Type」を「Polygons」に設定する
    • ゲームオブジェクトの Rigidbody を Static に設定する
    • ゲームオブジェクトに BoxCollider2D を追加する
    • BoxCollider2D をステージに合うように調整する
    • BoxCollider2D を「Used by Composite」に設定する
  2. Virtual Camera に Confiner Extension を追加してください。
  3. 上記で作成したバウンダリーボックスを Bounding Shape 2D Box にドラッグしてください。
  4. カメラの移動範囲を画面の範囲内に制限するかどうか設定してください。これは「Confine Screen Edges」チェックボックスで行います。
  5. 最後に、Confiner にダンピングを付けるかどうか設定します。Damper によって、範囲を制限するコライダーの端とカメラが滑らかに重なり合うようになります。このエフェクトを使用したくない場合は、Damping Time を 0 に設定してください。

結果は以下のようになります。

このコンテンツはサードパーティのプロバイダーによってホストされており、Targeting Cookiesを使用することに同意しない限り動画の視聴が許可されません。これらのプロバイダーの動画の視聴を希望する場合は、Targeting Cookiesのクッキーの設定をオンにしてください。

(ヒント)「Confine Screen Edges」チェックボックスをオンにする場合は、バウンダリーボックスは Virtual Camera の Orthographic Size よりも大きくなければなりません。バウンダリーボックスが画面より小さいと、 Confiner は正常に領域内で機能しません。

サンプル動画

このコンテンツはサードパーティのプロバイダーによってホストされており、Targeting Cookiesを使用することに同意しない限り動画の視聴が許可されません。これらのプロバイダーの動画の視聴を希望する場合は、Targeting Cookiesのクッキーの設定をオンにしてください。

グループカメラ

グループカメラ(Group Camera)も、2D で便利に使用できる Cinemachine 機能のひとつです。この機能では、カメラが映すターゲット(対象)のグループを作成できます。グループカメラは、重要なものを映すカットシーンを作成したい場合や、2 つ以上のオブジェクトを各フレームに維持したい場合や、2D でローカルのマルチプレイヤーゲームを作成したい場合に便利です。

これは Cinemachine 内で以下の手順で行います。

  1. 2D Virtual Camera を新規作成する
  2. シーン内にゲームオブジェクトを新規作成する
  3. Add Component > Cinemachine > Cinemachine Target Group の順に選択します。
  4. 焦点を合わせたいゲームオブジェクトを Target Group に追加する
  5. Target Group をインスペクターの Virtual Camera の「Follow」のターゲットにドラッグする
  6. Orthographic Size の最小値と最大値を調整する(これは、カメラ用語で言う「ズーム」の調整に当たります。)
  7. Group Framing のタイプを指定します。「Horizontal」を選択するとカメラのフレーミング時にフレームの水平方向の寸法のみが考慮され、「Vertical」を選択するとフレームの垂直方向の寸法のみが考慮されます。「Horizontal and Vertical」では両方の寸法が考慮されます。

「Target Group」は Cinemachine のコンポーネントで、同じ Virtual Camera の複数のターゲットを表示できるようにするものです。カメラのサイズを調整して、ウェイトに応じてターゲットが表示されるようにします。例えば、すべてのターゲットのウェイトが 1 である場合、すべてのターゲットが表示されます。

下の映像は、プレイヤーと宝箱に焦点を合わせたグループカメラの例です。

(ヒント)Group Virtual Camera がアクティブな状態でグループメンバーの追加や削除を行う場合は、そのメンバーのウェイトをゼロに(およびゼロから)Lerp します。これにより、カメラの再フレーミングが滑らかに行われます。

Impulse を利用したカメラシェイク

Cinemachine V2.2 には、Impulse の Extension が新しく追加されています。この拡張機能は、ユーザーがカメラシェイクエフェクトをコード記述なしで作成できるようにするものです。Impulse の Extension は拡張機能として Virtual Camera に追加できます。これをシーンに追加する手順は以下の通りです。

  1. Cinemachine メニューオプションを使って 2D Virtual Camera を作成し、ターゲットに追従するように設定します。
  2. Add Extension > Cinemachine Impulse Listener の順にクリックします。
  3. Impulse Listener の「Use 2D Distance」チェックボックスをオンにしてください。
  4. Channel Mask ではリッスンしたい Impulse をフィルターできます。この例ではデフォルトチャンネルを使用します。
  5. Impulse の送信元のゲームオブジェクトを選択します。この例では弾むボールを使用します。ボールは床に当たるたびに Impulse 信号をデフォルトチャンネルに送信し、Impulse Listener がそれを受信します。
  6. 「Add Component」をクリックし、「Cinemachine Collision Impulse Source」を検索してください。
  7. 「Signal Shape」項目の Raw Signal 変数に割り当てる信号を選択します。これは「NoiseSettings」プロファイルです。デフォルトのものを使用しても、独自に作成しても構いません。
    • 歯車アイコンをクリックして新しい NoiseSettings プロファイルを作成し、「New Noise Setting」を選択します。これをプロジェクトに保存してください。
    • ノイズが位置と角度の両方に影響を及ぼすようにするか、片方だけに影響を及ぼすようにするか選択できます。今回は 2D ゲームなので X および Y の位置と Z の角度に影響を及ぼすようにします。Noize Profile を上手く設定すると予測不可能で良質なノイズが作れます。ノイズに関しては、唯一目指すべきは自然界に見られるランダム性の再現です。これはディテールの異なる複数のレイヤーを使って行えます。
  8. 必要に応じて、Noize Profile の適用される Frequency と Amplitude にゲインを追加することもできます。
  9. 「Spatial Range」項目の Dissipation Distance を調整します。これは Impulse が検知される範囲の限界を設定するものです。ここでは 25 に設定します。

必要であれば Dissipation Mode を調整して減衰の種類を変更することも可能です。他にも調整可能な設定はありますが、今回はこれだけで事足ります。

結果は以下のようになります。

以上、本記事では、下記を行う方法をご紹介しました。

  • Cinemachine をパッケージマネージャー経由で入手する
  • 2D Virtual Camera を作成する
  • Virtual Camera の移動範囲を特定の 2D 領域内に制限する
  • 複数のターゲットに追従するように Virtual Camera の設定を行う
  • カメラシェイクを追加するように Impulse Module を設定する

以上、本記事をお楽しみいただけたなら嬉しく思います。これで皆様も、次の 2D プロジェクトでは Cinemachine を使用していただけるでしょう。最新の Cinemachine 情報を入手されたい方は、ぜひフォーラムにご参加ください!

2018年7月17日 カテゴリ: Engine & platform | 8 分 で読めます

Is this article helpful for you?

Thank you for your feedback!

取り上げているトピック
関連する投稿