"A Graphician's Tip Book - Part 8"
Shaithis / Psychic Monks, Immortal Coil
Hope everyone had a cool thanksgiving break (and for those of you non-US
readers a uhm...good weekend. :) I went home, and lo and behold when I
returned there was a shiny copy of DemoNews sitting in my mailbox. Sadly,
this shiny copy of DemoNews didn't contain an article from me. This is
because I was away. Oh well. I'm back now so let's get on with it.
You're probably expecting me to talk about Photoshop right? You're probably
expecting me to go right into technical detail on what it does and how to use
it, right? I mean...that's what I've been saying I was going to do, right?
Well...uh...the problem with that is that there's a new version of Photoshop
out in the stores. Being a poor college student, I simply don't have enough
money to afford it (donations are accepted however. :) At any rate, I'll be
able to check out Photoshop 4.0 when I get home in a few weeks, and can use
the one that my cousin has already purchased. (It must be nice to have
money. :) So until that time I think I'll write about something else
What I want to write about today actually hearkens back to a few articles ago
when I was talking about dpaint. The past few weeks of my life have given me
the opportunity to work with that program more than I have in the rest of my
life combined. I'll not go into great detail, lest I be accused of
mercilessly plugging my group, but let me say that Immortal Coil is in the
process of creating an RPG. This RPG will run in 320x240x256, which is a
more or less standard vesa mode. Since it is not a 3D game, however, it must
be hand drawn. Every...single...pixel.
Working with 256 colors is a difficult thing, as I have found much to my
dismay, especially when palette limitations are imposed that make it
generally a bad idea to use more than sixteen or so colors for an object. My
respect goes out to those of you who do 256 color pixel work on a daily
basis. It's not always a lot of fun, but I must say it's damn rewarding to
sit back and look at a piece that you _know_ looks good despite the
limitations imposed upon you.
So that's more or less what the rest of this article is about. I'm going to
speak (or write I suppose I should say) a bit on the subject of generating
recognizable pictures under heavy restrictions such as the ones the I must
impose on myself in order to make graphics that our coders can actually use.
Just a few tips that I've come up with that I thought might interest you.
*Don't outline your sprites in black* For those of you who don't know the
term "sprites", I'm simply using it to denote a character, a rock, or
whatever other graphic it may be that you'll be animating (ah animating...
I'll probably talk about that next week. :) At any rate, this is a big
no-no. Sure, it looks great on a white background. Nice and crisp. Now put
it against a grass tile (tiles are similar to sprites but are perfectly
square). Doesn't look at all natural, does it? This is easily solved. Shade
your characters so that the colors _imply_ the outline.
One way to do this, and a way I definitely advocate, is to take a good amount
of time setting up your palette before doing any actual work. My group spent
a week and a half just passing around a palette between us, giving it little
tweaks until we had the exact colors we wanted. Now that we have these
colors, it is much easier to see how best to shade a character. All of our
colors are in straight lines, running from near-black to near-white, with the
truest form of the color in the center of the gradient.
We have sixteen colors in sixteen shades, giving us a total of (you guessed
it), 256 colors. With the method of laying out the colors explained above,
it is relatively easy to find the colors you want in order to shade your
character correctly. This leads us into the next tip:
*Solid lines of color usually don't work* This is a basic truth. Your eyes
betray you on this one though. We interpret much of what we see as solid
lines of color, despite the fact that upon closer inspection what we are
actually seeing is hundreds, possibly thousands of colors interacting with
each other. Shadowing, printing, monitor displays, whatever it is you're
looking at, I can assure you you're probably not seeing a solid line of
"So okay...I'm not seeing a solid line of color...your point is?" Wait. I'm
getting to that. Let's assume you're drawing something relatively
simplistic. A 16x16 tile for example, trying to imply grass. The first
thing you try really doesn't look much like grass does it? It's quite likely
that instead it looks very stiff, like a bunch of light green lines running
on a darker green background. This was what my first attempt looked like
anyway. Some of you more experienced pixel-ers may giggle at that, but keep
in mind that I haven't done any serious 256 color work in about a year.
Whoah...this article's getting long. In my next installment, I'll give
finish up explaining how to get a better grass-tile (which will in turn
explain how to shade better, in general). After that, I'll give a few more
tips, and move on to some basics on animation.
256 color work can often seem like a chore, but the real key is not to think
of it that way. Instead, think of it as a challenge...a test. You have put
yourself up against some pretty severe limitations. Now it's time for you to
create what you want to create _anyway_. You can do it. I have faith. Go
experiment! Here's a hint. The spraypaint can with a little tweaking can do
wonders for a grass tile. More next time!
go to part 9