Custom Shader with Babylon Toolkit for Unity


I’ve been exploring the Unity toolkit pipeline for BabylonJS. I’ve got builds working but I cannot figure out how to create a custom shader. I’m trying to create a custom splatmap shader and have no idea what I’m doing wrong.

I tried to follow the WaterMaterial example here (Shader Materials - Babylon.js Documentation) but I couldn’t get this to work. When creating a Shader Controller I get the following errors:

error TS2551: Property 'WaterMaterial' does not exist on type 'typeof BABYLON'. Did you mean 'ShaderMaterial'?
error TS2339: Property 'initializeInstance' does not exist on type 'WaterMaterialController'.
error TS2339: Property 'getScene' does not exist on type 'WaterMaterialController'.

I’m guessing that I have to import the Water shader separately, but I have no idea how that works in a Unity Toolkit project.

  • What are the steps to setup a new shader inside Unity?
  • Is the shader converted to WebGL automatically or do you have to make the WebGL version separately?
  • Is the WebGL version added to the Unity project, or is it manually added to the HTML afterwards?

I’ve got a lot of questions so any help or tips would be appreciated.


Pinging @MackeyK24

1 Like

Just as a side note, the Unity Toolkit is a 3rd party project not maintained by Babylonjs core team. Its author (Mackey) is MIA so we don’t know if he will be able to help you

1 Like

Good looking out ya’ll! Much appreciated.

I think if I can figure out this shader issue, this pipeline should be able to meet all of my needs at least for this project. It’s a shame the Unity Toolkit isn’t official because it’s really well done and only took me about a day of tinkering with it to get a good feel for it. There’s a lot of good documentation but a few details are really vague - possibly expecting that you’re already experienced with native Babylon dev. I’ll keep digging and hopefully I come across something that helps.

Thanks again!

I guess the project is looking for a new dad or mom so if you are motivated :slight_smile:

1 Like

I been busy moving to new house. I also didn’t notice we moved to a new forum. But I’m still around.

I am looking for folks to actually help contribute on the Babylon.js coding and shader side of things.

My development kinda stalled because I couldn’t get any help with some game math in Babylon. It was a crucial part to my custom animation state machine… which in turn was the main thing for developing the kind of game mechanics I invisioned for Toolkit development.

I actually been working on my next exporter utilizing GLTF with Unity Metadata. So far is pretty sweet, especially my new Unity to GLTF animation export system supporting Generic, Humanoid Avatar nd blend shape animations. But I’m still gonna have the same 2D Blend Tree problems I had with old system so I still need help with Babylon game math for calculating Polar space input weights for real Blend tree animation support.

So I am begging anyone who would like to see the toolkit usage to its fullest extent… please work with me to make the toolkit totally awesome :clap:


To answer this question… you actually create Babylon material subclass … that really specifies what shader .fx files to load.

The part that gets attached in unity… a unity shader specifies what I call a Shader Controller… the Babylon toolkit material unitypackage actually does this for the external materials like water and fire… you can use this as guide to making your own… I think the material package is in same area you download the toolkit from.

If still interested in this I can show you in more detail… maybe we can screen share like gotomeeting… contact me and we can setup something

1 Like

FYI… the Babylon.Material class and the way you subclass as well as some API changes in the newer Babylon release may have broken the shader controller system… I’m gonna try this weekend and bring the toolkit up to date using latest builds… I will also create updated external materials like water and other material library stuff

1 Like

Hello @MackeyK24! I appreciate the work you’ve put into the Toolkit so far. I first tried the Babylon editor, but I’m more comfortable with the Unity IDE so it made it easier to get into a groove with it. Also, thanks for your response.

I didn’t come across the “Babylon Material Library.unitypackage” until you pointed out that it existed (Exporters/Unity/EditorToolkit/Content at master · BabylonJS/Exporters · GitHub ). That may in fact be helpful in figuring out the flow of creating a importing your own shader. I’ll take a look when I have time to take another stab at it.

I’m glad that you’re working on animation stuff, I saw a mecanim demo that you posted. If I can figure out how to do some basic animation and custom shaders then that’s enough to validate the Toolkit for a pipeline. I’m not sure if you’ve integrated that animation stuff yet but I don’t think I’m skilled enough with polar math to help out, haha! I’m down to help explain people how to use this thing though.

Also Mackey, I saw a post where you weren’t sure what value there was to making a short “getting started” tutorial video. That video was immensely valuable as I couldn’t figure out how to setup my node paths and stuff. There’s a lot that may seem obvious to you but aren’t clear enough for people like me trying to jump in. More videos if possible! :wink: Literally the only other resource I could find was this guy’s stream of creating a project (YouTube). So it would be useful to have more detail with setting up, doing basic things like interaction, UI, and shaders.

Keep in mind I haven’t done any development with Babylon before, only use three.js back in the day.

Anyway, I’ll take a look at the package and come crying if I still can’t figure it out. If I can figure it out though, I’ll make a tutorial. Thanks!