Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
tfcon2022_Web3Dひとめぐり.pdf
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
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
370
Other Decks in Programming
See All in Programming
ChromeでローカルLLM
ryu1013
0
140
Event is what happens
moro
2
770
Jetpack Compose Mechanisms
skydoves
3
820
Workers Cache を知る
syumai
0
360
AIに “答え“を書かせるのを やめてみた
___akari11
0
120
Unity6 URPによる海底をテーマにしたVJシステムの解説 | Unity Shader 完全に理解した 勉強会
gam0022
0
370
[ハンズオン]AIへの指示だけで「五目並べ」を作ってみよう
satoshi256kbyte
1
380
月間100万人のサービス刷新で、 技術選定をHonoに振り切った話
yutobara
8
6.6k
Domain-Driven Transformation
hschwentner
2
2.3k
作れる、でも消せるか?──安全に「枯らして消す」機能削除術 / Drain, Then Delete
chobishiba
2
630
すこし踏み込む CancellationToken
htkym
2
1.7k
Verilogで学ぶCPU自作入門
uyuki234
8
4.1k
Featured
See All Featured
VelocityConf: Rendering Performance Case Studies
addyosmani
331
25k
Organizational Design Perspectives: An Ontology of Organizational Design Elements
kimpetersen
PRO
1
850
Product Roadmaps are Hard
iamctodd
55
13k
The SEO Collaboration Effect
kristinabergwall1
1
590
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
123
22k
The Impact of AI in SEO - AI Overviews June 2024 Edition
aleyda
6
1.2k
Balancing Empowerment & Direction
lara
6
1.3k
Highjacked: Video Game Concept Design
rkendrick25
PRO
1
480
How to Ace a Technical Interview
jacobian
280
24k
Visualization
eitanlees
153
17k
DBのスキルで生き残る技術 - AI時代におけるテーブル設計の勘所
soudai
PRO
68
58k
How to Align SEO within the Product Triangle To Get Buy-In & Support - #RIMC
aleyda
2
1.8k
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でもネイティブ に近いリッチ表現へ!