Textures pixalated when scaled down

[fallen verge]

All my textures are getting distorded and pixalated when scaled down.

Can anyone help? Any ideas?

Thanks

[strong glacier]

You can't get rid of distortion but you can change the filter mode

It's a node property under canvas item

[fallen verge]

which option is going to help me? Because does not seem to change anything.

how come I see games without pixalated textures on the UI than?

[spark gorge]

They match their texture size to their base window size.

For multiple resolutions they usually have variant textures that will be swapped, which are different sizes.

If you take a Texture designed for 4K or been 2K, and have Godot "Scale" (0.5 , 0.1, etc) it down for 720p, you'll get artifacts.

It's why various design documents suggest making your textures in variants.

my_texture
my_texture@2 (for 2k, double rez)
my_texutre@4 (quadruple)

You can't make a one size fits all resolutions Raster (png / jpg). But you can do your art in Vector (svg) and then export multiple variants of different size, which will look nicer closer to their target size.

Some games (not necessarily Godot) use Vector graphics for their GUIs. And basically have the computer recalculate the images every time there is a resolution change.

This is how Flash used to work. Almost everything in Flash was vector graphics, basically.

[fallen verge]

I never actually had to make multiple variants (i am more of a programmer), so I have a question.

If I make my textures with @2 @3 and etc as a prefix. How will godot know which to use it??

[strong glacier]

It won't, you need to code it yourself

[spark gorge]

Sorry those @ are common naming conventions from iOS/macOS texture sizings, which you'll find both in Apple's documention and assets people make with mobile devices in mind.

I personally use _x2 for safety on systems that don't like @ in the file name.

You'll have to create the systems to do the texture swaps. It can be done fairly automatically if setup for it, usually in your initial application startup code. Or linked to User exposed resolution change code.

This is to take the maximum amount of control over how the image is rendered.

Really there are two issues.

1. Multiple Resolution support
   https://docs.godotengine.org/en/stable/tutorials/rendering/multiple_resolutions.html#multiple-resolutions

2. Making appropriate resolution assets for your "Base" resolution.

You really seem to be having a problem with #2 . If you're scaling up or down your asset for your UI in the base Resolution to the point that artifacts are noticable.... you need to recreate the Assets so they come at a 1.0 scale.

For desktops ,1080p (1920x1080) is still the vast majority for systems. So if you "Art" all your assets to be ideal to 1080p at scale 1.0, it will generally look better.

Unless you're dealing with Apple products where 4k and even 5k displays are defaulted by end consumers.

[fallen verge]

thanks a lot for taking the time to answer that! I really appreciate it! If you ever need a programmer for anything just give me a ping!