unleash 3d games with babylon.js - jsconf 2014 talk
DESCRIPTION
Babylon.js is an open-source project built with simplicity in mind in order to help web developers creating 3D games. During this session, you will discover how simple it can be to play with 3D without having to deal with WebGL plumbing!TRANSCRIPT
![Page 1: Unleash 3D games with Babylon.js - JSConf 2014 talk](https://reader035.vdocument.in/reader035/viewer/2022070303/54b723454a795903798b4806/html5/thumbnails/1.jpg)
BABYLON.JSUnleash 3D games for the WEB
![Page 2: Unleash 3D games with Babylon.js - JSConf 2014 talk](https://reader035.vdocument.in/reader035/viewer/2022070303/54b723454a795903798b4806/html5/thumbnails/2.jpg)
[email protected] - @deltakosh - http://aka.ms/davca
DAVIDCATUHESenior Program Manager – IE / Open Web StandardsDeveloper Experience and Evangelism
2
![Page 3: Unleash 3D games with Babylon.js - JSConf 2014 talk](https://reader035.vdocument.in/reader035/viewer/2022070303/54b723454a795903798b4806/html5/thumbnails/3.jpg)
FIRST CONTACTHello world Babylon.js
![Page 4: Unleash 3D games with Babylon.js - JSConf 2014 talk](https://reader035.vdocument.in/reader035/viewer/2022070303/54b723454a795903798b4806/html5/thumbnails/4.jpg)
LEARN AND EXPERIMENTPlayground
![Page 5: Unleash 3D games with Babylon.js - JSConf 2014 talk](https://reader035.vdocument.in/reader035/viewer/2022070303/54b723454a795903798b4806/html5/thumbnails/5.jpg)
CREATE YOUR OWN SHADERCYOS
![Page 6: Unleash 3D games with Babylon.js - JSConf 2014 talk](https://reader035.vdocument.in/reader035/viewer/2022070303/54b723454a795903798b4806/html5/thumbnails/6.jpg)
CREATING ASSETSUsing Blender
![Page 7: Unleash 3D games with Babylon.js - JSConf 2014 talk](https://reader035.vdocument.in/reader035/viewer/2022070303/54b723454a795903798b4806/html5/thumbnails/7.jpg)
PLAYING WITH INPUT
Touch
Camera based on pointer events
Device Orientation
Camera based on Device Orientation
API
Virtual Joysticks
Using pointer events, this camera
generates two joysticks on top of
the scene
Anaglyph
Use this camera with Red/Green glasses
Oculus
Control camera orientation with
Oculus Rift device
![Page 8: Unleash 3D games with Babylon.js - JSConf 2014 talk](https://reader035.vdocument.in/reader035/viewer/2022070303/54b723454a795903798b4806/html5/thumbnails/8.jpg)
UNIVERSAL APPCreating Windows and Windows Phone with Babylon.js
![Page 9: Unleash 3D games with Babylon.js - JSConf 2014 talk](https://reader035.vdocument.in/reader035/viewer/2022070303/54b723454a795903798b4806/html5/thumbnails/9.jpg)
ABOUT ASSASSIN’S CREED PIRATES RACEUbiSoft used Babylon.js to create a complete racing game for the web
Contest for developers
Create a shader for the pirate ship at
http://www.babylonjs.com/cyos/acpr
Submit your entry by June 20, 2014
http://race.assassinscreedpirates.com/
![Page 10: Unleash 3D games with Babylon.js - JSConf 2014 talk](https://reader035.vdocument.in/reader035/viewer/2022070303/54b723454a795903798b4806/html5/thumbnails/10.jpg)
BABYLON.JS FEATURES
1 Easy to use• Simplicity as a foundation• Minimal amount of code• Pure JavaScript• Open-source• Optimizations engines (Octree, clipping,
offline mode)
2 Advanced shaders• Smart shaders• Per-pixel lighting• Video / dynamic textures• Bump• Shadows• Etc..
3 Collisions / physics engine• Complete collisions engine• Physics drivers (cannon.js)
4 And so many more• Oculus Rift / Touch / Device Orientation • Local cache using IDB• Network optimizations with incremental loading• Particles• Mirrors• Skyboxes• Postprocesses• Sprites
![Page 11: Unleash 3D games with Babylon.js - JSConf 2014 talk](https://reader035.vdocument.in/reader035/viewer/2022070303/54b723454a795903798b4806/html5/thumbnails/11.jpg)
BABYLON.JS TOOLS
1 PlaygroundLearn and experiment Babylon.js in your browser:http://www.babylonjs.com/playground
For shaders: http://www.babylonjs.com/cyos
2 SandboxSimply test your scene with drag’n’drop:http://www.babylonjs.com/sandbox
3 Exporters• Blender• 3DS Max (thanks to UbiSoft)• FBX converter• OBJ converter• Collada converter
4 WIKI• https://github.com/BabylonJS/Babylon.js• Tutorials• Documentation• Forum:
http://www.html5gamedevs.com/forum/16-babylonjs/
![Page 12: Unleash 3D games with Babylon.js - JSConf 2014 talk](https://reader035.vdocument.in/reader035/viewer/2022070303/54b723454a795903798b4806/html5/thumbnails/12.jpg)
USEFUL LINKS
http://www.babylonjs.com
http://www.babylonjs.com/playground
http://www.babylonjs.com/cyos
https://github.com/BabylonJS/Babylon.js/wiki
http://www.html5gamedevs.com/forum/16-babylonjs
![Page 13: Unleash 3D games with Babylon.js - JSConf 2014 talk](https://reader035.vdocument.in/reader035/viewer/2022070303/54b723454a795903798b4806/html5/thumbnails/13.jpg)
THANK
YOU!