Building An Environment in Babylon (from Unity) any best practices

Hello everyone! I hope you are all doing very well and your own projects are getting better and better.

After my previous work - which was like an introduction to Babylon JS - I have to say I was well impressed and I really do think this has a bright future.

Why download when you can just click on a link?

I have now been looking at a project I have been working on in Unity and I’m in the mode to port over (and add to a scene) that I have been building. Essentially it’s a semi Victorian/ steam punk lab initially - with a view to fill it full of particle effects and the odd game element in there too (shooting ghosts with an ectogun). I’m thinking a version of this Fontelroy (Igor) character would be in there.

So what am I posting this here for? I’ve looked about some and I know there is the very cool Sponza demo and Assassins Creed demo (to name a few). I am likely going to have questions on this as I go.

For instance @Wingnut did mention a Unity to Babylon plugin before - I am sure there will be questions on that.

And questions about Ambient Occlusion.

And a hundred different things.

Firstly what I am wondering is if there are any interesting guides for the Unity Toolkit or the best way to build these environments in Babylon - so it is as cheap as possible. I know Unity has draw calls - so for a lack of a better way of putting it - I’d like to lower the amount of drawcalls used (terminology may be wrong for babylon).

Are there any playgrounds / blogs on this currently? I did a look a while back but nothing too comprehensive stood out. That’s not to say it isn’t there.

Anyways thank you for reading and thank you in advance for putting up with this forum thread.


Let me add @MackeyK24 who is the mind behind

1 Like

Game looks great!

I’ve been using the toolkit for the last week and a half, when the toolkit exports a scene it packages it in a json format .babylon file, those contain all the model / scene information from there the engine reads in those params to build the scene.

I do have one question for the author about how many verticies a mesh should have but in general you want to statically batch / combine out your environment meshes as much as possible for game development in general, to cut down your draw calls this is just general practice.

The current process I’m using is no dynamic lighting / lighting in general all baked, vertex shading, static meshes and combined into one, culling any unseen faces, lowering face count where I can, very little colliders and when possible box colliders (Might switch this out to a navmesh for player movement), SVG / Vector graphics (no textures).

Can I also ask why you’re choosing Babylon? Unity has a WebGL and Wasm exporter. The only reason I’m using Babylon is because of the iOS browser is a B****.

1 Like

@Deltakosh - thank you! Let’s see what I can do! I’m sure interested in this toolkit.

@i73 - thank you too, especially for the information and question.

Do you use this mainly in the babylon editor? I haven’t even been at it yet - more the playgrounds.

In fairness I’m trying to keep the meshes down as low as possible. I’ve seen some more organic / mechanical shapes are somewhat more. I’ll get back with a couple of examples soon but I know I had lowered them some. Chances are I could do it more. The UV packing is shoddy too on my model. I am redoing them and packing more textures into each element. Not doing any special rgb tricks (yet) via writing shaders but maybe I’ll get there.

Do static instances carry over? For example if I have like 8 static crates in the scene will it only draw one (not including shadows)? This would affect how much I’d pack together.

Do you have any examples of your work i73 - I’d be grateful to see what you are at. Understandable if you cannot share. Interested in your talk about SVG/ Vector graphics instead of textures.

I’m using babylon instead of a general export because I’ve noticed a direct WebGL to iOS and explorer is woeful. I haven’t looked at Wasm. But I’ve been looking around at this and I think it’s got a good future - I do though think I have to be smarter about all those elements you mentioned. So it’s also an exercise for me to improve.

And the other reason I want to use babylon is about people too - they don;t want to click too much - they want to open a webpage and have their experience load there - quickly. I honestly see a future in it and I want to see how far I can push it :).

Yeah same for me, Apple does what it can to lock in their users. Not a fan that it’s 2019 and they still can’t support WebGL on their browsers, guess it’s the first Trillion dollar company for a reason.

As for the instances I might be wrong about this but it looks like static instances (prefabs) are not used like they are in Unity (Using the same vertex / vertecie data) it still has to toss the geo into an array for the mesh, you in reality you’re still getting the duplicated data from what I see:

and for the static instances that you refer to (only drawing one) is not entirely accurate, the scene renderer (And this applies to any render engine) still needs to draw the geo so a pass is done to calculate triangles along a scene and what I think you mean to say is draw call passes and I’d imaging if your meshes are in the same vert array then yes you will have one draw call for that mesh (there is a array buffer that’s passed to the renderer of all the coordnates of where a mesh face will be) that’s what a draw call represents, usually you want to pass as little as you can because that’s where the bottleneck is, in passing arrays of vert data.

I can’t share unfortunatly and all that I have right now is getting the backend to the state where it’s easy to interface unity with (implementing GUI, handling events, etc) for the Unity Toolkit exporter you can’t export SVG’s nativly as it only handles textures but on my current branch of the toolkit I have extended it to export svg, but if I don’t release it all you have to do is add the SVG to your Export\scenes and update the controller.babylon to .png / .jpg to svg. but really I’m also not doing anything with UV’s it’s all vertex shading.

Let me know if you have any other questions,

Hey guys… If i can throw my two cents in. First off… I love Unity Editor and I really love WASM… especially AMMO.JS WASM. But i am not a big fan of using WASM to build the WHOLE game project. Its basically like Assembly for the browser. Note… I hate raw JavaScript… But when you put BabylonJS Pure (Lightweight) JavaScript Engine With TypeScript And the power of Unity Editor… Oh boy… I can do so much kool shit … quickly and easily and use the same style Game Mechanics as you would when coding a native Unity Game Project :slight_smile:

Unity has a Max 65535 Max Vertices for ANY AND ALL meshes … even terrain meshes… So you really gotta break things down to less than 65535 … The toolkit handles this… Even When combining meshes for performance… Unity still has the 65K limit… Not Babylon.

Unfortunately, i did not really know about the internal mesh instance support from a Babylon Scene file. So yes… The Classic Version export separate meshes… No Real Instances… Sorry :frowning:

The newer upcoming GLTF Version of my new toolkit does support Full Mesh Instances

And Bro… If you got SVG working… Please send me the mods (or show me) and i will drop SVG support into Toolkit :slight_smile: