poke1024 / tove2d

Animated vector graphics for LÖVE.
Other
171 stars 8 forks source link

"Best" quality texture still has some banding #19

Closed pdesaulniers closed 5 years ago

pdesaulniers commented 5 years ago

Related to https://github.com/poke1024/tove2d/issues/16

(I know that the README mentions that we shouldn't expect TÖVE to produce print quality vector renderings, but still, I figured it costs nothing to ask):

In the gradients demo, the "tex best" still has some visible banding when zoomed in.

Could there be an even higher quality texture mode, which has even less banding artifacts?

Personally, I wouldn't mind if it's somewhat slow, as I would use this for small flipbooks and static images.

Perhaps some additional dithering could be applied to the texture, after it has been generated? I don't know much about graphics programming, so I can't really propose any specific technique here... A naive approach could be to spread the pixels inside the shapes randomly as a post-processing step, though I'm not sure if that would look good...

Of course, feel free to close this issue if you think this should be left as-is. The current dithered texture looks already much, much better than the "fast" one. Besides, I suppose a lot of people won't notice the banding.

poke1024 commented 5 years ago

The general saying with regard to banding is: "if all else fails, add noise". That's what I did now. You can also configure the amount of noise by using graphics:setDisplay("texture", "best", noise) where noise is a number between 0 (no noise) and 1 (only noise). It also adds some noise by default now.

pdesaulniers commented 5 years ago

Great, I think it's a good approach. It can even be used creatively, to make textures look rough :)

I think the default noise value is a bit too high in the average case, though. I suppose the noise should be barely perceptible by default.

It seems like more conservative amounts between 0.008 and 0.010 are good enough at reducing banding a little bit, without making the textures look too grainy. It's not miraculous, but it helps a bit.

Anyway, I'm closing this issue. Thanks!

pdesaulniers commented 5 years ago

On a side note, I think this feature would be really great for creative purposes if we could apply it on a per-path basis, instead of applying it on the whole texture.

I guess this could be done by looking for some custom attributes in the SVG's XML (such as "tove-noise"), but I don't know if that's a good idea...

poke1024 commented 5 years ago

@pdesaulniers I changed the noise API in the last commit. To specify custom noise, you now need to do: graphics:setDisplay("texture", "best", "jarvis", noise) or graphics:setDisplay("texture", "best", nil, noise). This was necessary to make everything logical in terms of the new retro modes.

Please ignore this above. Now that I think about this, this does not make sense at all. I will change it to the old API.

A custom noise for per-path is a nice idea. I made myself a note (https://trello.com/b/p5nWCZVC/töve).

pdesaulniers commented 5 years ago

Cool!

By the way, I've tested the new blue noise dithering feature, and it seems like it's really great at reducing banding artifacts! I think it truly fixes the issue for me.