Monday, June 24, 2013

Dedithering Pixel Shaders

Dithering, as it applies to pixel art, is a pattern made up of two or more colors of pixels arranged in a pattern (usually a checkerboard or dotted line) that, when viewed on a CRT television, will blend together, resulting in an average of the adjacent colors. This allows an image to display more colors, perceptually, than may be technically possible to show otherwise, and was also frequently used to produce a transparency effect. Unfortunately, when such dithering is viewed on a modern LCD monitor or TV, the color blending never happens and we're left with ugly checkerboards all over the place. Even worse, pixel art upscaling-interpolation algorithms such as HQx and xBR tend to have a really rough time with dithering.

Recently, though, several different folks all independently developed their own solutions to the dithering problem using pixel shaders. Here are the raw images to which we'll be applying the shaders:

Three of these games are for Sega Genesis, which relied on dithering extensively, and the other is from an SNES game that uses "pseudo-hires transparency," which functioned similar to dithering insofar as the artists expected the vertical lines to be blended together by a CRT TV.

First off, we'll look at coastkid's CBOD shader, which uses three shader passes of 4-pixel blur using various threshold values. It can be a bit blurry but does an impressive job of smoothing out the dithering, particularly with regards to vertical dithering patterns, with which the other shaders often have trouble:

Next up, we have aliaspider's GTU shader, which uses a "pixel bandwidth" variable to determine how much horizontal blurring should occur. This shader also includes light scanlines (which can be lightened or eliminated entirely by manipulating variables within the shader) and gamma correction, making it a one-stop option for people who want the benefits of CRT blending, color and scanlines without any heavy-handed phosphor emulation, etc. Its handling of pseudo-hires transparency is particularly nice:

For reference, the SNES shot used a bandwidth of 512 while the Genesis shots used a bandwidth of 320.

The last shader is Sp00kyFox's MDAPT, which stands for 'merge dithering and pseudo transparency.' This shader uses a modified version of Hyllian's DDT shader's detection code to identify identifies dithering patterns and then replaces them with an average of the component colors (I was mistaken; the algorithm is all Sp00kyFox's) . MDAPT is especially interesting because it is intended to run at 1x to smooth out dithering silently--so to speak--followed by another upscaling shader. On its own, here's how it handles our dithering example images:

Unfortunately, it sometimes has a few false-positives (notice the '200' in the next shot), but nothing too terrible:
When paired with some other shaders, aliaspider was able to use MDAPT to produce some pseudo-hires transparency upscaling that is nothing short of magical:

You can check out a couple more shots from aliaspider here.

Of these shaders, MDAPT and CBOD are available in Cg format, while GTU is in XML/GLSL format

No comments:

Analytics Tracking Footer