Fit better for 96 px

[sergiobenrocha2]

These monochrome icons fit pretty well on my android smartphone, probably because the icons are resized down from 256 to 64 px (and the original svg source are 64 px too). But in my laptop some icons have some parts blurry. Take a look at the NES cartridge:

It's blurry because the icon is resized to 96 px, at least here. So the width will be 42*(96/64) = 63, and it'll blur each side.

I changed a little bit to fit well both 64 and 96:

Before:

After:

The source:

(rename it to *.svg)

I'm afraid it can mischaracterize each icon. What do you think @kivutar ?

[kivutar]

Yes, that's the problem... We can't do pixel perfect icons without loosing a little bit of their meaning...

@Bibalox tried his best to choose the good compromize, which is:

• align what we can to that 64x64 grid, to have nice rendering on 64, 128, and 256 sizes
• keep all icons included in a circle, to keep sizes consistent
• preserve the aspect ratio of pads and cartridges

Sadly, we can't get a nice result for sizes like 96, or even 32 by this way.

The alternative would be to have one icon set per size, but it's just unmaintainable.

[sergiobenrocha2]

humm, I'm not sure if I followed the last two hints to make the famicom disk icons :p

Do you think in improve all the icons? If not, it's not so unmaintainable. I can resize then to 96 px. And it could be good to get 32 and 48 px too, only for contents. Does any platform use these sizes to the big size?

[kivutar]

Ok, we should ask bibalox to give you the circle blueprint he uses, if you start designing icons, because they need to follow some common guidelines.

The size of the icons depends on the width of the display. So the windowed mode on PC potentially use all these sides.

When I talk about maintaining different sizes, I'm not talking about just exporting again and again the same SVG to different resolution. First because that would fix nothing, but also because the mipmaping already does that well enough. I was talking on having different SVG for each size. Like GNOME is doing:

This is what we had before mipmaps, and it was unmaintainable.

My advice is that we should let things like they are now. I use a 1440px width display, so for me too there are some blurry edges sometimes, but I find it acceptable given the simplicity of the code that we have currently.

[sergiobenrocha2]

This circle blueprint should be in the repo. And the guidelines in some README here too. Thanks!

[sergiobenrocha2]

"preserve the aspect ratio of pads and cartridges"
This not apply for handhelds, right?

[kivutar]

You're right we need a README, I added one.

The preservation of aspect ratio also apply for handhelds. We could calculate a percentage of acceptable deviation, but I guess the best is to let the decision to the good taste of the designer?

[lasers]

Still an issue?

[CoalaJoe]

Maybe we could render svg files?

[kivutar]

Yeah at the beginning I was thinking about it too, to always have a pixel prfect rendering. But it means we have to rasterize the SVG at least on every window resize. And we also need to find a small SVG rasterization lib. librsvg is too big for RetroArch, we would need something like stb_svg, which doesn't exist if I'm right. So I think it's a dead way.

[baxysquare]

Does any OS or UI out there actually have SVG icon support? I know Mac uses ICNS, Windows uses ICO and linux desktops generally use PNG. I know rasterizing SVG files is a pain, but as @kivutar said, there doesn't appear to be any better way for now.

[baxysquare]

The conversation on this issue has pretty much moved over to #189. Are we good with closing it and continuing the conversation over there?

[baxysquare]

I'm closing this in favor of the conversation on #189. If there's some reason this is not the right course of action, feel free to reply.