Icons and how they appear in your target OS are the sort of thing you don’t think much about until you actually have to make them. This was definitely the case for me after I prepped a build of Ookibloks and noticed that the icon was blurry.
Looking more closely at how icons behave on my Windows machine, I noticed how icons that may look fine at medium size, will look like a lame little image in the middle of an empty square at larger sizes.
Various icons in Windows at medium view
Various icons in Windows at large view
The effect is even more pronounced when using the extra-large icon view.
Icons at extra-large view. Whoah!
Naturally, I wanted to make sure that Ookibloks has an icon that looks good wherever it resides on a player’s machine. This post is a result of said semi-deep dive into app icons on Windows.
First, it’s key to note that Windows icon files (ICO) are not simply images. They are container files that contain images at multiple resolutions and bit depths. Considering the various roles that icons play this is fairly obvious when you think about it. Then again, I had never seriously thought about icons before so it was news to me.
After a brief bout of despair from finding nothing but pricey proprietary programs for producing icon files, I realized that Gimp could export ICO files. Good news; but still, setting up layers at the various resolutions/bit-depths Windows expects is still pretty onerous. Enter iconify, a Script-fu plugin for Gimp.
Using iconify, I was able to start with my highest resolution icon (256×256 w/ 32-bit color):
Large resolution Ookibloks icon in Gimp
After running the script, my Gimp project was populated with layers containing resized versions of the original image corresponding to the various icon resolutions Windows desires:
Ookibloks icon layers in Gimp after running iconify
Now, when I exported an icon file, Gimp would automatically match up the layers:
Exporting the Ookibloks icon data from Gimp
And produce a nice, clear icon for my app:
Ookibloks app icon in Windows Explorer looking nice and crisp
Now, that’s a happy little monkey!
NOTE: I did have a little trouble with the plug-in-autocrop-layer command in the iconify script producing misaligned results with the Ookibloks icon. I eventually got around it by simply commenting the command out. YRMV.