How to get 16bit normal map in PlayCanvas (smooth low poly mesh)

Looking close up on the 16 bit normal map, it looks like the banding is gone on the sphere area:

Compared to 8 bit:

But not sure why the nozzle is still like it is on the model:

But looking on Apple Preview, the 16 bit png also has these streaks

@mdesign

Have I got the right normal map?

1 Like

I suspect this issue is more related to the way tangent space is used / normal maps generated for it, see more here

1 Like

Added a 16 bit texture format check first and automatically use 8bit if only that’s supported

Link https://playcanvas.com/project/1017976/overview/f-8bit-normal-map-vs-16bit

1 Like

So, is that all matter of that script? : test16bitNormal.js

Looks brilliant. All bandings are gone. This model is not perfect but the difference is visible.
Thanks a lot for that.

1 Like

The logic is all in that script but you will need to take that logic and apply it specifically for your project. This also includes freeing up textures when needed too.

It’s possible to write a generic script that will take 16 bit png.bin s and apply it to multiple materials and auto clean up when the script is destroyed.

Would that work for you?

1 Like

Would that work for you?

I need to understand it better to answer that question.
Thanks.

I’ve updated the project to have a more generic script that has an array of mappings of the 16 bit PNG binary to material assets to apply to.

It handles loading the PNG binary and material assets if they aren’t loaded yet and will destroy the textures when the script is destroyed.

It’s all in the folder: 16bit PNG Normal Loader

And the setup is pretty straightforward. Change your png filenames from .png to .png.bin so they are uploaded as a binary.

Add the script to an Entity somewhere and map the binary to the materials that it should be applied to:

Some considerations:

These textures are uncompressed so will use a good chunk of VRAM pending on the dimensions.

There is some cost when the script initialises to create the textures, load the PNG data etc. You may need to take this into consideration when it comes to loading times.

2 Likes

Thanks a lot. I will use that for sure. Some complex jewellery stuff also will benefit from that. Thanks a lot for your hard work and for being so helpful.

Cheers!!!