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

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

Avatar for dojineko dojineko
August 03, 2022
Technology
220
0

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

Avatar for dojineko

dojineko

August 03, 2022

More Decks by dojineko

See All by dojineko
コスパの良いAIの選び方 / Surviving the AI Era on a Budget
Avatar for dojineko dojineko
0
34
ミニPCを買ってみた話/The Story of Buying a Mini PC
Avatar for dojineko dojineko
0
41
WebXRのいま(2025Q1) / About WebXR (2025Q1)
Avatar for dojineko dojineko
0
740
iOSのWebViewとClipboardAPI / WebView and ClipboardAPI on iOS
Avatar for dojineko dojineko
0
150
最近のUnityとVRChat / About Unity and VRChat recently
Avatar for dojineko dojineko
0
210
ペパボ ホスティング事業部のWebフロントエンドについて 2022 / About Web Frontend of Pepabo Hosting division 2022
Avatar for dojineko dojineko
1
10k
Viteはいいぞ/Vite is Good
Avatar for dojineko dojineko
1
820
はじめてでもできた！VR登壇への道 / Let's VR speech!
Avatar for dojineko dojineko
0
490
gRPC-WEBを使ったWEBアプリ開発/Development web-app with gRPC-WEB
Avatar for dojineko dojineko
1
1.1k

Other Decks in Technology

See All in Technology
Disciplined Vibes: Scaling AI-Assisted Engineering
Avatar for Sheharyar Naseer sheharyar
0
140
就職⽀援サービスにおけるキャリアアドバイザーのシフトスケジューリング
Avatar for Recruit recruitengineers
PRO
1
150
NAB Show 2026 動画技術関連レポート / NAB Show 2026 Report
Avatar for CyberAgent cyberagentdevelopers
PRO
0
200
2026 TECHFRESH 畢業分享會 - 開發日常大解密！從領域驅動到企業級上線
Avatar for LINE Developers Taiwan line_developers_tw
PRO
0
1k
Oracle AI Database@Google Cloud：サービス概要のご紹介
Avatar for oracle4engineer oracle4engineer
PRO
6
1.5k
あなたの知らないPDFのアクセシビリティ
Avatar for LINEヤフーTech (LY Corporation Tech) lycorptech_jp
PRO
0
190
SONiC Scale-Up Working Group から探る Scale-UpやUltraEthernet機能の実装方法
Avatar for ebiken ebiken
PRO
2
340
"何を作るか"を任される エンジニアは、どう育つのか
Avatar for ofuji-works yutaokafuji
1
680
自宅LLMの話
Avatar for Kazuto Kusama jacopen
1
580
Snowflakeと仲良くなる第一歩
Avatar for あべ coco_se
4
470
2026TECHFRESH畢業分享會 - Lightning Talk - 打造精準高效的 MCP 設計模式與測試實務
Avatar for LINE Developers Taiwan line_developers_tw
PRO
0
1k
自律型AIエージェントは何を破壊するのか
Avatar for kojira kojira
0
160

Featured

See All Featured
Design and Strategy: How to Deal with People Who Don’t "Get" Design
Avatar for Morgane Peng morganepeng
133
19k
AI Search: Implications for SEO and How to Move Forward - #ShenzhenSEOConference
Avatar for Aleyda Solis aleyda
1
1.3k
New Earth Scene 8
Avatar for Sydney Stone popppiees
3
2.3k
Designing for Timeless Needs
Avatar for Cassini Nazir cassininazir
1
250
How to optimise 3,500 product descriptions for ecommerce in one day using ChatGPT
Avatar for Katarina Dahlin katarinadahlin
PRO
1
3.6k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
Avatar for Dan Newman danielanewman
230
23k
Agile that works and the tools we love
Avatar for Rasmus Luckow-Nielsen rasmusluckow
331
21k
WCS-LA-2024
Avatar for Leonardo Collado-Torres lcolladotor
0
630
Context Engineering - Making Every Token Count
Avatar for Addy Osmani addyosmani
9
960
AI: The stuff that nobody shows you
Avatar for John Nunemaker jnunemaker
PRO
8
710
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
Avatar for mongodb mongodb
49
10k
What's in a price? How to price your products and services
Avatar for Michael Herold michaelherold
247
13k

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