webgl meetup - gdc 2019 gary hsu - khronos group · babylon.js at a glance •3d engine built on...
TRANSCRIPT
![Page 1: WebGL Meetup - GDC 2019 Gary Hsu - Khronos Group · Babylon.js at a Glance •3D engine built on top of WebGL (1 and 2) •Open source (Apache 2 license) •Community driven •Written](https://reader035.vdocuments.us/reader035/viewer/2022063016/5fd682f72fdb88047c2e6aa7/html5/thumbnails/1.jpg)
WebGL Meetup - GDC 2019
Gary Hsu@bghgary
![Page 2: WebGL Meetup - GDC 2019 Gary Hsu - Khronos Group · Babylon.js at a Glance •3D engine built on top of WebGL (1 and 2) •Open source (Apache 2 license) •Community driven •Written](https://reader035.vdocuments.us/reader035/viewer/2022063016/5fd682f72fdb88047c2e6aa7/html5/thumbnails/2.jpg)
B a b y l o n . j s a t a G l a n c e
• 3D engine built on top of WebGL (1 and 2)
• Open source (Apache 2 license)
• Community driven
• Written in TypeScript
• Used by a lot of web apps• Office, SharePoint Spaces, OneDrive, Bing, Visio
• Adobe, Samsung, Toyota, Sony Electronics, US Army, Ubisoft
https://www.babylonjs.com
![Page 3: WebGL Meetup - GDC 2019 Gary Hsu - Khronos Group · Babylon.js at a Glance •3D engine built on top of WebGL (1 and 2) •Open source (Apache 2 license) •Community driven •Written](https://reader035.vdocuments.us/reader035/viewer/2022063016/5fd682f72fdb88047c2e6aa7/html5/thumbnails/3.jpg)
![Page 4: WebGL Meetup - GDC 2019 Gary Hsu - Khronos Group · Babylon.js at a Glance •3D engine built on top of WebGL (1 and 2) •Open source (Apache 2 license) •Community driven •Written](https://reader035.vdocuments.us/reader035/viewer/2022063016/5fd682f72fdb88047c2e6aa7/html5/thumbnails/4.jpg)
![Page 5: WebGL Meetup - GDC 2019 Gary Hsu - Khronos Group · Babylon.js at a Glance •3D engine built on top of WebGL (1 and 2) •Open source (Apache 2 license) •Community driven •Written](https://reader035.vdocuments.us/reader035/viewer/2022063016/5fd682f72fdb88047c2e6aa7/html5/thumbnails/5.jpg)
SharePoint Spaces
https://www.exploresharepointspaces.com
hapticmedia Clients Projects
https://hapticmedia.fr/projets-clients
Azure Media Services
https://azure.microsoft.com/en-us/services/media-services/media-player
axeon 360
https://axeon-360.com
https://axeon.fr/CLIENT/INFIME/Virtual_Staging_V2
Adobe Dimension
https://dimension.adobe.com
8th Wall
https://8thwall.com
P r o d u c t s a n d D e m o s
![Page 6: WebGL Meetup - GDC 2019 Gary Hsu - Khronos Group · Babylon.js at a Glance •3D engine built on top of WebGL (1 and 2) •Open source (Apache 2 license) •Community driven •Written](https://reader035.vdocuments.us/reader035/viewer/2022063016/5fd682f72fdb88047c2e6aa7/html5/thumbnails/6.jpg)
4 . 0 R e l e a s e
What’s New
• New Inspector (Deltakosh)
• PBR Next (Sebavan)
• Energy Conservation
• Clear Coat
• Sheen
• ESNext Modules (Sebavan)
• AmmoJS (TrevorDev)
• Soft bodies (JohnK)
• Optimizations (Deltakosh, barroij, TrevorDev)
![Page 7: WebGL Meetup - GDC 2019 Gary Hsu - Khronos Group · Babylon.js at a Glance •3D engine built on top of WebGL (1 and 2) •Open source (Apache 2 license) •Community driven •Written](https://reader035.vdocuments.us/reader035/viewer/2022063016/5fd682f72fdb88047c2e6aa7/html5/thumbnails/7.jpg)
![Page 8: WebGL Meetup - GDC 2019 Gary Hsu - Khronos Group · Babylon.js at a Glance •3D engine built on top of WebGL (1 and 2) •Open source (Apache 2 license) •Community driven •Written](https://reader035.vdocuments.us/reader035/viewer/2022063016/5fd682f72fdb88047c2e6aa7/html5/thumbnails/8.jpg)
![Page 9: WebGL Meetup - GDC 2019 Gary Hsu - Khronos Group · Babylon.js at a Glance •3D engine built on top of WebGL (1 and 2) •Open source (Apache 2 license) •Community driven •Written](https://reader035.vdocuments.us/reader035/viewer/2022063016/5fd682f72fdb88047c2e6aa7/html5/thumbnails/9.jpg)
![Page 10: WebGL Meetup - GDC 2019 Gary Hsu - Khronos Group · Babylon.js at a Glance •3D engine built on top of WebGL (1 and 2) •Open source (Apache 2 license) •Community driven •Written](https://reader035.vdocuments.us/reader035/viewer/2022063016/5fd682f72fdb88047c2e6aa7/html5/thumbnails/10.jpg)
• WEBGL_multiview
• KHR_parallel_shader_compile
D r a f t A P I s & E x t e n s i o n s
WebXR
![Page 11: WebGL Meetup - GDC 2019 Gary Hsu - Khronos Group · Babylon.js at a Glance •3D engine built on top of WebGL (1 and 2) •Open source (Apache 2 license) •Community driven •Written](https://reader035.vdocuments.us/reader035/viewer/2022063016/5fd682f72fdb88047c2e6aa7/html5/thumbnails/11.jpg)
![Page 12: WebGL Meetup - GDC 2019 Gary Hsu - Khronos Group · Babylon.js at a Glance •3D engine built on top of WebGL (1 and 2) •Open source (Apache 2 license) •Community driven •Written](https://reader035.vdocuments.us/reader035/viewer/2022063016/5fd682f72fdb88047c2e6aa7/html5/thumbnails/12.jpg)
D r a f t A P I & E x t e n s i o n s – W E B G L _ m u l t i v i e w
https://playground.babylonjs.com/#CXREM7#1
![Page 13: WebGL Meetup - GDC 2019 Gary Hsu - Khronos Group · Babylon.js at a Glance •3D engine built on top of WebGL (1 and 2) •Open source (Apache 2 license) •Community driven •Written](https://reader035.vdocuments.us/reader035/viewer/2022063016/5fd682f72fdb88047c2e6aa7/html5/thumbnails/13.jpg)
Multiview Disabled Multiview Enabled
D r a f t A P I & E x t e n s i o n s – W E B G L _ m u l t i v i e w
24.1 ms 15.9 ms
![Page 14: WebGL Meetup - GDC 2019 Gary Hsu - Khronos Group · Babylon.js at a Glance •3D engine built on top of WebGL (1 and 2) •Open source (Apache 2 license) •Community driven •Written](https://reader035.vdocuments.us/reader035/viewer/2022063016/5fd682f72fdb88047c2e6aa7/html5/thumbnails/14.jpg)
D r a f t A P I & E x t e n s i o n s – KHR_parallel_shader_compile
https://playground.babylonjs.com/#WHXBFS#4
![Page 15: WebGL Meetup - GDC 2019 Gary Hsu - Khronos Group · Babylon.js at a Glance •3D engine built on top of WebGL (1 and 2) •Open source (Apache 2 license) •Community driven •Written](https://reader035.vdocuments.us/reader035/viewer/2022063016/5fd682f72fdb88047c2e6aa7/html5/thumbnails/15.jpg)
Disabled Enabled
D r a f t A P I & E x t e n s i o n s – KHR_parallel_shader_compile
74.6 ms 47.8 ms
![Page 16: WebGL Meetup - GDC 2019 Gary Hsu - Khronos Group · Babylon.js at a Glance •3D engine built on top of WebGL (1 and 2) •Open source (Apache 2 license) •Community driven •Written](https://reader035.vdocuments.us/reader035/viewer/2022063016/5fd682f72fdb88047c2e6aa7/html5/thumbnails/16.jpg)
D e b u g g i n g To o l s
Spector.jsglTF Debugging in
Visual Studio Code
![Page 17: WebGL Meetup - GDC 2019 Gary Hsu - Khronos Group · Babylon.js at a Glance •3D engine built on top of WebGL (1 and 2) •Open source (Apache 2 license) •Community driven •Written](https://reader035.vdocuments.us/reader035/viewer/2022063016/5fd682f72fdb88047c2e6aa7/html5/thumbnails/17.jpg)
Babylon.js
https://www.babylonjs.com
https://doc.babylonjs.com/features/es6_support
WebGL Draft Extensions
https://www.khronos.org/registry/webgl/extensions/WEBGL_multiview
https://www.khronos.org/registry/webgl/extensions/KHR_parallel_shader_compile
Spector.js
https://spector.babylonjs.com
https://github.com/BabylonJS/Spector.js/blob/master/documentation/extension.md#shader-editor
glTF Debugging in Visual Studio Code
https://marketplace.visualstudio.com/items?itemName=cesium.gltf-vscode
https://medium.com/@babylonjs/gltf-debugging-in-visual-studio-code-a89805bda3cd
R e s o u r c e s