Creating Realistic Icons for Windows Vista

The original icons included in Windows Vista set a new high in iconography. Stylish, attractive and slick icons create great looks while careful consideration taken to ensure color consistency and shape cognition make the users immediately comfortable with the new interface.

There is a lot to say about the new style of Vista icons. Windows Vista icons are strikingly different from any other kind of icons, making tools and utilities that use the new icons look modern and in-line with the current trend. By not using the Vista icons, the software developers risk in their products looking dated, with some users even questioning the Vista compatibility of the product.

Technically speaking, there are just a few easy-to-follow guidelines that create the recognizable “Vista” look.

Windows Aero icons look a tad more realistic than the cartoonish icons used in Windows XP. Not realistic enough to be mistaken for a photographic image of an object, Vista icons look more like simple 3D renderings with translucency and glaring reflections, but without textures and traced light. Windows Vista icons present just enough detail to be recognizable, without overcrowding with details that might detract the viewer from their main cognitive purpose.

vista icons

The fresh, more realistic approach to designing icons for Windows Vista became feasible with the introduction and subsequent spread of a new generation of high-resolution, high-DPI displays. Microsoft has defined a new standard for high-resolution icons in its Windows Vista, adding compressed full-color images that consist of 256×256 pixels to the list of available formats. The new large size allows Windows Vista render applications smoothly and perfectly at any display resolution. Although Windows Vista does not support vector icons at the moment, keeping vector originals seems to be a good idea.

How can you draw icons for applications designed to work in Windows Vista? You’ll need appropriate tools for that. Sib Icon Studio is designed to help you make perfectly-looking icons for Windows Vista applications.

First of all, you have to define sizes for your icons. Microsoft defines a few standard sizes for maximum compatibility. Create square images with every side sized at 16, 32, 48, and 256 pixels. Bit-depth wise, you are looking at 32-bit ‘true color’ and 8-bit (256-color) variants. 4-bit icons (16 colors) are also to be considered if there’s a chance that your applications will ever run in a server environment or over remote connection. The 16-color icons are a completely different story though, as they require quite a different approach to make recognizable and good-looking pictograms.

Windows Vista supports icon transparency and semi-transparency for the 32-bit icons. Every true color icon has an 8-bit Alpha channel that defines the transparency mask, making it possible to create icons with realistic shadows and smooth edges. Semi-transparent icons look cool and blend into the environment, adding to the Aero experience.

The 8-bit and lower color depths also use the transparency mask, only the masks are just one bit, meaning a simple “transparent” or “opaque” with no additional gradations.

Adding supplementary sizes such as 24×24, 64×64 and 128×128 pixels is less common, but can be useful under certain circumstances.

With that many formats, sizes and bit depths the icons are going to be huge in size. A single uncompressed true-color icon at maximum resolution of 256×256 dots takes over 400 KB. Compare that with a typical 25 KB of a Windows XP icon! The size problem pushed Microsoft to accept the PNG compression algorithm that keeps icon size under control. The PNG format is lossless, and fully supports high-resolution, high-bit-depth icons with semi-transparent alpha-channels. Needless to say, Sib Icon Studio supports all icon formats as well as the PNG compression to create perfectly looking and perfectly compatible icons for Windows Vista programs.

Leave a Reply

Your email address will not be published. Required fields are marked *