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
Honoでのサプライチェーン侵害対策 〜 3つのライブラリに学ぶ
yusukebe
7
1.4k
Creating Composable Callables in Contemporary C++
rollbear
0
170
ローカルLLMでどこまでコードが書けるか -拡張版 / How much code can be written on a local LLM Extended
kishida
12
4.4k
Datadog × OpenTelemetry 入門と実践のあいだ
kn_to_maxpno
1
180
Contextとはなにか
chiroruxx
1
370
セキュリティの専門家じゃなくてもできる。「セキュリティ意識」をアップデートして サプライチェーン攻撃への耐性を高めよう。
tk3fftk
5
940
はてなアカウント基盤 State of the Union
cockscomb
1
720
Spring Security 実践 ─ GraphQL APIで実務に役立つ 認証・認可 を学ぶ
wagyu
0
260
生成AI時代にこそ効くGo | Why Go Works in the Age of Generative AI
mom0tomo
8
3.3k
JavaDoc 再入門
nagise
1
420
dRuby over BLE
makicamel
2
390
Inside Stream API
skrb
1
770
Featured
See All Featured
Why Our Code Smells
bkeepers
PRO
340
58k
How to Grow Your eCommerce with AI & Automation
katarinadahlin
PRO
1
210
Exploring the relationship between traditional SERPs and Gen AI search
raygrieselhuber
PRO
2
4k
[RailsConf 2023] Rails as a piece of cake
palkan
59
6.7k
Measuring Dark Social's Impact On Conversion and Attribution
stephenakadiri
2
220
We Analyzed 250 Million AI Search Results: Here's What I Found
joshbly
1
1.4k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
234
17k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
250
1.3M
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
10
1.2k
Money Talks: Using Revenue to Get Sh*t Done
nikkihalliwell
0
260
KATA
mclloyd
PRO
35
15k
JAMstack: Web Apps at Ludicrous Speed - All Things Open 2022
reverentgeek
1
480
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でもネイティブ に近いリッチ表現へ!