Slide 1

Slide 1 text

WebXRで ポートフォリオを作ろう! 2022-08-03 福岡XR部 @dojineko

Slide 2

Slide 2 text

どじねこ @dojineko GMOペパボ / よろず屋

Slide 3

Slide 3 text

今回お話する内容

Slide 4

Slide 4 text

No content

Slide 5

Slide 5 text

これをやった話です https://xr.dojineko.dev

Slide 6

Slide 6 text

もくじ ➔ なんでXR? ➔ 使ったもの紹介 ➔ 完走した感想

Slide 7

Slide 7 text

なんでXR? ● 普通にWebサイトでポートフォリオを作るとページになる ● 最近は個人的にVR的な活動をしてることが多い ○ せっかくならそういう要素を盛り込みたい! ■ VRChatやClusterもいいけど、 もっと気軽に見れるようにしたい! ● ・・・いっちょやってみっか〜!

Slide 8

Slide 8 text

使ったもの紹介

Slide 9

Slide 9 text

● モデリング: Blender ● フレームワーク: A-Frame ● ブラウザ: Google Chrome (…これだけ!) 使ったもの紹介

Slide 10

Slide 10 text

No content

Slide 11

Slide 11 text

No content

Slide 12

Slide 12 text

簡単な紹介動画をYouTubeにあげてます https://www.youtube.com/watch?v=X7hSph7Uk6c

Slide 13

Slide 13 text

完走した感想

Slide 14

Slide 14 text

完走した感想 ● Blenderをチョットデキル状態だったので作りたいものはすぐ作れた! ● A-Frameは初めてだったけどBlednerからgLTFで出力したモデルを すぐ取り込めて表示できた! ○ 初めてでもすぐにできる手軽さが超魅力! ○ ImageTrackingもできるし、VRモードにもすぐ対応できる! ● 一方で難しい点も ○ ES ModulesなJavaScriptを使っておうとすると苦労する ○ 細かいことをしたいなら Three.js か Babylon.js も手の1つ

Slide 15

Slide 15 text

バーチャルでも表現しよう!

Slide 16

Slide 16 text

No content