Analysis
of the Alpha Channel
By Heather Castillo
 |
P Sprite has a yellow background. |
The alpha channel is one of the most overlooked pieces of an object.
Many object creators tend to let Transmogrifier
handle them without messing with it themselves. This creates objects
that really just don't look natural, because the dark gray edge
becomes very noticeable.
 |
WRONG: anti-aliased edges of the P sprite
causes problems with image edges in the game. |
Having several old pieces that I wanted to improve, I decided to
use my Sweetheart Mauve Roses to demonstrate the creation of a proper
alpha channel. In doing so, it will be important to examine the
P sprite first.
 |
Right: aliased edges of the P sprite will
make your image look jagged in the image, but necessary to avoid
a messy edged objects in the game. |
The P sprite is recognizeable by the yellow background. When creating
your image on the P sprite, you should try to avoid creating any
blended edges, or anti-aliasing.
The image on the left has pixels that fade into the yellow, causing
a smooth looking edge in the image, but a yellowish tint in the
game. To the right is the best method for avoiding that problem,
which is to create hard lines between the image and it's background.
I use the pencil tool, which is found in photoshop by clicking on
the line tool.
 |
First step, aliased edges of the Alpha Channel
caused your image to look jagged in the game. |
There are several different methods to creating your alpha channel.
If you have the use of layers, you can duplicate your image into
a new layer, remove all of the yellow background and color the remaining
part white.
Find the best way to accomplish the task then you can start the
smoothing of your object. In Adobe Photoshop, I use the line tool
with anti-aliasing on to smooth out the edges of my objects. Select
black and go around the tips of the edges with your line tool to
create a dithered or more gradient appearance to your alpha channel
as seen to the right. This object is small, so the effects may not
be as noticeable as it would on a larger object.
 |
Right: aliased edges of the P sprite will
make your image look jagged in the image, but necessary to avoid
a messy edged objects in the game. |
Zoom in to go around the edges. When you zoom out, you can view
whether the image appears to be smooth or not. Smoothing out large
objects can actually be more difficult if the lines are at a diagonal.
On two tiled objects, it's important to keep the edges that meet
in the middle as a hard, true white; otherwise, you will have an
ugly line through the center of your object.
I'm not going to cover z-buffers here, but you can keep the jagged
edges with them and everything will be fine.
That is all you need to do to create a smooth object :) It may
take a bit of trial and error, but you'll get the hang of it eventually.
|