Unleashing WebGL & WebAudio with babylon.js

Post on 15-Jul-2015

1.252 views 6 download

Transcript of Unleashing WebGL & WebAudio with babylon.js

jQuery UK 2015#babylonjs

Babylon.js ?

Free & open source project (Apache 2 license): https://github.com/babylonjs/babylon.js

Written in TypeScript

Our philosophy?

Simple to use

High performance

Run everywhere

WebGL. simple. powerful.

jQuery UK 2015#babylonjs

Advanced features

Offline supportIndexedDB

Network optimizationsIncremental loading

Blender, 3DS Max & Unityexporters

Design & render +babylonjs.com/sandbox

Complete collisions and physics engine

jQuery UK 2015#babylonjs

Advanced features

Smart shaders engine and postprocesses

Complete Web Audioengine

Advanced texture support (Bump, DDS)

Touch, Gamepad, Oculus &virtual joysticks

jQuery UK 2015#babylonjs

Handling touch devicesOne event to rule them all!

jQuery UK 2015#babylonjs

Ok, let’s restart the engine from the beginning

jQuery UK 2015#babylonjs

Learning Babylon.js using the playground

• Get sample code

• Try and experiment

• Share with friends

• Learn by reading examples

The power of TypeScript!

#babylonjs

Working with 3D artists

jQuery UK 2015#babylonjs

Creation PipelineFrom 3D tooling to WebGL using 0 line of code!

.babylon

offlin

e

con

verte

r

.FBX

.OBJ

.FBX

.OBJ

jQuery UK 2015#babylonjs

Babylon.js audio engine

Based on Web Audio

Supports ambient, omnidirectional or directional

3D sound using linear attenuation by default

Managed by code or by loading our .babylon format

Supported by our 3DS Max exporter (Blender & Unity to come)

Simplicity again as a foundation

jQuery UK 2015#babylonjs

Debug layer

Draw calls

Time spent per feature

Number of objects

Number of active vertices

Are you GPU / CPU locked?

User marks + F12

Tool to help you reviewing performance issues

Useful links

What we’re working on in Internet Explorer: status.modern.ie• like Web Audio, Media Capture, ES6 features, etc.

Visit http://modern.ie to find ways to test IE11 • via free VMs or 3 months of BrowserStack for free • even on your lovely Mac!

Play with Babylon.js demos on www.babylonjs.com• and try some tutorials via our playground: www.babylonjs.com/playground

Contact the IE Developer Relations team on twitter: @iedevchatand Babylon.js developers: @deltakosh & @davrous

www.babylonjs.com

#babylonjs

@deltakosh

@davrous

@rousseau_michel