SlideShare a Scribd company logo
1 of 44
プログラミング不要!!
VRコンテンツ作成入門
いつかはVRやってみたい
VRって難しそう
VRって大変そう
VRってお金かかりそう
VRって難しそう
VRって大変そう
VRってお金かかりそう
めっちゃ簡単です
本日の内容
● 簡単!モバイルVR
● できる!360°映像
VRの種類
HTC VIVE Oculus Rift
Windows MR
immersive headset
GearVR
Daydream
ハコスコ
Cardboard
ゲーミングPC(10万円~)
+本体(5万円~)
高性能スマホ
+本体(1万円)
スマホ
+本体(1000円~)
VRの種類
HTC VIVE Oculus Rift
Windows MR
immersive headset
GearVR
Daydream
ハコスコ
Cardboard
ゲーミングPC(10万円~)
+本体(5万円~)
高性能スマホ
+本体(1万円)
スマホ
+本体(1000円~)
今回のターゲット
Cardboard VRの特徴
● ケースにスマホをセットするだけ
● 入力は無い → 見るだけ
○ 画面タッチを検知するケースが売ってる
● 回転は取れるが、上下左右移動は取れない
× 覗き込む・回り込むOK NG
© UTJ/UCL
作ってみよう
Unityを使ってモバイルVRコンテンツを作ってみる
手順
1. カメラの配置
2. Player Settingsの設定
3. ビルド
カメラの配置
シーン上にカメラとキューブを配置
カメラの配置
● VRで見たい場所にカメラを置く
● 置いた場所が頭の位置
● VRではユーザがカメラ方向を決める
→カメラの方向を制作者が決められない
→カットシーンは工夫しないと難しい
● カメラを移動させるのは基本NG
→工夫しないと酔う
VRでカメラを移動させたい場合
● 移動の前後にフェードを挟む
● 前にだけ進む
● 乗り物に乗っているように見せる
Player Settings
Player Settingsを開いて
XR SettingsのVirtual Reality Supportedに
チェック
SDKsには「Cardboard」
Player Settings
Unityバージョンによって設定の場所が違う
Unity2017.2以降 それ以前
XRって?
VR/AR/MRの総称
 VR = Virtual Reality = 仮想現実
 AR = Argumented Reality = 拡張現実
 MR = Mixed Reality = 複合現実
MR映像
ARアプリ
VRアプリ
(Dig 4 Destruction)
© UTJ/UCL
ビルド
Switch PlatformでAndroidに切り替える
ビルド
Android/iOSのビルド環境が必要
詳しくはUnityドキュメント参照
Android SDK/NDK セットアップ
https://docs.unity3d.com/ja/current/Manual/android-sdksetup.html
iOS 開発を始める
https://docs.unity3d.com/ja/current/Manual/iphone-GettingStarted.html
UnityでモバイルVR
完成
制作事例
2016年日テレ夏イベント
HTC Viveを使った体験コンテンツを出展
スマホでもVRを体験できるようにした
※当時は13歳未満に両眼VRをさせることは危険と考えられていた
 子供に渡すために単眼VRコンテンツを作成した
PC版↑
モバイル版↓
本日の内容
● 簡単!モバイルVR
● できる!360°映像
360°映像とは
空間を撮影した映像
⇔ 普通のビデオ:空間を2次元に射影
特殊な機材で撮影する
VRと相性がいい
スマホのYoutubeアプリを使えば
Youtubeの360°映像を見ることができる
制作事例
VRゲーム「TITAN SLAYER」リリース時にプロモーションとして作成
360chに映像の配信を依頼
制作期間 1週間
https://www.360ch.tv/videoview/377
Unityで作る場合
● facebook 360-Capture-SDK
○ 音声録音可能
○ 動画ファイル書き出し可能
○ 音ずれが発生することも
○ Windowsのみ
● 360 Panorama Capture
○ 音声録音不可能
○ 連番ファイル出力
○ Macでも使えるはず
facebook 360 Capture SDK
https://github.com/facebook/360-Capture-SDK
インストール
ZIPを解凍したら
Samples/Unity/Assets内の
「EncodePackage」
「Plugins」
をプロジェクトにコピー
カメラの配置
EncoderPackegeのEncodeObjectプレファブを撮影したい位置に置く
カメラの設定
EncoderObjectについているCapture Optionスクリプト
「Do Surround Capture」にチェックを入れる
Unityを実行して
F1 スクリーンショット
F2 録画開始
F3 録画終了
撮影後
プロジェクトフォルダの「Gallery」フォルダに動画ファイルが入っている
360 Panorama Capture
https://www.assetstore.unity3d.com/jp/#!/content/38755
セットアップ
アセットをプロジェクトに入れたら
カメラに「Capture Panorama」を
Add Component
カメラの設定
1. プロジェクトにインポートし、カメラに「CapturePanorama」スクリプトをアタッチする
2. パラメータを設定する
a. Capture Every Frameにチェック
b. Image FormatをBMPに
c. Panorama Widthを4096 or 3840に
d. "Ssaa Factor" を 2~4に
e. Save Image Pathに出力先を設定
3. ゲームを実行し、「Pキー」でキャプチャ開始・終了
4. 連番画像ファイルが出力される
連番が出力される
エンコード
1. ffmpegを入手する。Windowsの場合http://hp.vector.co.jp/authors/VA020429/ffmpeg/ffmpeg.htmlから手に入れる
2. ffmpegをインストールし、pathを通しておく
3. CapturePanoramaのフォルダ内にある、assemble.cmdをキャプチャした画像があるフォルダに置く
4. 以下のコマンドを実行
assemble キャプチャ画像 フォーマット 出力ファイル名 フレームレート クオリティ ultrafast
5. コマンド例
assemble Test_2015-07-24_06-42-00-045_ bmp test.mp4 60 18 ultrafast
※うまくいかない場合、assemble.cmdをffmpeg.exe -framerate %4 -i %1%%06d.%2 -an -c:v libx264 -r %4 -pix_fmt yuv420p -preset %6 -crf %5 %3に書き
換える
6. 全天球動画が出力される
編集
音がないのでSE/BGMを手動で入れていく
4K動画編集になるので、ある程度いいソフトじゃないとできないかも・・・
メタ情報の埋め込み
Youtube,Facebook,Workplaceに360°動画として認識させるには
動画にメタ情報を埋め込む必要がある
1. アプリをダウンロードhttps://support.google.com/youtube/answer/6178631?hl=ja
2. Openで動画を開き、Sphericalにチェックを入れる
3. Save asでファイルを書き出す
4. 書き出したファイルをアップロードする
5. しばらくすると360度動画として認識される
完成
Workplaceに貼ったり Youtubeに投稿したりできる
まとめ
● VRコンテンツは簡単に作れる
● 高価な機器がなくても作れる
さあ作ろうVR
おすすめスタンプ
ご清聴ありがとうございました
付録
Google VR SDK
CardboardやDaydreamコンテンツを作る際に便利なSDK
Prefabが用意されており、様々な機能を使えるようになる
https://github.com/googlevr/gvr-unity-sdk/releases
注意すべきエフェクト
全天球動画は上下左右前後の6個のカメラ
で撮影している
ビルボードのエフェクトがあるとそれぞれの
カメラに対して正面を向いてしまう
結果、結合したときにエフェクトの切れ目が
見えてしまう
対策
・ビルボードを使わない
・正面のカメラだけに映るように調整
切れ目が見えてる

More Related Content

Similar to プログラミング不要!!VRコンテンツ作成入門

SXSW報告会 福田さん
SXSW報告会 福田さんSXSW報告会 福田さん
SXSW報告会 福田さんVentures Salon
 
VRM-VCIが広げるVR世界間ポータビリティ
VRM-VCIが広げるVR世界間ポータビリティVRM-VCIが広げるVR世界間ポータビリティ
VRM-VCIが広げるVR世界間ポータビリティVirtualCast, Inc.
 
360度全天球でVR表示&ちょこっとAR
360度全天球でVR表示&ちょこっとAR360度全天球でVR表示&ちょこっとAR
360度全天球でVR表示&ちょこっとARfujita noriko
 
モバイルVR「Daydream」について
モバイルVR「Daydream」についてモバイルVR「Daydream」について
モバイルVR「Daydream」についてSatoshi Noda
 
CEDEC2014 自作3D VRゴーグル"FakeRift"ではじめるアプリケーション開発
CEDEC2014 自作3D VRゴーグル"FakeRift"ではじめるアプリケーション開発CEDEC2014 自作3D VRゴーグル"FakeRift"ではじめるアプリケーション開発
CEDEC2014 自作3D VRゴーグル"FakeRift"ではじめるアプリケーション開発kinneko
 
20171110 dev festa_vr
20171110 dev festa_vr20171110 dev festa_vr
20171110 dev festa_vrHideki Ojima
 
Google vrからはじめるdaydreamへの道
Google vrからはじめるdaydreamへの道Google vrからはじめるdaydreamへの道
Google vrからはじめるdaydreamへの道shimada tatsuya
 
ウェアラブルVRの現状と未来
ウェアラブルVRの現状と未来ウェアラブルVRの現状と未来
ウェアラブルVRの現状と未来Naoji Taniguchi
 
XR Kaigi 2020 / “VRの世界で生きていく” ための基盤技術
XR Kaigi 2020 / “VRの世界で生きていく” ための基盤技術XR Kaigi 2020 / “VRの世界で生きていく” ための基盤技術
XR Kaigi 2020 / “VRの世界で生きていく” ための基盤技術VirtualCast, Inc.
 

Similar to プログラミング不要!!VRコンテンツ作成入門 (9)

SXSW報告会 福田さん
SXSW報告会 福田さんSXSW報告会 福田さん
SXSW報告会 福田さん
 
VRM-VCIが広げるVR世界間ポータビリティ
VRM-VCIが広げるVR世界間ポータビリティVRM-VCIが広げるVR世界間ポータビリティ
VRM-VCIが広げるVR世界間ポータビリティ
 
360度全天球でVR表示&ちょこっとAR
360度全天球でVR表示&ちょこっとAR360度全天球でVR表示&ちょこっとAR
360度全天球でVR表示&ちょこっとAR
 
モバイルVR「Daydream」について
モバイルVR「Daydream」についてモバイルVR「Daydream」について
モバイルVR「Daydream」について
 
CEDEC2014 自作3D VRゴーグル"FakeRift"ではじめるアプリケーション開発
CEDEC2014 自作3D VRゴーグル"FakeRift"ではじめるアプリケーション開発CEDEC2014 自作3D VRゴーグル"FakeRift"ではじめるアプリケーション開発
CEDEC2014 自作3D VRゴーグル"FakeRift"ではじめるアプリケーション開発
 
20171110 dev festa_vr
20171110 dev festa_vr20171110 dev festa_vr
20171110 dev festa_vr
 
Google vrからはじめるdaydreamへの道
Google vrからはじめるdaydreamへの道Google vrからはじめるdaydreamへの道
Google vrからはじめるdaydreamへの道
 
ウェアラブルVRの現状と未来
ウェアラブルVRの現状と未来ウェアラブルVRの現状と未来
ウェアラブルVRの現状と未来
 
XR Kaigi 2020 / “VRの世界で生きていく” ための基盤技術
XR Kaigi 2020 / “VRの世界で生きていく” ための基盤技術XR Kaigi 2020 / “VRの世界で生きていく” ための基盤技術
XR Kaigi 2020 / “VRの世界で生きていく” ための基盤技術
 

プログラミング不要!!VRコンテンツ作成入門