O slideshow foi denunciado.
Utilizamos seu perfil e dados de atividades no LinkedIn para personalizar e exibir anúncios mais relevantes. Altere suas preferências de anúncios quando desejar.

React VR ことはじめ

3.414 visualizações

Publicada em

Okachi.js vol.4で話したReat VRに関する資料です

Publicada em: Tecnologia
  • Dating direct: ❤❤❤ http://bit.ly/2F4cEJi ❤❤❤
       Responder 
    Tem certeza que deseja  Sim  Não
    Insira sua mensagem aqui
  • Follow the link, new dating source: ❶❶❶ http://bit.ly/2F4cEJi ❶❶❶
       Responder 
    Tem certeza que deseja  Sim  Não
    Insira sua mensagem aqui

React VR ことはじめ

  1. 1. React VRことはじめ BUILD VR WEBSITES AND INTERACTIVE 360 EXPERIENCES WITH REACT 2017/4/7 Okachi.js vol.4 第0回
  2. 2. 出演 {:company “Greative.GK” :name “Kazuhiro Hara” :twitter “@kara_d” :interest “SPA, WebVR, Clojure, Design research”}
  3. 3. Clojure / ClojureScript で Electronアプリケーションを 作るためのスタートキット / プラットホーム ● オープンソースにてGitHubにて公開 ● MITライセンス ● 現在のスター数 : 280 http://descjop.org/
  4. 4. 以前したWeb VR関係の資料 ● Re-frame and A-Frame ○ https://www.slideshare.net/karadweb/reframe-and-aframe
  5. 5. 本日のトピック
  6. 6. React VRで遊んでみよう https://facebook.github.io/react-vr/
  7. 7. もくじ 1. React VRとは 2. Carmelについて 3. デモ 4. React VRを成り立たせているテクノロジー
  8. 8. React VRとは
  9. 9. React VR React VR lets you build VR apps using only JavaScript. It uses the same design as React, letting you compose a rich VR world and UI from declarative components.
  10. 10. React VR (意訳)React VRを使用すると、JavaScriptのみを使用してVRアプリケーションを構築できます。 これはReactと同じデザインを使用しており、 宣言的なコンポーネントから豊かなVR世界とUIを構成することができます。
  11. 11. React VRポイント ● JavaScriptのみで書ける ● JSXでUIコンポーネント(3Dオブジェクト)を書ける ● 既存のnpmライブラリと組み合わせてReactアプリケーションのように 作成が可能 ● ビルドのスタイルは特殊 ● サンプルは、Web VR対応ブラウザ or Oculus Rift / GearVRで
  12. 12. Carmel
  13. 13. Carmel https://developer.oculus.com/blog/carmel-developer-preview-launches-today/ Oculusが作成中のブラウザ
  14. 14. GearVRでうごく!!
  15. 15. デモ
  16. 16. React VRのサンプルを起動してみる サンプルをダウンロード 解凍してpreviewディレクトリへ移動し、依存関係を解決 起動して、ブラウザで見よう $ wget https://s3.amazonaws.com/static.oculus.com/reactvr/React_VR _Prerelease.zip $ npm install $ npm start
  17. 17. Carmelで試してみます
  18. 18. React VRを成り立たせている テクノロジー
  19. 19. React VRを成り立たせているテクノロジー ● npm-script ● React ● React VR ● React Native ● Three.js ● OVRUI ● OVR-Audio ● OVR-Video
  20. 20. React VRを成り立たせているテクノロジー こんな構成 https://developer.oculus.com/blog/introducing-the-react-vr-pre-release/
  21. 21. ReactとReact Native ● React VRで作成されたプロジェクトをバンドルするために使っている ○ React JavaScript code is preprocessed before it is run by the browser. This pre-processing is performed by the React Native packager. It is a project similar in scope to Browserify and Webpack, and provides a CommonJS-like module system, JavaScript compilation (ES6, Flow, JSX), bundling, and asset loading.
  22. 22. OVRUI ● Three.jsベースで動くVR用のUIライブラリ ● OculusVR/ovrui ○ An issue-only repo for OVRUI - a set of UI helpers which are built currently built on top of three.js ○ https://github.com/OculusVR/ovrui ■ OVRUI is a user interface library that provides a set of geometry types for Three.js, helping you build UIs in VR. Geometry objects describe text, buttons and other content that can be displayed within a 3D scene. For the pre-release, this is written primarily to support the requirements of React VR, but we’ll be developing this and placing it separately on GitHub so that this library can be used in its own right. More documentation on the direct use of OVRUI will follow.
  23. 23. ovr-audio, ovr-video ● OVR用のビデオ、オーディオ用のパッケージ(?) ○ www.npmjs.com/package/ovr-video ○ www.npmjs.com/package/ovr-audio ● リポジトリはまだ非公開な模様
  24. 24. - END - ありがとうございました 2017/4/7 Okachi.js vol.4

×