glTF and the WebGL Art Pipeline March 2015

4,786 views

Published on

My slides from the March Silicon Valley WebGL Meetup at NVIDIA GTC 2015

Published in: Technology
1 Comment
2 Likes
Statistics
Notes
No Downloads
Views
Total views
4,786
On SlideShare
0
From Embeds
0
Number of Embeds
59
Actions
Shares
0
Downloads
36
Comments
1
Likes
2
Embeds 0
No embeds

No notes for slide

glTF and the WebGL Art Pipeline March 2015

  1. 1. http://www.tonyparisi.com 3/18/15 art pipelines for WebGL development tony parisi March, 2015
  2. 2. http://www.tonyparisi.com 3/18/15 WHAT art pipelines?!
  3. 3. http://www.tonyparisi.com 3/18/15 WebGL content creation is a shaky proposition • The only reliable paths are through proprietary tools – Goo Create – Unity3D and Unreal via Emscripten – Verold Studio… going open source soon? – PlayCanvas is open source, but if you’re not building a game, it’s a sledgehammer – … all tied to somebody’s engine and using different file formats for the data • Open source libraries (Three.js, Babylon.js etc.) have half-baked art paths and each defines a different file format : so a lot of times teams roll their own tools for a new project
  4. 4. http://www.tonyparisi.com 3/18/15 Q: what file formats does WebGL support?
  5. 5. http://www.tonyparisi.com 3/18/15 A: none.
  6. 6. http://www.tonyparisi.com 3/18/15 we need a reliable, consistent, vendor-neutral way to get full-featured art from 3D tools into WebGL applications
  7. 7. http://www.tonyparisi.com 3/18/15 existing standards won’t cut it • COLLADA – Khronos Group standard http://www.khronos.org/collada/ – well-supported by professional tools… at least it was for a while • industry support has waned in the last few years – feature-rich • meshes, materials, textures, scene hierarchy, cameras, lights, animations… COLLADA has big issues for use with WebGL • files are text-based XML, big to download and slow to parse in a browser or mobile application • Wavefront OBJ, STL, … – Single-model formats don’t support many features e.g. lights, cameras, animations, scene hierarchy
  8. 8. http://www.tonyparisi.com 3/18/15 graphics library Transmission Format
  9. 9. http://www.tonyparisi.com 3/18/15 “JPEG for 3D” a “JPEG for 3D” • bridges the gap between existing 3D formats/tools and today’s GL based APIs (WebGL, OpenGL ES) • compact representation – efficient to download • loads quickly into memory – GL native data types require no additional parsing • full-featured – includes common 3D constructs (hierarchy, cameras, lights, common materials, animation) – full support for shaders and arbitrary materials • reduces duplicated effort in content pipeline • a common publishing format for content tools
  10. 10. http://www.tonyparisi.com 3/18/15 three.js loader rest3d viewer Cesium engine MontageJS viewer glTF in action
  11. 11. http://www.tonyparisi.com 3/18/15 comparison : glTF vs COLLADA file sizes Size (Mb) Wine Rack Super Murdoch Virtual City Razer Rambler glTF JSON + .bin 0.58 0.85 2.6 5.1 12.7 COLLADA (.dae) 0.79 1.8 5.5 7.5 31.6 % reduction 27% 53% 53% 32% 60% 0 5 10 15 20 25 30 35 40 45 50 Wine Rack Super Murdoch Virtual City Razer Rambler COLLADA (.dae) glTF JSON + .bin
  12. 12. http://www.tonyparisi.com 3/18/15 comparison : glTF vs COLLADA load times 0 1 2 3 4 5 6 7 Wine Rack Razer Virtual City Super Murdoch Rambler COLLADA (.dae) glTF glTF w BufferGeometry Wine Rack Razer Virtual City Super Murdoch Rambler glTF w BufferGeometry 0.06 0.08 0.09 0.21 0.69 glTF 0.08 0.36 0.15 0.27 1.86 COLLADA (.dae) 0.18 1.34 1.05 0.55 3.88 %reduction 67% 94% 91% 62% 82%
  13. 13. http://www.tonyparisi.com 3/18/15 the glTF art pipeline OpenCOLLADA – open-source exporter plugins for Max and Maya, Windows, Linux and Mac OSX http://collada.org/mediawiki/index. php/OpenCOLLADA COLLADA2GLTF converter under development https://github.com/KhronosGroup/glTF/wiki/C onverter-builds FBX-glTF converter being developed by Autodesk!!! https://github.com/cyrillef/FBX-glTF NEW NEW NEW! ALSO: T. Parisi/Dave Arendash working on Unity exporter…
  14. 14. http://www.tonyparisi.com 3/18/15 case study: from concept to deployment
  15. 15. http://www.tonyparisi.com 3/18/15 concept art
  16. 16. http://www.tonyparisi.com 3/18/15 the model
  17. 17. http://www.tonyparisi.com 3/18/15 export and convert 1. make sure OpenCOLLADA is installed and enabled in Maya 2. export the scene with textures 3. run collada2gltf command-line converter
  18. 18. http://www.tonyparisi.com 3/18/15 preview
  19. 19. http://www.tonyparisi.com 3/18/15 glTF project status • working group – P. Cozzi, T. Parisi, R. Arnaud • moving toward official Khronos specification 04/06 – Full draft 04/20 - Public review of draft 1.0 06/01 - Submit draft 1.0 to Khronos for ratification 08/09 - glTF 1.0 release at SIGGRAPH • design being done in the open https://github.com/KhronosGroup/glTF • Cesium and Three.js viewers under active development – https://github.com/AnalyticalGraphicsInc/cesium – https://github.com/mrdoob/three.js/ (Tony needs to update to latest spec rev) • FBX-glTF converter under active development
  20. 20. http://www.tonyparisi.com 3/18/15 help is on the way! 3d artists of the world thank you…

×