YOU ARE DOWNLOADING DOCUMENT

Please tick the box to continue:

Transcript
Page 1: Unleash 3D games with Babylon.js - JSConf 2014 talk

BABYLON.JSUnleash 3D games for the WEB

Page 2: Unleash 3D games with Babylon.js - JSConf 2014 talk

[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

FIRST CONTACTHello world Babylon.js

Page 4: Unleash 3D games with Babylon.js - JSConf 2014 talk

LEARN AND EXPERIMENTPlayground

Page 5: Unleash 3D games with Babylon.js - JSConf 2014 talk

CREATE YOUR OWN SHADERCYOS

Page 6: Unleash 3D games with Babylon.js - JSConf 2014 talk

CREATING ASSETSUsing Blender

Page 7: Unleash 3D games with Babylon.js - JSConf 2014 talk

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

UNIVERSAL APPCreating Windows and Windows Phone with Babylon.js

Page 9: Unleash 3D games with Babylon.js - JSConf 2014 talk

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

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

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

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

THANK

YOU!


Related Documents