Dashing Strike Image Processor for Games

The Dashing Strike Image Processor for Games is a utility that can fix bad alpha channels (those that cause problems when used with GPU texture filtering) in PNG images files exported from tools like Photoshop, assist in debugging raw texture data, and generate single- and dual-color tint maps.

Usage is simple - download the executable and then drag and drop any PNG file onto it. The executable is the entire program, no installation necessary.

Downloads/Links:

Functionality

Alpha Fixup

Photoshop has an alpha problem. Specifically, it's really hard to deal with modifying the alpha channel in Photoshop, and, additionally, when you export an image from Photoshop as a PNG, and the alpha for a given pixel is 0, it uses seemingly arbitrary colors for the RGB components of those pixels. This is a big problem for games (which use GPU hardware texture filtering) for two reasons:

  1. Magnification of a texture blends between pixels. This means that the RGB channels of those invisible pixels have a visible impact on the final rendered image.
  2. Generating MIP maps for minification also blends those invisible pixels. Some MIP map generators can be instructed to ignore invisible pixels for this reason, but many others, including the spec generator that is part of WebGL takes all source pixels into account (because, sometimes, they're important!).

As an example, consider a texture that is just 2 pixels, one that is opaque black, and the other of which is invisible but, for whatever reason, Photoshop decided to export with magenta in the RGB channel (which is surprisingly common, though usually it seems to use colors from invisible or hidden or previously deleted layers, or black or white).

As you can see, when this texture is minified or magnified, some of that magenta ends up on the screen, where the blended alpha values are not invisible and the color is blended with the magenta. Ideally, those blended pixels would be getting solid black at 50% opacity instead.

For another example, here's a texture from a PSD I made just now, overlaying an image grabbed from here on top of some colors, and then exporting as a PNG. You'll find the RGB values for the pixels with alpha=0 is madness, if you inspect the RGB channels of the PNG - there's a convoluted way to pull it back into Photoshop and view this with Layer Mask from Transparency and then deleting the mask, but the easiest way is to drop it on ImageProcessor, set it to View mode at the top, and toggle the Alpha: setting to Ignore.

Source image:RGB data only:

The colorful stuff that looks crazy is not actually a problem for magnification in this case, as mostly it's using a nearby color, so the blending will be just fine, but in a few places where it exports some white pixels in the RGB channel (despite no visible white anywhere in the original file) it causes problems. When magnified, we get visual artifacts like below.
Magnification artifact from invisible white pixels:
Though this seems minor, when greatly magnified it's very noticeable, and when it affects a large portion of the image it can look pretty terrible, as if someone drew an outline around an entire sprite or something.
The fix? We want to replicate nearby colors into the RGB channel of invisible pixels. In ImageProcessor simply select the PS Alpha Fix mode at the top, and then save!
Fixed image
(looks identical when
not stretched):		RGB data only:

Magnification artifact fixed!:

Conclusion: When you've got weird halos showing up around your textures, run it through the PS Alpha Fix mode, and you'll be golden!

Color tint map generation

ImageProcessor can generate a set of masks for optimal 2-color tinting. Given a source image which has two primary colors used on the parts of the image that are desired to be tinted, it will generate a base texture (where the tinted areas are grayscale) and a 2-channel tint mask directing which color should be applied using a simple run-time dual color tint operation (e.g. in a pixel shader) equivalent to 

float value = dot(tex0.rgb, vec3(0.2, 0.5, 0.3));
output = mix(mix(tex0.rgb, value * color2, tex1.g), value * color1, tex1.r);

Example

Input image
 
Output base image + mask
(tint colors selected were gray and brown)

Example run-time tinting
with blue and gray tint colors

Notes and Copyright

Note: ImageProcessor can also register itself into your right-click menu in Explorer for PNG files, but on newer versions of Windows, depending on what other image tools and programs you have installed, this may or may not work reliably, so the drag and drop method is recommended.