Jump to content

Intergrading GLSL Shader


Recommended Posts

Hi, I'm learning BJS and very exciting with Post Process effects. We have some standard samples from site. I'm also looking for some GLSL filter effect for Camera (film grain, toon, etc). But I wonder how to intergrade a custom GLSL effect (free code from google).

This effect here:


Can anybody give a some points ?  


Link to comment
Share on other sites

Hiya T!  If you please... take a look at our C.Y.O.S.  (create your own shader) app... http://www.babylonjs.com/cyos/

Choose cell shading and maybe torus knot.  A little "cartoon flavor" there, eh?  (take notice of the ZIP option at CYOS, which will put CYOS shader code into ShadersStore FOR you... and give you an example of how it's done.

More about cell-shading at... https://www.eternalcoding.com/?p=113

Shaders are used in many places within BabylonJS, and http://doc.babylonjs.com/tutorials/How_to_use_Procedural_Textures is an interesting tutorial, as well.  It shows how to use the Babylon ShadersStore to store shaders, and/or use DOM <script> elements to store shaders, and/or disk-based files.

A playground search for 'shadersStore' returns quite a nice harvest.  http://doc.babylonjs.com/playground?q=shadersStore

Another interesting forum search might be 'shaderBuilder', a sophisticated shader assembler... built by @NasimiAsl... who is a God of shaders.  :)  ShaderBuilder does not prevent you from needing to learn shader code, but it makes "wrangling" shaders much easier, AFTER you know how to code shaders.  :)  It avoids big strings, and many other hassles of shader coding... but you still need to know what you are doing. 

I'm REAL new at shaderBuilder, and not very experienced at ANYTHING, really.  heh.

Anyway, I thought I would pass-along what little I knew, regarding your questions.  Hope this helps.  Stay in touch, and be well.

Link to comment
Share on other sites

hi @Wingnut, I don't need only Toon Shader but also Film Grain and some "cinematic look" postprocess shaders for my company long term projects. It's seem that GLSL code that I search different with any GLSL code from BJS examples (good news: I already succeed intergrated Dot Screen Shader from ThreeJS to my BAbylonJS project, I gonna try more ) 

Oh, I will give Shader Builder a try, too.

Thank you.

Link to comment
Share on other sites

Hi again, T.  Yes, I was trying to cover the "integrate" part of your question.  Some of the "difference" you are seeing with shader source codes... might be GLSL vs. HLSL.  Google search returns much talk on that subject.

Now, as for FINDING these cool shader effects and their sources, I have not seen any demos, here, using film-grain/cinematic effects.  But, my memory isn't all that accurate.

Have you visited ShaderToy?  I see a few "grain"-related shaders, there, but they might need converting.  In the Google search above, I saw a video listed... How to turn a shadertoy.com pixel shader into working HLSL

I didn't watch it... but maybe that will also be helpful.  Another Google search produced some results... and I visited the second link.  At the bottom of that linked page, the author includes some GLSL shaders.  (v1.1. of that, is here)

I wish I could be more helpful.  Perhaps others will comment... those who know more about the subject.  :)  cya later.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...