Question

I recently decided to create a higher quality graphic for an application I develop. The original, and lower quality, graphic is 48×48 pixels, and the new one is 256×256 pixels. When I run the older version of the application, with its lower resolution icon, the icon displays properly.

However, when running the new application the higher resolution icon the icon is distorted (square with sharp edges rather than rounded ones, and the icon is off at an angle).

Answer 1

Looks like a poor sampling function is used to rescale the icon.

While there are more elegant solutions, 256 px to 48 px is a pretty drastic resize. Why not simply make a second, smaller resolution icon, and use that for the tray?

I played around with your image a bit, and this is the best I could do:

You can copy and paste it into a 16px 24 bit icon in your resource manager (don’t forget to “Clean” your solution rebuild as it may still use the old one), instead of the big one you are using. I made it by shrinking your icon to 16×16 and then hand-editing the pixels until it looked right:

If you need a high-res icon somewhere else, I think you should have one high-res and one lo-res icon and use whichever is appropriate.

Simply having one icon and rescaling it to different sizes sounds like a clever thing to do, but in practice you can’t simply rescale icons and expect it to work: http://mrgan.tumblr.com/post/708404794/ios-app-icon-sizes