![]() ![]() Nearest neighbor filtering is the simplest way to scale an image. Since fully understanding how the shader works depends on understanding these two filtering approaches, I’m going to first spend some time explaining them. The pixel art scaling shader is sort of a mix between the two standard scaling approaches: nearest neighbor filtering and bilinear filtering. Since it was so hard to find information about how to solve this problem, I decided to write this tutorial about scaling pixel art, explaining it in a way that makes more sense to my brain (and hopefully others’), and also giving an example of the solution in Unity. It still took me a while to understand how it works, but I figured it out and was able to implement it in a Unity shader. The author does a really nice job of explaining and illustrating the solution in a very mathematical way. So I kept searching, and I finally came across a great solution using a shader (this is the “Good” version in the example image above), described at a blog called A Personal Wonderland. Most resources I found claimed that you have to stick with scaling by integer multiples if you want it to look good, but I knew I’d played plenty of pixel art games that could scale to my screen size and look just fine. ![]() This led me to do a lot of googling to try to find a solution to the problem. ![]() Neither of these options look great, as seen in the example below. ![]() Choosing one of the two standard texture scaling modes will end up either making some of the pixels in the pixel art bigger than others or making them all blurry. Because screens can’t display fractional pixels, the rendering has to either round to the nearest whole pixel, or it has to blend different texels into the same screen pixel. This causes problems because the texture pixels (in other words, the pixels in the artwork, also known as texels) get scaled to fractional pixels on the screen. It works fine when it’s scaled by an integer multiple (2x, 3x, etc.), but there are issues when scaling by a non-integer multiple. However, I quickly came to realize that this is not the case – it’s actually quite tricky to get pixel art to look correct when scaling it up by an arbitrary amount. When I started using pixel art in game development, I assumed that it would easily work at any screen resolution, since modern screen resolutions are much higher than the native resolution of a pixel art game. ![]()
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |