Embed Size (px)
Citation preview
WebVRWebGL Tokyo Meetup #2
自己紹介
面白法人カヤック 技術部／比留間 和也
WebVRって 知ってますか？
そう
Oculus Rift
これが普通のWebサイト で実現できちゃいます
ぶっちゃけ やってることは
ふたつのカメラで 撮影して（視差）
【1】
画面分割して描画
【2】
レンズ補正用に 歪ませる
【3】
たったこれだけ
シェーダがいじれる WebGLならもちろん可能
よく見るやつ
右のを重ねるとちょっと違う
右のを重ねるとちょっと違う
仕組み
レンズ補正
レンズ補正http://game.watch.impress.co.jp/docs/series/vrgaming/20150601_704716.html
要はよく見るこういうやつのすごい版
How can I do it?
Use Three.js
Let’s do it!
// Screen size var SCREEN_WIDTH = window.innerWidth; var SCREEN_HEIGHT = window.innerHeight;
// Create a renderer var renderer = new THREE.WebGLRenderer({antialias: true});
// Create a camera var fov = 75; var near = 0.1; var far = 1000; var aspect = SCREEN_WIDTH / SCREEN_HEIGHT; var camera = new THREE.PerspectiveCamera(fov, aspect, near, far);
// Setting up VR controller and effect var controls = new THREE.VRControls(camera); var effect = new THREE.VREffect(renderer); effect.setSize(SCREEN_WIDTH, SCREEN_HEIGHT);
セットアップはこれだけ
これが
こうなるhttps://www.youtube.com/watch?v=sZvQ_RslvuE&feature=youtu.be
One More Thing
Oculus Rift製品版 2016年初旬 発売
http://www.4gamer.net/games/195/G019528/20150506001/
推奨スペック
http://www.gizmodo.jp/2015/05/oculus_rift10.html
• NVIDIA GTX 970／AMD 290以上
• Corei5-4590以上
• RAM 8GB以上
• HDMI 1.3ビデオ端子対応
• USB 3.0ポート x2
• Windows 7 SP1、またはそれ以上
ちょっとお高い( ;́Д`)
でも少し希望が
http://game.watch.impress.co.jp/docs/series/vrgaming/20150601_704716.html
GameWorks VR
VR用にGPUのドライバレベルで最適化する手法
多少安価なPCでも 動作するかも
製品版Oculus Rift楽しみ！
ご清聴ありがとうございました
