In this example the normal map has been made oversized to be sure that the fault doesn’t lie there. I have tried a load of different sprites + normal maps and this is always a problem.
Does anyone have any idea how to fix this ugly outline?
I feel like I must be missing something fundamental as everything has this outline when using 2D lighting and it looks generally bad.
Are you sure your circles are the same size? At least by the upload, they look a little different. The normal is pixelated while the circle seems smoothed/feathered, and that difference may mean that your normal isn’t actually covering the very edge of your albedo circle. So that means what you have is green adjacent to the default normal blueish-purple, which may account for that line appearing.
That normal map isn’t the best, just one I grabbed from an example. I made the circle sprite with the same image dimensions as the normal but a bit of extra padding (so the circle is a bit smaller than the circle in the normal), I did this to make sure that none of the pixelated edge was being used and to be doubly sure that the normal was big enough to cover the edge of the circle completely. I tried other things as well.
After poking around in the code I found the file ‘NormalsRenderingShared.hlsl’ which contains the line:
normalColor.a = color.a; // used for blending
If I replace that line with:
normalColor.a = 1;
Then the outline goes away but now there are issues when I have two sprites overlapping.
So I guess the outline is caused by the semi-transparent pixels around the edge of the sprite, the normals get blended on these pixels.
Here the image and the normal map are exactly the same size and I still get the outline.
The code change I mentioned above doesn’t effect this case at all, I guess because the sprite has no transparent pixels? Not sure then what is causing this.
As you can see there is also some strange artifacting on the top edge of the block, this changes as I move the light around and is only visible when the top edge is partially shaded. This only happens on the top edge, I have no idea what is causing this.
Is there something wrong with how the normal has been constructed?
I can upload a test project if needed.
Any help would be much appreciated. I’m running out of time to get a proof of concept working using unity 2D lighting.
I looked at the circle, and there does appear to be something strange happening. I’ll have to spend some more time on it. I’m not sure if it will be ready for your proof of concept.
For the rectangle, try setting the wrap mode to clamp or adding a border of transparent pixels. I think this is a sampling artifact.
