Generate state icons

From RealWorld Wiki

In certain situations, it is necessary to generate slightly modified versions of icons to indicate different states, for example:

• Grayscale, desaturated - disabled state.
• High-contrast, glowing - hot state.

[edit] Applying state effects to icon's images

Standard icons may have up to 15 image formats (3 color depths * 5 sizes). Applying the desired effect on each image manually would be a waste of your time.

RealWorld Icon Editor allows you to prepare commands that would apply effects on every image of an icon and it comes with the basic effects pre-configured. Commands in Icon->Filter all images menu cover the basic scenarios. You can generate grayscale images by reducing saturation to 0 using the Color adjustments filer.

To apply other filters on all images at once, you'll need to learn to reconfigure the layout. The information in the following section will be useful as well.

[edit] Applying state effects in batch

A batch operation for applicaition of state effect is not one of the built-in ones, but it is easy to configure:

• Open new window and switch to Batch Mode.
• Switch Batch operation to Custom operation #1 or #2. Save the current operation if you would want to restore and use it later.
• Click Configure. This dialog may look a bit overwhelming, but you'll get used to it:

Name and operation fields at the top of the window allow you to specify user friendly name (in multi-language format) and the actual operation performed. Note that the operation is set to Sequence by default. This is desirable, because after the effect is applied in the first step, the modified file is saved to the destination folder in the second step. To create a color desaturation filter, do the following:

• Set the operation of the first step to Document - Extract Document Part (red marker). This operation allows you to work with individual parts (images) of the current document (the icon).
• Switch the Extract part by field to All available parts (green marker). This means that you want to work with each image in the icon.
• Switch Part operation to Raster Image - Color Adjustments (blue marker). This is the operation applied on every image.
• Finally lower the color saturation to 50% (purple marker).

Click OK and your new batch operation is ready to use (drag and drop icon files or folders on the application window to process them). You can also save it to a file and share it with co-workers or archive it.