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
Babylon.js 8.0のアプデ情報を 軽率にキャッチアップ / catch-up-bab...
Search
にー兄さん
May 27, 2025
Programming
0
160
Babylon.js 8.0のアプデ情報を 軽率にキャッチアップ / catch-up-babylonjs-8
Babylon.js 勉強会 vol.4 オンライン~Babylon.js 8.0 リリース記念~で発表した資料です
にー兄さん
May 27, 2025
Tweet
Share
More Decks by にー兄さん
See All by にー兄さん
軽率にプログラミング言語のシンタックスについて考えてみよう / lets-think-about-programming-lang-syntax
drumath2237
0
47
エンジニアが軽率に趣味から始める、OSS貢献を軸とした個人活動 / oss-contribution-as-a-hoby-project
drumath2237
0
32
フォークギター with VFXの 制作を軽率に振り返ろう! / look back fork guitar with vfx
drumath2237
0
32
軽率に始まった Babylon.js勉強会運営の 1年間をふりかえって / look back babylonjs japan activity
drumath2237
0
58
利己的利他、 あるいは軽率2.0に備えよ。 / prepare-for-keisotsu-2.0
drumath2237
0
47
軽率にAndroidXRのJetpack SceneCoreを使って3Dモデルを表示してみる / androidxr-scenecore-3dmodels
drumath2237
0
110
あなたの知らないWebXR Device APIの話を軽率に / about-webxr-device-api-you-dont-know
drumath2237
0
40
UnJSを使って軽率にCLIを作ってみたらめちゃくちゃ便利だった / create CLI with UnJS
drumath2237
4
1.6k
create-babylon-appを軽率にアプデしたい / update create babylon app
drumath2237
1
1.8k
Other Decks in Programming
See All in Programming
React は次の10年を生き残れるか:3つのトレンドから考える
oukayuka
40
15k
効率的な開発手段として VRTを活用する
ishkawa
1
180
SQLアンチパターン第2版 データベースプログラミングで陥りがちな失敗とその対策 / Intro to SQL Antipatterns 2nd
twada
PRO
34
10k
PHPUnitの限界をPlaywrightで補完するテストアプローチ
yuzneri
0
350
AI コーディングエージェントの時代へ:JetBrains が描く開発の未来
masaruhr
2
220
状態遷移図を書こう / Sequence Chart vs State Diagram
orgachem
PRO
3
290
脱Riverpod?fqueryで考える、TanStack Queryライクなアーキテクチャの可能性
ostk0069
0
570
NEWT Backend Evolution
xpromx
1
160
The Evolution of Enterprise Java with Jakarta EE 11 and Beyond
ivargrimstad
0
530
構造化・自動化・ガードレール - Vibe Coding実践記 -
tonegawa07
0
150
QA x AIエコシステム段階構築作戦
osu
0
210
ソフトウェア設計とAI技術の活用
masuda220
PRO
25
6.9k
Featured
See All Featured
Facilitating Awesome Meetings
lara
54
6.5k
Docker and Python
trallard
45
3.5k
The Power of CSS Pseudo Elements
geoffreycrofte
77
5.9k
It's Worth the Effort
3n
185
28k
Bootstrapping a Software Product
garrettdimon
PRO
307
110k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
331
22k
Building an army of robots
kneath
306
45k
Building a Scalable Design System with Sketch
lauravandoore
462
33k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.4k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
Become a Pro
speakerdeck
PRO
29
5.4k
We Have a Design System, Now What?
morganepeng
53
7.7k
Transcript
Babylon.js 8.0の アプデ情報を 軽率にキャッチアップ にー兄さん@ninisan_drumath Babylon.js 勉強会 vol.4 オンライン~Babylon.js 8.0
リリース記念~
アジェンダ - はじめに - Babylon.js 8.0アプデの全体感 - レンダリング系 - ツール系
- ファイルフォーマット系 - オーディオエンジン - Havok - おわりに
はじめに
にー兄さん(@ninisan_drumath) ソフトウェアエンジニア “Babylon.jsとWebXR Device APIの宣教師” 株式会社ホロラボ Babylon.js勉強会運営 Iwaken Lab. Microsoft
MVP for Developer Technologies
本日のお話 - Babylon.js 8.0のリリースをキャッチアップ - 詳細な内容はあまり話せない(時間的に) ゴール: Babylon.jsが好き・興味がある人向けに 8.0の目玉となる機能を抜粋してお届けする
Babylon.js 8.0 リリースの全体感
Babylon.js 8.0リリース🎉 公式Xでは2025/3/28(日本時間)に アナウンス ブログポストもいくつか - Announcing Babylon.js 8.0 https://blogs.windows.com/windowsdeveloper/2025/03/27/ann
ouncing-babylon-js-8-0/ - Introducing Babylon.js 8.0(medium) https://babylonjs.medium.com/introducing-babylon-js-8-0-776 44b31e2f9 - Introducing Babylon.js 8.0(linkedin) https://www.linkedin.com/pulse/introducing-babylonjs-80-b abylon-js-s5zmc/
かっこいいPV
Babylon.jsのメジャーアップデート - 年に1回メジャーバージョンが アップデート - マイナーバージョンは 定期的に細かくリリース - 8.0のリリース内容は すでに7.xで実装されているもの
- つまり急に出てきたわけではない - 大きな変更を与えないようにするため
リリース項目(NotebookLMに頼んでみた) • IBL Shadows • Area Lights • Node Render
Graph – Alpha • All New Lightweight Viewer • WGSL Core Engine Shaders • NME -> WGSL Support • Overhauled Audio Engine • Gaussian Splat Updates • Havok Character Controller • Smart Filters • Environment Improvements • Node Geometry Editor Updates • Node Material Editor Debug Node • Improved Booleans • Updated glTF Support — KHR_materials_diffuse_transmission • glTF Exporter Improvements • More glTF Loader Options • IES Light Support • USDZ Export • GPU Mesh Picking • GPU Bounding Box • EXR Texture Support • WebXR Depth Sensing
リリース項目(NotebookLMに頼んでみた) • IBL Shadows • Area Lights • Node Render
Graph – Alpha • All New Lightweight Viewer • WGSL Core Engine Shaders • NME -> WGSL Support • Overhauled Audio Engine • Gaussian Splat Updates • Havok Character Controller • Smart Filters • Environment Improvements • Node Geometry Editor Updates • Node Material Editor Debug Node • Improved Booleans • Updated glTF Support — KHR_materials_diffuse_transmission • glTF Exporter Improvements • More glTF Loader Options • IES Light Support • USDZ Export • GPU Mesh Picking • GPU Bounding Box • EXR Texture Support • WebXR Depth Sensing 多すぎ
アプデ内容をキャッチアップ!
主なソース Windows Developer Blog Part1~3まである 観測範囲で話題になっていたり 熱量高く語られていたりするものを ピックアップ https://blogs.windows.com/ windowsdeveloper/2025/03/27/announcing
-babylon-js-8-0/
レンダリング系
IBL Shadows - Image Based Lighting←既存機能 - 環境マップから3Dモデルに影響す るライティングを表現 -
IBLが影に対応←New! - Adobe社のMichael氏による貢献 デモ: https://playground.babylonjs.com/#8R 5SSE#665
Area Light 2Dのジオメトリを光源として 扱う RectAreaLightクラス とにかくデモが良い https://aka.ms/babylon8Are aLightsDemo
WGSL Core Engine Shaders WGSL = WebGPUで使えるシェーダ言語(not GLSL) Babylon.js EngineのシェーダはGLSLで書かれていて
WebGPUを使う場合は変換ライブラリで変換していた →ライブラリが3MBくらいあってUXに影響していた GLSL/WGSL両対応することで(変換不要になったので) WebGPU使用時のライブラリサイズが半分に(!!)
ツール系
Node Render Graph Editor (Alpha版)
Node Render Graph (Alpha版) ノードエディタからBlack-Boxだった レンダリングパイプラインの カスタマイズが可能な Frame Graphという機能で カスタマイズは可能だった
→視覚的にパイプライン構築可能に コードベースではなくノードベースで
Node Render Graph (Alpha版) まだAlpha版なので 製品コードには使わないでとも “One of the most
powerful new features” https://nrge.babylonjs.com/
All New Lightweight Viewer いわゆるViewer V2 シンプルなHTMLでビューワが作れちゃう <babylon-viewer source=”glbのURL”> </babylon-viewer>
コントローラなど付けられて実は高機能 公式サイト: https://babylonjs.com/viewer
All New Lightweight Viewer(Configurator)
Smart Filter Editor (SFE) ビデオフィルタやテクスチャ操作、 ポスプロなどの用途に使える エディタがあり、 ノードベースで構築 https://sfe.babylonjs.com/ リポジトリは独立しているみたい
https://github.com/BabylonJS/SmartFilters
ファイルフォーマット系
glTF KHR_materials_diffuse_transmission拡張 glTF拡張仕様の1種 葉っぱやロウソクなどから 透けるやわらかい拡散光の表現 デモ: https://aka.ms/babylon8gltfdemo 仕様: https://github.com/KhronosGroup/glTF/blob/main/e xtensions/2.0/Khronos/KHR_materials_diffuse_trans
mission/README.md
その他glTF関連 - Loader/Exporterのアプデ - オプションが増えたり - ExporterがLOD対応したり - 将来的な展望として glTF
Interactivity拡張への対応に言及 - 仕様 :https://github.com/KhronosGroup/glTF/blob/interactivity/extensions/2.0/Khronos/KHR_interactivity/Spe cification.adoc#introduction-general
USDZ export USDZのランタイム出力に対応 const data = await BABYLON.USDZExportAsync(scene, {}, m
=> { return m !== currentSkybox }); BABYLON.Tools.Download(new Blob([data], {type: 'model/vnd.usdz+zip'}), "scene.usdz");
Gaussian Splatting 新たなフォーマットとして SPZ、compressed-PLYに対応 SH(球面調和関数)への対応 メモリ容量・CPU/GPU使用率への 最適化 doc: https://doc.babylonjs.com/features/featuresDeep Dive/mesh/gaussianSplatting
サン・ピエトロ寺院のデモ事例
オーディオエンジン
Overhauled Audio Engine 新しくなったAudio Engine V2 - Powerful - web-audio機能をフル活用できる
- Modern - クラス名や設計 - Simple-to-Use - 知識レベルによらず使いやすく doc: https://doc.babylonjs.com/features/featuresDeepDive/audio/playingSoundsMusic/
Havok
Havok Character Controller 6.0の目玉機能であるHavok Character Controllerの実装 FPSゲームのようなものが いい感じに作れそう デモ: https://aka.ms/babylon8havokCCDemo
おわりに
まとめ・所感 Babylon.js 8.0は3月末リリースされた アプデ項目も多く、強力な機能がいくつもあった - レンダリング - ツール類 - ファイルフォーマット
- オーディオ - 物理演算エンジン 特に最近はノードエディタ系に力が入っていそうな印象
参考 Announcing Babylon.js 8.0 https://blogs.windows.com/windowsdeveloper/2025/03/27/announcing-babylon-js-8-0/ Part 2 – Babylon.js 8.0:
Audio, Gaussian Splat and physics updates https://blogs.windows.com/windowsdeveloper/2025/03/31/part-2-babylon-js-8-0-audio-gaussian-splat-and-physics-upda tes/ Part 3 – Babylon.js 8.0: glTF, USDz, and WebXR advancements https://blogs.windows.com/windowsdeveloper/2025/04/03/part-3-babylon-js-8-0-gltf-usdz-and-webxr-advancements/ Introducing Babylon.js 8.0(medium) https://babylonjs.medium.com/introducing-babylon-js-8-0-77644b31e2f9 Introducing Babylon.js 8.0(linkedin) https://www.linkedin.com/pulse/introducing-babylonjs-80-babylon-js-s5zmc/ Babylon.js 8.0 is Officially Here! https://forum.babylonjs.com/t/babylon-js-8-0-is-officially-here/57452