Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
tfcon2022_Web3Dひとめぐり.pdf
Search
Yuki Shimada
May 14, 2022
Programming
2.2k
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
tfcon2022_Web3Dひとめぐり.pdf
Yuki Shimada
May 14, 2022
More Decks by Yuki Shimada
See All by Yuki Shimada
WebGL2 ノウハウ・Tips集
emadurandal
0
360
Other Decks in Programming
See All in Programming
「つくるAI」だけではバグは見つからない ~テストに必要な「見つけるAI」を分離させる戦略~
mfunaki
0
230
Swift愛好会と私(ウホーイ) / Swift Fan Club and Uhooi
uhooi
0
120
ソフトウェアラスタライザ
fadis
1
780
What We Talk About When We Talk About XP
m_seki
2
350
ALB ログから Trace を気合で繋げる技術
fohte
7
860
AI に Inclusive UI を書かせよう — Design Rules Skill で Compose UI を作り直す
theoriatec2024
1
440
MIZARU@SPAJAM2026 第二回予選
1901drama
0
100
ハーネス設計入門 〜プロンプト、コンテキストの次〜
kinopeee
53
35k
in-process GraphQL のすすめ #ginzajs
izumin5210
4
1.5k
My Marp Sample
sinoue0108
0
140
typoなんかねぇよ
raspython3
0
660
AIに既存システムを理解させる技術 ~レガシーを見捨てないハーネスエンジニアリング入門~
ochtum
0
200
Featured
See All Featured
Bridging the Design Gap: How Collaborative Modelling removes blockers to flow between stakeholders and teams @FastFlow conf
baasie
0
690
Amusing Abliteration
ianozsvald
1
290
svc-hook: hooking system calls on ARM64 by binary rewriting
retrage
2
550
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
333
23k
Navigating the moral maze — ethical principles for Al-driven product design
skipperchong
2
520
Build The Right Thing And Hit Your Dates
maggiecrowley
39
3.4k
技術選定の審美眼(2025年版) / Understanding the Spiral of Technologies 2025 edition
twada
PRO
120
120k
Stewardship and Sustainability of Urban and Community Forests
pwiseman
0
510
[SF Ruby Conf 2025] Rails X
palkan
2
1.3k
Learning to Love Humans: Emotional Interface Design
aarron
275
41k
Git: the NoSQL Database
bkeepers
PRO
432
67k
How to build an LLM SEO readiness audit: a practical framework
nmsamuel
1
890
Transcript
最近のWeb3D ひとめぐり @emadurandal 1
@emadurandal について 2015年頃にWebGLに触れて3Dライブラリ開発を決意した人。 WebGLライブラリRhodoniteの作者。長らくWeb3D情報を発信 現在は株式会社HIKKYにて WebGLベースの メタバースプラットフォーム の開発に従事 エンジンはRhodoniteではなく、 妹尾さんをメインアーキテクトとした
VketCloudエンジンというものです。 C++/Emscriptenによるネイティブ技術ベースの WebGLエンジンです。 2
Web3Dを取り巻く現状 3 WebGL WebGL2+標準時代の到来? WebGPU 1.0リリースはいつ? glTF glTFの拡張仕様が拡充! 派生フォーマットも WebXR
WebXR1.0が正式リリース近し! 拡張仕様も続々!
WebGL WebGL2が標準的になり、 一部では拡張機能も極めるプレーヤーが?
・シェーダービット演算 ・MSAA(アンチエイリアシング) ・3Dテクスチャー ・高速な描画系拡張関数 WebGL2標準の時代へ ほぼ全てのモダンブラウザ環境がWebGL2をサポート • Safari(iOS/Mac)でもサポート • バックエンドがOpenGL ESからMetalへ(内部実装のモダン化) ※まだ一部不具合がある(WebGL互換性テスト100%未達)が、いずれ問題解消か
WebGL2でできるモダンなこと 5
限界まで使い込まれるWebGL2 WebGL2にもまた拡張命令がある(いわばWebGL2+) 各種WebGLライブラリがWebGL2拡張を使いこなし始めた。 • WEBGL_multi_draw(複数形状メッシュを一回で描画) • OVR_multiview2(VR向け描画高速化) • KHR_parallel_shader_compile(シェーダーの並列コンパイル) •
OES_draw_buffers_indexed(描画バッファ毎の細かい制御) 引き続き追加拡張が普及予定 • WEBGL_draw_instanced_base_vertex_base_instance • WEBGL_multi_draw_instanced_base_vertex_base_instance 6
WebGPU WebGL2の次にくるWeb3D API規格
WebGPU ・コンピュートシェーダー(CPUに近い汎用計算をGPUで) ・GPUの新しい機能が使える(WebGL/WebGL2はAPI世代が古いのでアクセスできなかった) ・より高速に動作(現在のGPUに合ったよりモダンなAPI) いつ正式版がリリースされるの? → 2022 Q3目標に変更。(※今までに何度も延期されてます) シェーダーであるWGSLはまだバシバシ仕様変更が入っている。 一部のライブラリはすでに対応開始
・Babylon.jsやThree.jsはブラウザベンダーと近い関係を構築しており、すでにWebGPU現行実装に対応済み。 WebGPU for Native? ネイティブ環境で実装する試み(wgpu-rs)もあり、WebGPUが共通3D APIの有力候補になる可能性も? 8
WebXR 近づく1.0正式版、 続々と策定される拡張仕様たち
WebXR WebXR 1.0 RCがリリース。正式版まであと少し。 多くの拡張仕様の策定が進んでおり、できることが増え続けている。 1 0 UI周り WebXR DOM
Overlays Module(DOMをXR空間にオーバーレイ表示) 表現力向上・できることが増える • WebXR Lighting Estimation API Level 1 (環境光の推測) • WebXR Anchors Module(画像空間に位置追跡アンカーを打つ) • WebXR Hit Test Module (ヒットテスト機能) • WebXR Plane Detection Module (平面認識) • WebXR Depth Sensing Module (深度検出機能) 開発側にとっての便利機能 • WebXR Layers API Level 1 (描画のレイヤー機能) 入力の増強 • WebXR Gamepads Module (コントローラーの取扱い) • WebXR Hand Input Module(ハンドコントロール) AR • WebXR Augmented Reality Module(いわゆるAR) ユーザー体験の向上 • Navigation API (XR空間内にいたままページ遷移) Apple, Google, OculusのVR/AR技術の最大公約数的な仕様が遅れて WebXRに追加されている印象。
glTF 普及に大成功したglTF 2.0 強化され続ける拡張仕様。派生フォーマットも登場
glTF Webでも高度な物理ベースレンダリングが可能に!(glTF PBR Next 1) ・KHR_materials_clearcoat(クリアコート) ・KHR_materials_sheen(ベルベットのような布表現) ・KHR_materials_transmission (透過表現) 1 2
https://www.khronos.org/news/press/khronos-releases-wave-of-new-gltf-pbr-3d-material-capabilities
glTF 1 3 glTF PBR Next 2 ・KHR_materials_volume ・KHR_materials_ior ・KHR_materials_specular https://www.khronos.org/news/press/new-gltf-extensions-raise-the-bar-on-3d-asset-visual-realism
glTFベースの新フォーマットたち 1 4 3D Tiles Cesiumが提案した地理空間フォーマット。 1.0では地図の一部を成す大量のglbファイルを メタファイルがまとめる構造だったが、 1.1(Next)ではメタ情報がglTF自体に拡張仕様として 収まるよう、仕様が定義し直された。
VRM みんな大好き、ほぼデファクト?スタンダードなアバター3Dフォーマット 実はglTF2.0ベースです。 現行普及しているのはVRM0.xですが、 来るVRM1.0では機能アップするだけでなく、 メタ情報の格納の仕方がより glTF2のお作法に従った綺麗なものに。 https://vrm.dev/index.html https://cesium.com/blog/2021/11/10/introducing-3d-tiles-next/
Web3Dでもネイティブ に近いリッチ表現へ!