$30 off During Our Annual Pro Sale. View Details »

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

Avatar for dojineko dojineko
August 03, 2022
Technology
0
190

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

Avatar for dojineko

dojineko

August 03, 2022
Tweet

More Decks by dojineko

See All by dojineko
2025-03-12 WebXRのいま(2025Q1) / About WebXR (2025Q1)
Avatar for dojineko dojineko
0
610
iOSのWebViewとClipboardAPI / WebView and ClipboardAPI on iOS
Avatar for dojineko dojineko
0
97
最近のUnityとVRChat / About Unity and VRChat recently
Avatar for dojineko dojineko
0
180
ペパボ ホスティング事業部のWebフロントエンドについて 2022 / About Web Frontend of Pepabo Hosting division 2022
Avatar for dojineko dojineko
1
9.8k
Viteはいいぞ/Vite is Good
Avatar for dojineko dojineko
1
780
はじめてでもできた！VR登壇への道 / Let's VR speech!
Avatar for dojineko dojineko
0
460
gRPC-WEBを使ったWEBアプリ開発/Development web-app with gRPC-WEB
Avatar for dojineko dojineko
1
1k
もう俺には関係なくないTypeScript/Our TypeScript
Avatar for dojineko dojineko
3
380
TypeScript ではじめる Clean Architecture / Let's start Clean Architecture with TypeScript
Avatar for dojineko dojineko
2
3.4k

Other Decks in Technology

See All in Technology
Bedrock AgentCore Memoryの新機能 (Episode) を試してみた / try Bedrock AgentCore Memory Episodic functionarity
Avatar for hoshi7_n hoshi7_n
2
1.8k
松尾研LLM講座2025 応用編Day3「軽量化」 講義資料
Avatar for Aratako aratako
3
2.7k
Lookerで実現するセキュアな外部データ提供
Avatar for ZOZO Developers zozotech
PRO
0
200
なぜ あなたはそんなに re:Invent に行くのか？
Avatar for Kazuki Miura miu_crescent
PRO
0
200
Connection-based OAuthから学ぶOAuth for AI Agents
Avatar for GMO Flatt Security flatt_security
0
350
事業の財務責任に向き合うリクルートデータプラットフォームのFinOps
Avatar for Recruit recruitengineers
PRO
2
200
re:Invent2025 3つの Frontier Agents を紹介 / introducing-3-frontier-agents
Avatar for tomoki10 tomoki10
0
400
New Relic 1 年生の振り返りと Cloud Cost Intelligence について #NRUG
Avatar for PLAY, inc. play_inc
0
230
障害対応訓練、その前に
Avatar for coconala_engineer coconala_engineer
0
190
"人"が頑張るAI駆動開発
Avatar for yoko yokomachi
1
130
SREが取り組むデプロイ高速化 ─ Docker Buildを最適化した話
Avatar for capytan capytan
0
140
ActiveJobUpdates
Avatar for Kuniaki IGARASHI igaiga
1
310

Featured

See All Featured
The Mindset for Success: Future Career Progression
Avatar for Greg Gifford greggifford
PRO
0
190
[RailsConf 2023] Rails as a piece of cake
Avatar for Vladimir Dementyev palkan
58
6.2k
The Web Performance Landscape in 2024 [PerfNow 2024]
Avatar for Tammy Everts tammyeverts
12
980
Public Speaking Without Barfing On Your Shoes - THAT 2023
Avatar for David Neal reverentgeek
1
280
What Being in a Rock Band Can Teach Us About Real World SEO
Avatar for Ade Holder 427marketing
0
150
First, design no harm
Avatar for Per Axbom axbom
PRO
1
1.1k
Game over? The fight for quality and originality in the time of robots
Avatar for Wayne Barker wayneb77
1
66
Designing Dashboards & Data Visualisations in Web Apps
Avatar for Des Traynor destraynor
231
54k
Highjacked: Video Game Concept Design
Avatar for Ryan Kendrick rkendrick25
PRO
0
250
Rebuilding a faster, lazier Slack
Avatar for samanthasiow samanthasiow
85
9.3k
Bridging the Design Gap: How Collaborative Modelling removes blockers to flow between stakeholders and teams @FastFlow conf
Avatar for Kenny Baas-Schwegler baasie
0
400
Data-driven link building: lessons from a $708K investment (BrightonSEO talk)
Avatar for Szymon szymonslowik
1
850

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