DMM.comの、一番深くておもしろいトコロ。

Unityでカメラを動かしてアバターを魅せられる DMM VR Connect #3

Unityでカメラを動かしてアバターを魅せられる DMM VR Connect #3

  • このエントリーをはてなブックマークに追加

DVRCameraを使うとこんな映像が簡単に作れる!

youtu.be

あらゆるVRアプリに好きな姿でダイブできるDMM VR Connect連載 #3

あらゆるVRアプリに好きな姿で飛び込みたい!
そう思ったこと、一度はありますよね?
そんな世界を実現するDMM VR ConnectとそのSDKについて、技術者目線で開発メンバーが全六回の連載でご紹介します。
三回目となる今回は、DMM VR Connect SDK(DVRSDK)の充実したサンプルについて、DVRSDK開発チームのクレウスがご紹介します。

前回はこちら▼ inside.dmm.com

目次

自己紹介

github.com DVRSDK開発チームのクレウスです。

DMM VR labへは2019年4月に、VRChatなどで使えるVR-SNS用の自作オーバーレイアプリ開発をきっかけにお声がけいただいてJoinしました。

これまでBOW MANNo Sushi, No Lifeの開発に携わり、2021年からはSDKチームで開発に携わっています。

DMM VR ConnectはあらゆるVRアプリに好きな姿で飛び込めるサービス

www.youtube.com connect.vrlab.dmm.com

DMM VR Connect SDKでアバターを読み込んだ後、何をする?

前回の連載で、SDKを利用したアバターの読み込みをご紹介しました。

プレイヤーとなるVRMアバターを読み込んだら、例えばゲームでは主人公として、アプリでは自アバターとして使いたいと思います。

左: No Sushi, No Life 右: 筆者のアプリ

今回は一例として、VRゲームで使う場合を想定しましょう。

VRゲームでアバターを使って配信する場合、主観視点をそのまま配信したり、視聴したりすることはあまりないと思います。 アバターを読み込み表示できたら、アバターが見える状態の第三者視点で見てほしいですし、何より、他者の主観視点をそのまま画面で見ていると、ある種の「酔い」が発生します。

ここで、アバターが見える第三者視点カメラが欲しくなってきます。

DMM VR Connect SDKでは様々なサンプルを用意している

DMM VR Connect SDK(以下、DVRSDK)には様々なサンプルが同梱されており、現在は下記の4種類のコンポーネントとサンプルが使用可能です。

今回は、そのコンポーネントの一つであるDVRCameraの使い方を簡単にご紹介します。

【令和最新版】意のままに身体を動かすキャリブレーション - Speaker Deck

  • DVRAuth (Connectの認証)
  • DVRStreaming (Unityから直接RTMP配信)
  • DVRCamera (第三者視点カメラ等)
  • DVRAvatar (VRMの様々な制御)

DVRCameraでカメラの実装を簡単に

youtu.be

基本的にコーディングは必要ありません。 UnityEditorのInspectorとScene上の操作だけで、手軽にカメラを操作することができます。

DVRCameraの使い方

DVRSDK Ver1.5.0 以降、下記の場所に今回の映像を作成したサンプルシーンが同梱されていますが、それぞれがどのような動きをするか、ワンカットずつ掘り下げて説明していきます。

Assets/DVRSDK/Examples/DVRCamera/Scenes

DVRCameraを使うための全体設定と、各シーン(カット)ごとの設定はCameraManagerへ、 カメラの動きに関する設定はDVRCameraへそれぞれ設定します。

CameraManagerはシーン(カット)ごとの設定を、DVRCameraはカメラの動きの設定を行う

下記で簡単に説明をしていきますが、Unity上でサンプルシーンを開きながら見ていくと、どのような動きをするか分かりやすいと思うのでオススメです。

下記の例は、ワイプ以外はDVRCameraへ使いたい機能のコンポーネントを付ける形で設定します。

指定した座標間を移動する(等速)

f:id:kleusbalut:20210427135747g:plain

よく映画で見るようなカメラワークですね。 説明の都合上、「A点からB点間」となっていますが、実はカメラは3点の間で移動しています。

3点の座標を上から見た図

DVRCamera1の"MovingCamera"のTransformsに、カメラが移動してほしい場所を指定すると、TotalTimeで設定した秒数まで等速で移動します。

ワイプする

f:id:kleusbalut:20210427135924g:plain

ワイプの設定は、CameraManagerのSceneList→CameraListで下記のように行うことで実現できます。

CameraListの項目を設定する

メインの画面として使うカメラの設定はそのままにして、ワイプとして使う、2番目のカメラの値を変更します。

この部分は実は、UnityのCameraのViewport Rectと同じです。 画面の比率等にもよるのですが、上記のように設定すれば右上にワイプとして表示されます。

UnityのCameraのViewport Rect設定と同じ

ズームする

f:id:kleusbalut:20210427140004g:plain

DVRCamera5 のPosition/Rotationと、"ZoomingCamera"の設定のみで実現できます。

この設定ではFOV60からFOV25まで4秒かけて変化します(FOVが低い側がズームです)。

(番外編)ゾリーする

f:id:kleusbalut:20210427135240g:plain

これは番外編ですが、上記の「指定した座標間を移動する」と「ズームする」を組み合わせることによって「ゾリ-(ドリーズーム)」を実現できます。

2つのコンポーネントを組み合わせている

ズームしながら対象から等速で離れることによって動的にFOVが変化し、対象人物の表情を印象的に映す手法ですね。

映画「ジョーズ」やヒッチコック監督作品で見る演出です。

Dolly zoom - Wikipedia

まとめ

DVRCameraを使えば、UnityEditorのInspectorとScene上の操作だけで手軽にカメラを操作することができます。 今後も継続してアップデートを行っていく予定です。

このように、DVRSDKを使うとアバターやVRゲーム/アプリ開発に関する様々なことを手軽に実装することができます。

ぜひ皆さんもデベロッパー登録してアプリを作ってみてくださいね。 devs.connect.vrlab.dmm.com

もし実装で困った時は、DMM VR lab公式DiscordサーバーのDMM VR lab Communityで気軽にお問い合わせください! discord.gg