Threejs Shader Baker

Hi all at this great community.
Just noticed this has not been made public here yet and wanted to share it as I found it very useful.

Shader Baker lets you export your Three.js shaders or materials as textures. This is useful when you want to use the same shader in other 3D software like Blender, Unity, etc. You can also use the exported textures in other Three.js shaders/materials to save on performance.

It supports both Vanilla and React

Author is Faraz Shaikh (not me!, I’m just posting it)
Github repo: GitHub - FarazzShaikh/three-shader-baker: Bake your Three.js shaders or materials into textures!
Demo: three-shader-baker | Example

6 Likes

Thanks for sharing this one.
this is very useful. Nice.

1 Like

Thanks for making and sharing this!

How does the UV Mapping work with the texture baking?

Also, what are your thoughts on partially baking underlying textures like Voronoi but leaving other parts like dynamic lighting dynamic?

1 Like

Very useful like lightprobes. Now we can save texture of raytracing? And we can bake material with normal, shadows, postprocessin AO and 16 lights. Or baking lightmaps and then remove scene lights

1 Like

Precisely, lightprobes is something I had already been testing, so it will be my first mission in the immediate future, I will try to share results here if I come up with something useful.

Oh, I didn’t see that coming, I’d have to try that too. Although I have my doubts

Yep, almost everything. The only thing that is not yet possible are reflections and those kinds of phenomena that depend on the position of the observer. Render-to-texture can’t bake that

Yes, also. Although in my experience (and in fact, learning from your wise advice on similar topics) to make this scalable it would be best to manage a pool of FBOs, in case you don’t want to remove them but to shut them down.

1 Like

I saw many examples of lightprobe here with interpolations, but not finished.

Sorry to disapoint you but this time -as stated- I am not the creator of this, just posting it :wink:

Actually the model need to have a UV channel for this to work. If not at import you could generate it on the fly, but UV is required to map data to a 2d representation. If you inspect the original glb you’ll notice there is no textures previously stored within it, but 2 UV channels, one of each piece of cloth.

Totally doable, in fact that is exactly what the demo is depicting, lights are out of the mix (can be changed), while voronoi textures being baked. This can be adapted to any texture slot you may find interesting in your shaders, not only diffuse (base) map, but also roughness / metallic as well as alpha or occlusion… some of them could be dynamically changed while keeping the others untouched.

1 Like