Anti-Aliasing for the masses – A beginner’s guide to Supersampling

Here is a simple run through of how supersampling – the simpest form of anti-aliasing – works, using screenshots of actual Bike or Die screens made with the PalmOS Cobalt Simulator.

We will use the high-res setting to create a 2x Supersampled low-res screen. First of all, we have two images, the high-es screenshot and the low-res screenshot. These are not quite the same because the simulator crashed when I tried to switch back into low-res mode. Low-res is on the left and high res is on the right.

lowres-noaa.pngHigh-res screenshot

No to produce a supersampled version of the low-res image, we take the high res image and shrink it by averaging each block of 4 pixels to prduce the next pixel. Most image editors do this, including MS Paint and Adobe Photoshop.

Here we have the supersampled version of the low-res game on the right, and the no supersampled version on the left. The supersampled version is bigger below so that you can see the anti-aliasing at work!

lowres-noaa.png lowres-ssaa.png

lowres-ssaa.png

As you can see, despite this only being 2x SSAA the image looks much better than if there was none!

PiNerd

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: