Upgrade to Pro — share decks privately, control downloads, hide ads and more …

WebXRでポートフォリオを作ろう/Let's make your portfolio with WebXR!

dojineko
August 03, 2022
Technology
0
42

WebXRでポートフォリオを作ろう/Let's make your portfolio with WebXR!

dojineko

August 03, 2022
Tweet

More Decks by dojineko

See All by dojineko
Viteはいいぞ/Vite is Good
dojineko
1
250
はじめてでもできた！VR登壇への道 / Let's VR speech!
dojineko
0
150
gRPC-WEBを使ったWEBアプリ開発/Development web-app with gRPC-WEB
dojineko
1
180
もう俺には関係なくないTypeScript/Our TypeScript
dojineko
3
140
TypeScript ではじめる Clean Architecture / Let's start Clean Architecture with TypeScript
dojineko
2
2k
Hosting meets .NET / hosting-meets-dotnet
dojineko
0
370
TypeScript と ORM / ORM with TypeScript
dojineko
0
590
コワクナイヨ TypeScript - static typing reloaded -
dojineko
8
2.2k
TypeScript - road to static (typing) ojisan -
dojineko
4
1.2k

Other Decks in Technology

See All in Technology
SNS連動型_サイネージ運用.pdf
bau
0
160
OpenTelemetryを用いたObservability基盤の実装 with AWS Distro for OpenTelemetry
k6s4i53rx
2
260
開発からアプリストアまで一気に自動化！モバイルアプリのCI/CD徹底解説
ismt7
2
160
Using Change Data Capture for Stack Modernization
kamorisan
0
1.6k
PHPカンファレンス2022 東京 登壇資料 (スポンサーLT)
sdx_
0
130
e-RT3 PlusでRclexをいごかしてみる
takasehideki
1
470
マトリクス型組織の導入後の変化を定量的に捉える
hagevvashi
0
240
開発支援のための組織体制 〜ゆめみの情報共有と成長環境〜 / abceed Tech Night yumemi
usamik26
0
210
カンムにおけるプロダクトセキュリティのこれまでとこれから
summerwind
1
270
「いちユーザーがPHPに新機能を追加するまで/PHPConference 2022」
colopl
0
560
Practices of an Engineering Manager: Working in The Read World
koic
6
1.1k
一休. com/Yahoo!トラベルのNuxt3移行における開発プロセス
sugitat
4
2.5k

Featured

See All Featured
Designing Dashboards & Data Visualisations in Web Apps
destraynor
223
49k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
42
13k
Learning to Love Humans: Emotional Interface Design
aarron
261
37k
Navigating Team Friction
lara
175
11k
Embracing the Ebb and Flow
colly
73
3.4k
Designing with Data
zakiwarfel
91
4k
A Modern Web Designer's Workflow
chriscoyier
690
180k
Testing 201, or: Great Expectations
jmmastey
23
5.5k
How STYLIGHT went responsive
nonsquared
85
4k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
6
630
What's new in Ruby 2.0
geeforr
335
30k
Producing Creativity
orderedlist
PRO
334
37k

Transcript

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

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

  3. 今回お話する内容

  4. None

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

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

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

    • ・・・いっちょやってみっか〜！

  8. 使ったもの紹介

  9. • モデリング: Blender • フレームワーク: A-Frame • ブラウザ: Google Chrome

    (…これだけ！) 使ったもの紹介
  10. None
  11. None

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

  13. 完走した感想

  14. 完走した感想 • Blenderをﾁｮｯﾄﾃﾞｷﾙ状態だったので作りたいものはすぐ作れた！ • A-Frameは初めてだったけどBlednerからgLTFで出力したモデルを すぐ取り込めて表示できた！ ◦ 初めてでもすぐにできる手軽さが超魅力！ ◦ ImageTrackingもできるし、VRモードにもすぐ対応できる！

    • 一方で難しい点も ◦ ES ModulesなJavaScriptを使っておうとすると苦労する ◦ 細かいことをしたいなら Three.js か Babylon.js も手の１つ

  15. バーチャルでも表現しよう！

  16. None