[UNKNOWN] 0:00 [MUSIC] 0:00 [UNKNOWN] Ok, so thank you, hello, my name is David. 0:11 I'm working at Microsoft as a program manager. 0:15 Working with the IE and Spartan team. 0:20 And you can follow me on Twitter if you like or tell me if I was good or 0:23 not on Twitter. 0:27 So, first of all. 0:28 [BLANK_AUDIO]. 0:31 So I'm using. 0:34 Okay, some disclaimers. 0:36 So maybe you can notice my beautiful accent, so I am French. 0:38 So, sorry for that. 0:42 I try to do my best and I cannot speak as fast as you guys. 0:44 So I also have different jokes, probably. 0:47 I'm from Microsoft, which is maybe a bit weird for you. 0:50 So I'm using a Windows PC, maybe the only one during this conference. 0:53 And I'm browsing the web using Internet Explorer and also the product Spartan. 0:57 And I am a developer which mean that I'm very bad in the beautiful things, 1:02 all the cool designs. 1:06 So I try to do my best. 1:07 Also that I'm working with some cool UX design and 3D artists. 1:09 So I'm going to talk about Babylon.js. 1:12 So Babylon.js, we start to work on this product with one of my best friend and 1:14 today my manager prob, almost two years ago, as a free 1:19 time during the weekend and the night, so my wife really love this project. 1:25 And, we start at an open it's a free and 1:30 open source product you can find on git hub using the Apache two license. 1:33 So it's very, you can do whatever you want to do with it. 1:37 We first start write, written it in JavaScript. 1:40 And then we switched to TypeScript I've managed to convince David, so 1:43 we have two Davids work, working on that to switch to TypeScript. 1:47 For various reasons, because it really rends quality of our code and 1:50 then we can switch to ECMAScript 6 in a very simple way, 1:53 because it can comply in ECMA Script 3, 5 or 6, without changing the code. 1:57 And TypeScript is basically a super set of ECMAScript six adding types. 2:01 So, it's really really [UNKNOWN] to learn ECMAScript. 2:06 So, our [UNKNOWN] have to be very simple to use so 2:11 I really enjoy the privilege to because we really share the same philosophy. 2:14 I'm not a 3D guru, you know, and my, oh, it was the other David, 2:17 well I think when he was born it was already knew about 3D and matrix, and 2:21 all the shaders, so it's, it's really awesome. 2:25 But I'm acting as a monkey when we are writing the firmware. 2:28 If I don't understand, I get that nobody will, okay? 2:31 So, this is the way we're writing the framework. 2:34 Still we need some hyper phones. 2:36 And really need to run it everywhere. 2:38 This is the web. 2:40 So I don't want to break anything just because it will run in IE or Chrome or 2:41 Firefox, I want the code to run everywhere. 2:45 So that's why we're making some choices. 2:47 So we added a lot of features in [UNKNOWN]. 2:50 When you're doing games or 3D stuff on, 2:51 in a general manner you're working with tools like Blender, which is free and 2:55 open source, 3D Studio Max which is not free at all, very expensive, 2:58 Unity, so we've been writing some exporter to dump the content to WebGL. 3:03 And we've add us also added some offline support using 3:08 IndexedDB which is a nightmare to work with. 3:11 And the idea is just to save all the assets 3:14 on the clients side to be able to have an offline experience. 3:17 Then we have also some collision and physics engine for the game, mainly. 3:20 And finally, we work on, as we will on the web, we will try to add some network 3:24 optimization by loading in an incremental way, all the assets. 3:27 For instance you are starting a game, let's say this room, 3:31 you don't want to load all the city. 3:33 You start to load first with this room, and when you are moving out the room we 3:36 start to load also the cards and stuff like that in a very smooth way. 3:40 So we'll show a lot of different things or [INAUDIBLE] I'll 3:44 talk about web audio because we're now going to web audio in IE. 3:47 And of course we add a lot of cool things like touch, gamepad, 3:52 I'm going to demonstrate to you Oculus. 3:55 I'm not sure it's very useful to you, using Oculus on the web, but we've got it. 3:57 And some virtual joysticks using touch. 4:01 So for handling touch we are to you know, pointer events, I don't know if you 4:04 follow the, all the information you got around point, pointer events, but 4:08 it's really useful, because it's a unique way to code with mouse, touch, and pencil. 4:13 So it has been brought Microsoft as a W3C standard. 4:18 But there was also the Touch 7 from, from apple, 4:21 no less, that add some difficulties to learn on, on as a start out. 4:24 And when we start writing the firmware, we saw that this model was really good 4:29 because it's from Microsoft, but we really thought it was a good model. 4:32 And we decided we like a poly field to be about to throw this model to 4:36 all other devices like Firefox OS, Android, using Touch 7. 4:39 For the ID you're coding, you're using pointer events, 4:44 we're going to propagate it to all devices. 4:47 So now a lot of people have written similar poly field like polymer, or 4:49 other poly fields, so it's pretty great to see that. 4:53 So we're using it in our project because we have written it two or three years ago. 4:56 So let's see some demonstration, of what we can do, so I need sound. 5:02 And I'm going in, in the broader, so this is our last demonstration. 5:10 [BLANK_AUDIO] 5:13 So I should have some sound when it will load. 5:16 [BLANK_AUDIO] 5:19 Hopefully it will load. 5:22 [BLANK_AUDIO] 5:24 And you know what, it doesn't load because my web server [UNKNOWN]. 5:30 So I'm going to relaunch it. 5:37 No panic. 5:38 What, no, this is a Microsoft guy, it won't work. 5:41 >> [LAUGH]. [LAUGH] 5:45 >> So it's building. 5:47 Okay, it's building. 5:47 So I'm going to take this mural in, just to be sure to have always 5:48 the same product. 5:54 And this is, something that is being built with Michel, which is, we are, 5:58 we are a bunch of French guys, so Michel is our Unix and 3D designer. 6:01 And he has built everything into 3D Studio Max with a, using a single line of code. 6:06 So, the IDs is completely alone building that. 6:11 So, you can move inside this scene, that is quite fun using mouse and, 6:14 and keyboard. 6:20 And we add some cool effects with one of our interns like the [UNKNOWN], you see. 6:20 Very fun. And it can be like that. 6:27 And for instance, we also add some interaction for the mouse. 6:29 You can click on that, so don't be afraid. 6:33 [SOUND] And this thing has been done without a line of code in JavaScript, 6:35 so we had what we named an action builder. 6:40 So it's going to connect some node inside 3D Studio Max, which is a web view, 6:43 because I want it to be portable on all platforms. 6:47 And what he's doing basically as a designer, is that when the user is going 6:50 to click on that, I just want to play the sound and launch this animation. 6:54 So there's one thing that we can also switch using a game pad camera. 6:58 For instance, using the game pad. 7:03 And in the transparent quick and then move around this beautiful house. 7:05 It's scary. 7:11 You can hear that we've got some 3D sound, meaning when I start to be near the window 7:13 I can hear theres something to do because there is a skeleton playing on the piano. 7:18 And finally we decide to create a sentry. 7:24 So, as we are in England there is endless. 7:28 [SOUND] He's dead. 7:31 I'm sorry for that. 7:32 >> [LAUGH]. 7:34 >> Clippy, which is a, a Microsoft product. 7:35 So let's check if the Schrodinger cat is dead or not. 7:38 Nobody really knows and I think he's dead. 7:42 And, finally, good news is IE6 is also dead. 7:45 So, if we click on it, [SOUND] we can see that we've got like, 7:49 Batman calling for help [LAUGH]. 7:53 So we see, we see the last instruction. 7:56 So you see Gamepad, APIs, WebGL, 7:59 where you'd use a lot of stuff with advanced graphics. 8:02 So it, it's awesome to have that in the product without any plug in and 8:05 fast performance. 8:08 But we also have the, the idea is to be able to run on every platform so 8:10 the idea was I've got obviously a Windows phone. 8:15 You know what a Windows phone is? 8:17 Have you ever seen a Windows phone? 8:19 >> [LAUGH] >> You've got some? 8:20 Check it. 8:25 It's really, it's really great. 8:25 So, whatever. 8:29 I'm going to relaunch the app. 8:29 Yes. 8:33 So just need to switch a little bit. 8:34 Like that, okay. 8:37 So I need to work on the responsive side. 8:38 Hello. 8:40 For instance I've learned [UNKNOWN] okay. 8:41 And the idea using, while you can, you can launch the same demo from your iPhone or 8:47 Android, so the idea was to be able to have the very same code, and it's complex 8:52 to have shaders and WebGL being about to run everywhere because this has not 8:56 the same power on the GPU side that my, my laptop for instance, or the big desktop. 9:01 So we've strived to build something that is going to adapt itself 9:06 based on the device you're going to run using some more or less complex shaders. 9:10 So I guess I'm not running the proper scene. 9:15 I don't know which one I've chosen, so let's go back. 9:21 [BLANK_AUDIO] 9:24 I want this one. 9:29 I'm going to reload. 9:31 [SOUND] So this one. 9:36 So not everything run perfectly fine because of the performance. 9:37 So normally this one should, should be fine. 9:41 [BLANK_AUDIO] 9:43 You can talk. 9:46 >> [LAUGH] >> While it's loading. 9:47 [LAUGH] So this is a Windows phone. 9:49 It doesn't have yet the next roaring engine of IE, so 9:52 we don't have web audio yet. 9:57 But, in the next update in Windows ten you will also have a [UNKNOWN] with you on 9:59 the phone which really cool. 10:03 So, now, I can move inside the scene, you see. 10:04 I got some very good performance. 10:06 So, it's a full HD screen. 10:08 I know that an iPhone six is about twice as fast as this one. 10:09 So, the idea is that I've built something called, 10:13 virtual realistic camera to let you move using your two [UNKNOWN]. 10:16 And it's real good, but I don't know why its independent of the age of people if 10:19 you're too old, nobody is able to use my virtual [INAUDIBLE], so I will be using my 10:25 son which is who is approximately 16 so he has no issues using it but 10:30 when I am giving the phone to old people so I don't know exactly the age. 10:35 Some other guy. 10:40 I'm completely lost. 10:40 I don't understand what's going on. 10:41 This is some crappy code and. 10:42 Well, just test this and, maybe I will be able to, to tell you your, 10:44 your specific age. 10:48 Well, welcome, you're young enough to be able to use, the phone. 10:49 So, you can test on your side on your iPhone, 10:52 Windows phone, or Android or Firefox or OS, it went everywhere. 10:55 So here are the features. 11:01 So there's a lot of features but lets restart the engine from the beginning. 11:03 Lets try to understand how to code that. 11:06 So, like the previous talk, 11:08 what I really like is not to spend to much time writing the commentation, 11:12 we are writing the commentation, but agree to help people to learning by. 11:16 Experimenting. 11:21 And we decided to, to trade for them in naming a playground. 11:22 So the idea is to share some code on the playground, and 11:25 let people experiment I, IPIs. 11:29 If it's written in TypeScript is very easy. 11:31 You're going to see too, we have some cool features. 11:34 Like auto-complete code. 11:36 So, let's have a look at that. 11:39 So let's check if the internet connection is working. 11:42 [SOUND] Okay it's working fine. 11:44 So we can see the code over there. 11:48 Don't know if it's big enough, so 11:49 I'm going to launch it in the web using, no no not that. 11:54 [BLANK_AUDIO] 12:00 And the code here is pretty simple, so we try to have some comments and you try to, 12:09 need to create a scene in the camera axis, several stuff like that. 12:14 Once you're reading the code, maybe you want to change the color. 12:18 So, you need to to know a little bit of 3D vocabulary for that. 12:20 So, for instance, I need to create a material. 12:24 Material is, in 3D, what's going to have an impact on way the object are looking. 12:27 So, for instance, yes I [UNKNOWN] done something is going to load, 12:32 you know, the IntelliSense. 12:36 What we name the IntelliSense autocomplete features. 12:38 And if I'm looking for the standout materials, then it's going to help me. 12:41 So it needs a name. 12:45 So sphere. 12:47 It needs a [INAUDIBLE]. 12:48 So [UNKNOWN]. 12:51 Once I've done that, I want to edit for instance, the diffuse color. 12:52 So you need to know a little bit about three D. 12:58 And fortunately to be able to use that. 13:00 So [UNKNOWN] main code basically. 13:03 So we've got the bench of predefined colors. 13:05 So for instance I really like purple. 13:08 That's why I've chosen purple for the [UNKNOWN]. 13:11 And once they found the matter all you need to effect it to the object itself. 13:16 And you see every time I'm typing, 13:23 we're trying to help you to understand what's going on. 13:25 Hm? And, what's, you can run that, 13:28 you can save it, it's going to generate, a specific hero to share on the forum, 13:30 on us. 13:35 This is a way we are spending our time debugging the problem we had. 13:35 So we asked the user, please do it on the. 13:39 And play around, send us the URL and we'll have a look to your code and fix it, or 13:41 fix our code, because sometimes we have bugs I must admit in our code. 13:46 So you can play like that. 13:50 You can create for 13:52 instance several other things like you want to create a cube for instance. 13:53 Then you need to have some basic properties so meshes. 13:58 So a mesh is a 3D object and I'm going to create a box and 14:03 name it box one, a size of two inside the current scene. 14:07 And once I've done that you'll note they are on the wrong way so 14:15 maybe I need to move the position. 14:19 Position, so, I need to move on the X and that equal to. 14:22 And now, it's another way. 14:28 Very simple to use and 14:29 you can see I can already move in the scene using my mouse and keyboard. 14:30 You've got nothing to do. 14:34 We are taking charge of all the inputs. 14:35 So, this is a way to to build something. 14:37 So, if you really want to affirm, you can use only cube and do some. 14:39 Furnishing. 14:44 So, like this project. 14:44 So, a couple of minutes later, 14:46 I don't have this magic scene to, to write [UNKNOWN]. 14:49 And then you can move inside, a maze. 14:53 So it remind me the, the all good, [UNKNOWN] of doom and, you know. 14:57 And the idea if I'm, I'm currently moving inside a. 15:03 A 3D QR code. 15:07 So I, I had the idea to transform a 2D QR code in a 3D one. 15:10 And if you got a smartphone, if you flashing it, 15:14 it read QR code is going to say that jQuery works, err, rocks, rocks. 15:16 And the idea was to do something for you know, the valentine date. 15:21 So it was a present for my wife. 15:26 I pretend it was made for her only. 15:28 But I've published the code so it's for everybody. 15:30 >> [LAUGH] >> I'm sorry my dear if you 15:33 are listening to me. 15:36 So you can flash it and it will work. 15:37 So if we're, if you look at the code, it, it's fairly basic so I, 15:40 I've done the, a blog on that so you, I can, you can read on my blog. 15:45 And I basically create, creating a lot of cube by just following the, 15:49 the trickle that has been generated. 15:54 And the, it has been gener, generated at the end, I guess. 15:56 Query. You see 16:01 that I'm currently building whatever I want as a trick will be a, a 3D maze. 16:04 It's quite fun. 16:10 Well, I find, I think it's fine. 16:11 Well. >> [LAUGH]. 16:13 So, now, when you're working with 3D artists, 16:17 they don't want to work with API's. 16:19 They want to use [UNKNOWN] tools and they want to do something like that. 16:21 So, I cannot be able to do something like that using only cubes. 16:25 So, the idea is Michelle starts putting his idea on piece of paper. 16:30 So, you want it to have something like that with some frog sounds. 16:34 And this is not because we are French [INAUDIBLE] And some values sound. 16:38 And start to think about that. 16:44 At the beginning we wanted to create the inside the house but 16:45 we have not enough time to finish the interior part. 16:50 And it tried to browse a web and find that this one was really great so 16:55 we wanted to create something similar and 16:59 finally went inside 3D Studio Max because is got the license. 17:00 I don't have it. 17:04 And it starts creating the magic inside 3D Studio Max and 17:05 exporting it into Web [UNKNOWN] and, and it's own engine. 17:08 So this is all we created. 17:11 So the Pipeline is basically to use your fiery tool as a 3D artist so 17:13 you could be free to use your marks in Maya, Blender which is free so 17:18 we have written a bite on export, and Unity which is our last one. 17:21 Not completely finished but I'm going to give you a demo. 17:26 I'm going to turn our version five format, 17:30 which is documented on our gated, which is the .babylon5. 17:33 And once, once you've done that, the idea is to be very simple to see, so 17:37 you can drag and drop that into our Sandbox. 17:41 I'm going to show you or use your favorite editor to, to load it. 17:44 So. 17:48 For instance lets launch unity. 17:52 So unity, you've got a lot of different tools. 17:54 It's very simple to use. 17:56 I'm not a good guy using the, the [UNKNOWN], to be honest. 17:58 But this one is very simple to use. 18:02 So you can zoom. 18:04 You can do whatever you'd like. 18:05 Here, put some light with shadows. 18:06 And once you finish that we insert over there. 18:08 And you .babylonGS menu to help you to export that using this specific part. 18:12 Your going to export using your button. 18:21 And we're going to convert everything using some WebGS convert files. 18:23 So lets do it together. 18:28 So lets put that on the desktop. 18:31 [INAUDIBLE] SF for 18:33 San Francisco because it is supposed to be some San Francisco buildings so 18:37 going to run through all the textures maybe convert them because 18:41 using you don't have support for PSD so going to convert in. 18:46 PNG for instance, and 18:51 once you have finished it tell you everything is, is being done. 18:52 You need to go over there, so it was on the desktop. 18:57 You see all the file, 19:02 and as a designer Michelle didn't want to write any JavaScript line of code, so. 19:07 We work on a tool frame. 19:12 The idea is to take this tool, which is online, and you take the file, and 19:15 we're using the beauty of HTML file drag and drop API drag and drop. 19:20 And it loaded. 19:25 So it's very simple. 19:26 I cannot do more simple than that, even if Michelle is already complaining. 19:27 It's, well you know maybe you could do a simpler, simpler version, 19:31 so I, I can't do. 19:34 Simpler than, simpler than that. 19:35 3D artists are very complex to work with you can trust me. 19:37 >> [LAUGH]. 19:40 >> And then you see you've got some real time shadows and 19:41 you can even add some things like a [UNKNOWN] layout, 19:45 start reviewing everything and maybe choose to have a look to all the meshes. 19:49 So for instance I can remove one of the [UNKNOWN]. 19:54 No. 19:59 Yeah, can we move the plane if I want? 20:01 Okay. 20:02 Can we move everything? 20:04 Yeah, this one. 20:05 Okay. 20:06 You can debug that in real time and 20:06 it will shun the [UNKNOWN] which is quite good because this is a very simple thing. 20:08 So this is a way you're going to build stuff. 20:13 I've got all the great sample like so you can split over with this kinda tools. 20:15 So as we don't have ours apparently. 20:20 And so I'm going to append palace. 20:23 This one is really great so it's, it's a bit longer to convert it. 20:31 So I've already converted using the same process. 20:34 So it's over there, it's the eventual file. 20:37 And you then take it and drag and drop it in the right window. 20:41 It's going to reload it. 20:44 And then you can see you've got some nice trees. 20:45 You got some, we see the cool free assets on the Unity store. 20:51 So you can lots of different assets from Unity store, bring it in Unity and 20:54 export it in WebGL to, to export your, your art on the web. 20:59 And it's going of course, well I've have not done the, 21:03 the demo, but trust me it work on every browser. 21:07 [BLANK_AUDIO] 21:11 I can do the very something. 21:16 Just because maybe you, 21:17 you think I know the Microsoft guys it's going to work on the IE. 21:19 No, oh, it also work in Chrome. 21:25 Also work in Chrome [LAUGH]. 21:27 >> [LAUGH] >> And it also work in Safari and Firefox. 21:33 You can trust me. 21:37 You can test it. 21:38 So very simple to use. 21:39 So, a couple of hours later, what you can do is you can is you can even take 21:40 the very same thing we will be using the beginning. 21:44 You can see that a lot of files, some MP3 files. 21:48 And Michel is best, because if you do everything inside 3-D Studio Max and 21:51 I've done that to test. 21:56 It's going to reload the same, 21:58 scene at the beginning with the sound and all the action. 22:00 So it's, everything has been described into our js file. 22:04 You know that to let the 3D artist doing a lot of stuff without cutting anything. 22:09 [SOUND]. 22:13 [BLANK_AUDIO] 22:18 So let's talk about audio as being implemented recently a web audio stack 22:23 inside Babylon.js, still trying to be very simple to use. 22:28 So you have some ambiance audio. 22:32 You've got some omnidirectional 3D sound, all directional sound. 22:34 And we're using some attenuation. 22:39 So those algorithm provided by web audio. 22:42 And you can add a bridge the sound by managing or 22:45 building using our exporter format like we've seen with the motion demo. 22:47 This is currently only supported by our 3D Studio Max exporter. 22:52 But we are currently writing the Blender and 22:56 Unity part to have the exporter everywhere. 22:59 So, let's do some brief demonstration on how it works. 23:02 And of course, I'm going to use our playground for that. 23:05 And the internet connection seems to work pretty well. 23:11 So you can see this is very simple, all you got to do is to create a sound. 23:14 Give it a WAV or MP3 file or 23:19 Au file depend on what what your browser, browser is, is reporting. 23:21 And then you can listen for the mouse down and do some play. 23:25 And its funny to map it to the space key while your tapping some code. 23:29 For instance because if I, [SOUND] you know, [SOUND]. 23:33 Yeah, I thought it was funny to write code in to have gunshots when I press into 23:37 the space bar. 23:41 But I'm not sure its a good idea. 23:42 And then you can of course still have the auto completion part. 23:44 To help you doing. 23:49 So it tell me I can play specific time if I want to. 23:50 So let's say 0.5 sec, second, 23:52 and another one at 0.3. 23:58 And now if I run the gun, the gun again. 24:01 If I'm left clicking, I can, I can do this, this very simple thing. 24:05 So it's very simple to use. 24:09 And once you done that maybe you want to have some special sound. 24:11 So, special sound is done automatically by wayward you and Babylon, yes? 24:15 We are updating the position of the camera for you so 24:20 you have nothing else to to do rather than crafting that 3D sound. 24:23 Saying where it should leave so, you know, in x, y, z. 24:26 And then everything is going to abate by itself. 24:29 So, to [UNKNOWN] trace that to do that I've create some sphere where all 24:32 the sound was on leave so. 24:37 And I've composed the music just to not have any problem with the IP or whatever. 24:38 [MUSIC] 24:43 When I'm going in inside a sphere, I can hear, you know, the, the sound. 24:45 [MUSIC] 24:49 And as soon, as soon as I leave the sphere, it stops. 24:50 Because it's being done automatically by wayward you. 24:54 We're using the 3D sound and 24:56 we've done in Babylon is just updating the position of the camera. 24:58 And automatically you know that the sound has to be shut down. 25:01 And the, something else to [UNKNOWN] is to create, 25:05 an analyzer to re-check that, sorry, it's note down. 25:10 So, and to see the, the graph. 25:16 [BLANK_AUDIO] 25:17 So I need to add a scene. 25:21 And this analyzer has to be connected to our audio engine. 25:24 So which is static, automated static for this positive logic. 25:28 And then I've got some function that's connected to my analyzer and 25:34 are going to better understand what it's going to do. 25:39 Oops. [BLANK_AUDIO] 25:41 And now, I'm going to ask to my analyzer to show 25:46 [BLANK_AUDIO] 25:50 The debug canvas. 25:53 Going to run it. 25:54 And now the debug canvas is just sorta showing you, you know, 25:57 a graph of this sound. 25:59 Because the, the beauty of We, Web Audio is you've got access to, 26:00 to the real sound. 26:04 You can do everything you want with it. 26:05 So if you want, for instance, 26:07 to create a 3D analyzer with that, it's very simple to do it. 26:08 And you can, I've got plenty of ID using that. 26:15 For instance I want to build a physics things with audio it could be very fun. 26:18 And I see that we've got three minutes left so 26:24 I'm going to show you the way to load some code. 26:26 Using loading something using code. 26:31 So up to now, I've show you how to load a scene by drag and dropping. 26:36 But if you want to do it by code, this is a simple line of code. 26:39 This is this one. 26:43 Which is asynchronous. 26:44 And once it's loaded you can then do whatever you want in the scene. 26:45 So start to interact with your own code. 26:49 Which is a way to create a game. 26:51 Because games now static-fied, you need to have some, some interactivity inside that. 26:52 So, let's launch VSim, and you will understand what the code is doing. 26:57 [BLANK_AUDIO] 27:02 So, we see another beautiful 3D scene built by Michelle. 27:13 My lovely 3D artist. 27:18 So I can move inside the scene. 27:20 You see we've got the collision engine. 27:22 Which is well, maybe of use for 27:24 you but it's quite complex sometimes to, to check that in real time. 27:26 So we're doing for you. 27:29 And what I've done is adding some physics, 27:31 scenes inside the scenes by pressing the S key. 27:34 You see I've got a lot of both. 27:37 And I've got some bug performance for an unknown reason. 27:39 So I'm going to launch it in Chrome. 27:45 >> [LAUGH]. 27:50 >> It works fine in IE, but I guess this is an alpha [INAUDIBLE]. 27:52 And you see it's, why is [UNKNOWN]. 27:58 So it's very fun you can add a lot of, of things. 28:01 And then you can throw the ball away or the boxes inside a 3D scene. 28:04 So very fun to, to do it. 28:09 And we're currently working on optimizing the performance using 28:10 latest stuff like SMGS or stuff like that. 28:15 That could really help to do some recomputation, and client side. 28:18 So you can see what you can do, using pure JavaScript and, and WebGL and 28:22 it run everywhere on every browser, so it is pretty fun. 28:26 So, the last part is a debug layer. 28:33 So, is very complex sometime to know where you're losing some time. 28:35 So, we build something to if your GPU [UNKNOWN] 28:40 that the GPU is not powerful enough. 28:43 Is it a problem linked to your cpu? 28:45 So, in on the JavaScript side. 28:46 So we are using User Mark with is something we got in IE. 28:49 So let's hope it will work. 28:52 See when I close of course the one window. 28:53 So let's check if it works fine online. 28:59 Let's launch these specific things. 29:02 This is an engine built by Michelle again. 29:06 And, if I'm pressing F12, I can profile the, the, the graphics parts. 29:09 But I can also add what we are naming some user mark over there. 29:15 You see? 29:19 So generate some rhythm mark in your code. 29:20 So inside our lab, library framework, 29:23 we're going to generate some specific marks. 29:25 And once I've done that, I can ask IE to profile my code. 29:28 I'm going to stop, going to collect the data. 29:34 And you will have a visual through, throughput of the F, FPS, 29:39 you can zoom on the specific part to try to understand what going on. 29:42 But there is a lot of single link to the browser itself that I'm not interested in. 29:46 So I only want to, to take the, the things linked to my code. 29:50 And now the great thing is we've, 29:54 we've tried to implement a lot of different things inside our library. 29:56 Which is, we are beginning to render our thing, 30:00 then we, beginning to render things linked to the camera. 30:02 We start to evaluate something linked to the 3D object. 30:05 And we can see that some parts of our code could be quicker than other parts. 30:09 And we have the possibility now to enhance this part in our library. 30:14 Because we are emitting some specific, how to say, 30:19 user mark that are going to be taken by the product. 30:24 So this is something that is being described in the [UNKNOWN]. 30:27 I guess we are one of the first products to have it. 30:30 But it's really helpful to analyze the [UNKNOWN] using that. 30:33 So you can implement that in your own library if you want, 30:37 just need to edit some specific user mark. 30:39 [BLANK_AUDIO] 30:41 So if you want to see what we are working on in Internet Explorer you've got 30:48 status.modern.ie you can see what's we going. 30:52 So [UNKNOWN] work on the Web Audio, 30:55 Media Capture a lot of feature around ECMAScript six. 30:57 And you will see all the features that you love that you. 31:00 Maybe you will check that we currently developing them. 31:03 We currently evaluating them. 31:05 Or we currently, well we are not interesting in them. 31:07 So you can then send me on Twitter, please add this feature in IE. 31:10 And I'll try to convince the, the product team to do so. 31:13 You can download some VMs on your Macintosh. 31:16 To test IE, and then if you want to play with, our framework, 31:19 this is a free framework. 31:23 You can go on babylonjs.com, play with our playground. 31:24 Or ask question to we're two, mainly two developer working on the framework. 31:27 So, myself and David Ketchu, 31:31 which is, named deltakosh because he's a big fan of Babylon Five. 31:33 That's why the, the framework is being named Babylon. 31:37 Do we have any questions? 31:41 No. 31:43 No you don't have any questions? 31:45 >> [LAUGH]. 31:46 >> You don't have time for questions. 31:47 Thank you. 31:49 [APPLAUSE] 31:49 [MUSIC] 31:55