Feature 05 - Generic 16 color palette

[Arne]

I've been working on a general purpose 16 color palette. I got some nice feedback on IRC, and I'm at version 11 currently.

The main philosophy is to (if possible) have:

-Pleasant common colors, like sky blue, vegetation, skin tones, etc.
-Cold-Warm ramps
-Cross color ramps (Red-Orange-Yellow etc.)

I had to sacrifice full white, but I think it's working. Full white is kind of obnoxious and dull temperature-wise.

The red is a bit dark, but I've found it to be useful that way. It can be worked up in value by using some of the lighter colors.

The most recent change is the dark brown. I needed a dark color for background stuff, but brown seem to be a good choice since it can ramp with a lot of colors (green, yellow, red, purple).

I'm doing a few mockups to see how it works in practice. Samus and her friend is ported from my mini Metroid project (which is 32 colors). The platform mockup is kind of uninspired.


Jet Set Willy II Speccy screen PO. I need to play that game some. The Speccy version seems superior, otherwise I often prefer C64 versions of old games.

[Helm]

Yeah Ptoing showed me the version before this one on msn and I was thinking 'perhaps he shouldn't have pure grays' but then again my c64 instincts stopped me, when I considered how absolutely useful pure grays are there to bridge other hues.

However if you went that way with the dark brown, just give a subtle tint to the second darkest gray too perhaps.

I am not lamenting the loss of pure white too much.

Otherwise this palette is excellent and very adaptable. Good job. I might use it for something or another.

[Arne]

I'll have to sleep on it. I think with such few colors, there'll always be something which irks me. The two darks are a bit problematic yes. Maybe they should be in reverse order.

Noodling around.


Quick and dirty reversed darks.


Edit: ref: http://www.mobygames.com/game/zx-spectrum/jet-set-willy-ii-the-final-frontier/screenshots/gameShotId,132010/

I'm leaning towards reversing now maybe... With a brighter dark warm I can do more stuff with the earth colors, and a cold extra dark does feel less intrusive.

[Helm]

I'd say yes, cooler darks are better in this case, especially since night-time blue-to-black is such a prevailent theme in 8-bit games. The coppery warm brown won't be as useful.

[Conceit]

hmm interesting.The most similar to this I've tried is messing with GBC pallete...it IS really challenging to make a pallete that works on games with completly diferent uses of contrast.
I'll show u my archive of GBC screens, maybe you can use that to test urs..in HALFS! because they're just 8 color screens XD...who knows.


Maybe u should grab a bunch of c64 screenshots instead

hrm, I think you're limiting yourself trying to keep pure skin tones there. best illustration artists always say there are no skin tones, it's all about how you surround them.

boy, I'm really missing some purples in there. You'd be amazed at how much of an ambigous bastard purple is :p. the only other neutral color in WARM vs COLD is green, and it's not nearly as easy to use for bridging...in my experience.

I'm not really sure but...I think you should atleast try putting a purple in there sneaked as a skintone.

Sorry, might be self important to post this, but eh...I dont know, it's a fast take on what I'd do for a generic 16 color pallete...maybe it can give u some..ideas?



hehe, I sure like my purples dont I? C_____C

[ptoing]

Eww wtf camus, really. Those GB ones are horrible. If there are only 4 colours for bg and 4 for sprites you can not make an global palette with colours like that and think it will work. I have to say I find those combinations rather pukey. I would rather just go with 2 different colourramps for the bg and fg. both quite greyish, sprites a bit warmer than bg, and only slight tint and not hugely different colours.

[Conceit]

well, I'm not saying go and copy everything I did...it's just a suggestion, if you work your own pallete with your own mockshots you tend to do what you think the pallete should do, and well...I think the whole point is to make the pallete more versatile. I thought maybe some screenshot from various gb games would be of use.

I happen to like the crazy combination of colors when I play on GBC...for whatever reason...the point was to give him screens from various games with various senses of contrast, I'm not saying hey look at my awesome colors, I'm just giving him those screenshots in case they can be of use. who knows.

[Arne]

Thanks for the replies.

I think the reason blue would work better as a far BG color in general is because the sky is blue, and the sky is always far away, so it's hardwired into us. The question remains just how brown to make the darker grey now... Should I go for a ramp with the earth colors (brownish) or a ramp with the grey?

As for skin tones, my guess is that there'll be 2 common environments. Black background and Sky blue background. I tailored the skin purple for the sky background as there'll be cool ambiance. Black can be considered neutral. With just 16 colors I'd rather cover the most average situations first, meaning warm light, cool shadows. The character will also move between so many environments that an average skin color would be result. My palette is based on the C64 one by the way.

I made this 3d cube histogram based on a few hundred thumbnails. Some time ago I made a 64 color palette based on it. You can see the popular colors stretching along the grey from corner to corner. The white highlight is the histogram and the color pixels are any color with a hit. Only 256 colors out of 16777216 are grey. Of course with games you'd have to push the saturation a bit to make the elements read clearly.
http://www.greatgamesexperiment.com/slideshow/user/arne/6812/6

[Sherman Gill]

Ah, did not know you had an account here Prometheus  .

Anyways, here's something made using the pallete. Well, version 7 of the pallete. Was too lazy to update it to a newer version.

[Arne]

A c64 pal comparison. My green is the same, and the blue was just changed a tad.




I noticed I have some of the palette histogram project pics online, so here they are. I had to compress pretty hard to save bandwidth/space.

256 source pics, I just googled various things, took the decent pics and scaled down with nearest neighbour. (fullsize is 1024)


Here's a HSV cylinder plot, 16 slices (meaning I had to compress the plot to 16 values). Distance from the center is saturation.. I think I plotted random colors to make the color part, i.e. the colors you see are the RGB 3D Cube existing in a HSV cylinder dimension! You can see the histogram being rather diagonal.

If you wonder why the high value (white) tip is skew, it's because some hues are darker. Yellow kind of goes off like a wedge there cuz it's brighter.


1/4th of my source was pron... because 1/4th of the internet is. Lots of skin tones here...


RGB cube. I plotted /4 here to make 64 pixel squares, but here I scaled down further. It's just to give you an idea what the cube is about.


Finally, my 16 color palette. I faded the spectrum and added the histogram as reference. Hard jpg compression, sorry.
As you can see I dare venture out a bit outside the safe/popular colors just to get some range. If I were to pick the most popular colors only, I'd end up with 16 greys. Again note that is is /4 to make a 64 pix cube so there has been some compression.


C64 palette. Note thatthe black and white are in the corners.


I once tried to make a 64 color palette based on this data, but I never arrived at anything conclusive.

[Arne]

The same HSV cylinder as above. Rearranged it shows the shape of the RGB spectrum and histogram better.

Angle=Hue
Radius=Saturation
Height=Value (brightness)

The value is calculated with:
Value = (0.299 * Red) + (0.587 * Green) + (0.114 * Blue)

(That's why the shape is skewing/twisting from blue to red to yellow inside the cylinder.)

[Helm]

Hah, I can't say the hard tech was something I had considered when I was thinking about a global 16 color palette. Neither did the people that hardcoded the c64 one, but they seem to have made a very decent one. Anyway, as to the open question of 'how brown should the gray be?' well, grays are usually context-sensitive, so they appear warm against cold colors and cold against warm colors (with perhaps a slight bias towards coldness because they certainly appear cold against BLACK and WHITE) so I would say 'a bit more brown than you'd think would be considered enough'.

[Malor]

A c64 pal comparison. My green is the same, and the blue was just changed a tad.



1/4th of my source was pron... because 1/4th of the internet is. Lots of skin tones here...

hmmmm I actually saw some things in the source..gathering? That looked like porn ...anyways, I don't understand your fancy tables..and color wheels..but the palette loks great!

[Arne]

it's worth to not that my histogram thingamajib merely is an.. what's it called... empirical study. If you needed a general palette for photos and stuff, then it might be a guide. Game graphics often benefit from being clear and easy to read, meaning more saturated cartoony colors. I think I made a thumbnail batch source image from classical and contemporary art and video game graphics as well, but it has disappeared.


Here's what photoshop made of my source image. It prefers to grey colors a bit to get better averages, so I made a few versions from a more saturated version of the source image as well. Then purples appeared for the first time.


(edit: oops,  it seems like Selective and Adaptive produced the same result... (also, no forced colors here))

Maybe one approach is to make 8 greys with subtle hues for bridging (Bitmap Brothers used this didn't they?), then 8 saturated colors. I'll try this approach and see what happens.

[ptoing]

Hm, I never really understood the Perceptive, Adaptive, Selective stuff in PS, like how does it work?

About the Bitmap Brothers thing. Dan Malone did stuff kinda like that. Also Amiga is 12 bit, 4 bit per channel. So when he wanted monochromish pictures done in more than 16 colours (with 4bpc you only ever get 16 pure colours of any shade) he chose colours which are kinda close and interleaved them.

Like so



Mark Coleman, the other artist BMB employed has a massive fetish for supershiney stuff and Orange/Blue complimentary contrast. All the gfx he made for BMB games are either Orange and Blue or Orange and Grey for most of the part. Many people say, ah yeah, Bitmap Brothers style, and kinda throw it all in one bag, but looking closer Dan Malone's and Mark Coleman's stuff are VERY different. I prefer Dan's pixelstuff much over Mark's

[Arne]

Guessing: I think Perceptive picks colors which we can see and differentiate between, whilst Selective would just selects colors based on popularity or something. Adaptive I don't know.


One problem with 16 colors is that a majority of the colors will be allocated to covering the basic ones (RGB,CMY,BW). not much room for the warm-cool gray ramps if you also want Brown and Skin tone in there.


I made a few more experiments:

[Arne]

I think I managed to solve the cold warm dilemma. I took the dark green (which was relatively unused and rather dull as far as ramping goes) and made it a complimentary to the other dark I had (aside from the darkest cold). Now I can dither those to get a dark grey-ish color if I need one.

So:
- Really Dark Cold for vague non-interfering background details on black.
- Dark Cyan which works with the green and blues or as a cold dark gray, and as a dark background tree line color too I suppose (dark green with a blue-grey atmospheric tone).
- Dark Brown which works with the red-browns. Can, along with the colr above, provide interesting temperature variations in the darks.

Most colors can build on those. I might still nudge them around some more, but the theory is sound I think.
I also did some minor changes to other colors. I need to do more mockups to see if I'm really on to something here though.

[ptoing]

This is very solid i would say. I will give something a shot a bit later.

[Conceit]

HOLY vuck! you are PROM?1???!!1? C_-

now I feel like a total moron for my skintones reply >______<

WOW, sorry for the mandatory asss kissing but I love that tutorial you made on painting, your Megaman redesigns (SPECIALLY Clashgal =D~~~) and I am forever thankful to you for hooking me up with EXILE......(I cant exactly emulate it properly tho =/ )

I am VERY glad to have you here =D
________________________________________________________________
Ok, now with the ass kissing out of the way...
Sorry, couldnt help myself again 

[Xion]

Conceit: Ew?

Nice palette, Arne. Here's a pic I made using the old one:


Then I converted it to the new palette:


Not sure which I like better.

[ptoing]

Hahaha, I wanted to make a similar comment about Conceit's palette, too purple, odd greens and worse contrast.

Quite nice Xion, clouds are fudgy tho with the dark outlines, looks odd in terms from where they should be lit. Could be developed more


Something to look at and reflect a bit

[Conceit]

hey, fuck you guys purple rules 

and...about the contrast, when u saw when u said that didnt have a real black for some stupid reason.

[Helm]

Yeah I think the newest one would serve most purposes. When it's finalized I'll make a mockup or two using it to see how it holds up. Though I would really suggest you minmax the values a bit more to get couples in grayscale much like the c64 palette does. It's a very useful effect.

edit:

Grandpa yus says:



can't expect anything pure-green to jump to the bright yellow on the highlight. Need a buffer.

[LoTekK]

Helm, doesn't prom's latest pallete have 3 greens?

This is a pretty interesting discussion, especially with the more technical stuff in the middle. Putzing around with the current pallete to see what I can come up with for a sprite/mockup.

[Xion]

Helm, doesn't prom's latest pallete have 3 greens?

Two are too dark and there is no hilight.

[LoTekK]

Two are too dark and there is no hilight.

Yeah, I was just noticing that while playing around with it. The middle green is a little too close in value to the darkest; bumping up the value by a few notches seems to work ok. As for the highlight, I tried messing with it a bit, and H58 S40 V90 seems to work nicely. It still works as a highlight for the yellows, and while arguably a tad bright against the green, it can work in moderation.

[Conceit]

*ahem* hence my pallete......

[Arne]

Yeah, it occurred to me, but I was worried about leaving the dark green-cyan behind too much. I'm really not a fan of too bright green, especially not the bright mint green like in the C64 palette. That's the first color I scrapped.

I'm also unsure about the red being so dark, but I kind of like it.

Still v13. Most of the useful colors with a clear identity are mid value, so that's where I wanted to concentrate. There's a bit of a hard edge there at the green, orange, grey though...
(I think Ptoing got the order slightly wrong btw)


There's obviously always going to missing colors, so I really need to do more empirical studies to see whats a good compromise. I need to do more mockups still.

Edit: Thanks for the mockups and feedback!

[ptoing]

Hm, promotion and photoshop handle value differently. And the values on the c64 one that promo produces are right (fact)
Adjust > Desaturate in PS is fucking useless to make something grayscale, kills the contrast.

I have to agree with Helm about the green.

[Arne]

What I can do is (and have do on the new version I'm working on) is to bring up the dark cyan along with the green. This to avoid them separating too much. This also makes the grey work better with the dark cyan. If you look now, they're a bit too far apart as well.

But I really have to be adamant about not lighting up the dark cyan too much. I want it to work with the really dark blue as a background color which does not interfere with the foreground values.

I should probably stop discussing Epistemology in PMs and actually get some mockups done

Btw, How do I get JetSet Willy to stop jumping in his bed in the RetroSpec java emu?

[Helm]

If you look at the tree you have in the mario mockup it's pretty clear I am not the only one running in problems with not enough greens. It's not so much the darker green that is too dark - though a version before that was better too - it's that there's no highlight color before it leads to yellow. I could, I guess, deal with green and yellow highlight but if you consider 22% of all game art is forest green (Epistemological fact  ) you're not achieving what you set out to do with good colors for game environments.

EDIT: another thing: don't worry about colors for fullscreen demoscene stuff because we will all dither and get the tones we need. If it can be done with the c64 palette, it can be done with your palette and probably better. It's the prime colors for game art sprites and tiles where dithering everything just might not work and will create unpleasant texture you should be optimising about.

[Conceit]

well, what I did most certainly goes against what Arne wants with the dark cyan, hell I even went and removed the entire gray ramp :p. I've never used one...it's probably because of how all art I've done is game art...and I never DID get into Helm's whole c64 craze.

all I really thought of was making long ramps of any color, and...well I've always thought dark shades were the best place to reduce saturation a little and have all the ramps blend...so I did C.c

and so, Conceit continued to talk as if anyone cared

[Helm]

and I never DID get into Helm's whole c64 craze.

I resent that blah blah I never intended any craze, I just found a really good palette and worked on it blah blah not my fault people make bandwagons out of anything blah blah


I actually very rarely use pure grays too, but I can see the point of having them in an all-inclusive palette since they act like magic colors, linking different hues.

[ptoing]

Also do not blame Helm alone, I have my part in it as well, more like a joint effort. But indeed, not our fault

And agree on the greys, as soon as you tint a gray it loses some of it's neutral linking capabilities as it will have a bias towards some colour more than another.

Might as well post this again. Look at the ramps with the grays, you could not do that as effective with tinted grays.

[Arne]

I do agree about the green, it needs to be more nature-ish. it's an important color, since it's grass color. I think grass is more common than trees.

I could hue shift it to yellow, that would bring the value up, and link it more with the warmer brights I have... but I'm afraid that'll destroy the color identity of the green.

Really lousy forest test:

[Lee N]

Green is not only an important colour because it's used alot, but also because humans see green better than any other colour, and will be able to tell banding alot easier - even with a high colour count. A 16bit distribution of RGB565 is not uncommon simply because green is so much more important than the other two components.

Feel free to put me in the "more greens" camp

[Helm]

actually, how about this?

[LoTekK]

After playing around a bit with the palettes, I'm beginning to understand Prom's hard-on for that dark cyan. Helm, yours seems to be a good deal higher key than Prom's, and the dark low-sat purple feels rather warm for a universal shadow, especially against black. Also, your greens do an odd shift from warm light, cool mid, but slightly warmer dark, which feels a bit jarring, imho. I'm playing with a slightly modified version of Prom's, with a very slightly lighter and warmer mid-green, and a less-saturated yellow, and so far it's working out nicely for a darkish forest scene unabashedly similar to Prom's example. The only color in all the palettes so far that I'm not too sure about is that garish orange.

[Helm]

if another dark color is needed after my dark purple (though I don't think so), I'd prefer to unify one yellow and the brightest flesh shade (towards the flesh shade mostly) rather than lose one of the greens. dark forests could be done with the mark 13 palette anyway. It's the not so dark forests that are troublesome.

[LoTekK]

I'd probably tend to agree with you about the unification of the light yellow and flesh. I did actually forget to mention in my previous post that the higher-key palette you provided might be a better "universal" one than prom's, in that it would likely cater better to not-so-dark environments.

[Helm]

same experimentation, my variation.

[Conceit]

whoa dont get all touchy on me now helm  I meant that more as a regret, like I missed my chance. The whole fad was a good thing, it made people  aware that it was posible to build ramps in more than one way FAR more than my ever-repeating preaching on "hue-shifting" ever did.

Ha, Ptoing is such a good sport, I soooo should've said "ptoing's c64 craze" instead 

hrm, I thought one dark warm shade and one dark cold shade would be enough, but I am starting to see how that is a problem O_o

[Arne]

Thanks for the crits!

Here's an experiment.

I merged Yellow with Skin as suggested. I want it to work with explosions (which are common) but maybe it's a bit too yellow though. But Yellow is used for both Lego heads and Smileys, so maybe it's possible to get away with it. Real skin color is more towards pink-gray of course. However, maybe I can offset the yellowness with the skin shadow color which is purple.

I lightened the skin shadow color a bit to bring it closer to the skintone yellow, and take it away from the red so it can work as a higher value for that.

Light sky blue (cyan) was greyed a bit. it's more realistic as far as skies goes, and less obnoxious to look at. Doesn't work aswell as a plasma/energy color now though.

I lightened brown, and maybe the dark brown as well.

I did stuff with greens cuz I now had a new color cuz of the skin-yellow merge. I'm a bit disgruntled by the fact that I don't have a good mid tone green now. If I want a pure green object, ZX Spectrum style, I only have a light green and a dark green. The eye is indeed more sensitive around the greens. I think, to avoid banding, one can use dithering with advantage, since plants tend to be gritty. The sky on the other hand is more sensitive, so deliberate banding or decorative clouds will have to be used. I recall Ptoing did a mockup with cloud mountains which worked rather well.

I kept my darling darks.

I pretty much stole Helm's tree.

[Helm]

Ha, Ptoing is such a good sport

Yes, he's very efficient. You should see him work the ovens with a smile 

Arne:

I am happy with this. I don't see anything potentially breaking at a first glance. The yellow skin color is fine for a SPRITE... we'll have to check it out for a bigger portrait or something, but I suspect what with the grays and purple shadows and stuff it'll be okay. Barring a few test runs in different mockups, I'm ready to give the difinite thumbs up.

Will mockup later tonight.

edit: I really don't think anyone will ever need a skin tone they cannot find, as the way I see it, all of the 'yellows' ramp can substitute, dither, and enhance the two 'main' skin tones.

[tomas]

Really nice palette you got there. I had to do something with it so I whipped up this quick mockup. Crits are very welcome.



EDIT: I opened a new thread for this in case someone wants to c&c to stop this thread from potentially being cluttered with irrelevant posts.

[LoTekK]

Potentially stupid question: we've got 16 colors including black, correct? What happened to transparency?

tomas, that looks nice so far, but seems rather unfinished, notably the cliff edge, dirt, the tree (highlighting on right side is too uniform, needs to be broken up a bit, and the foliage needs the silhouette broken up a tad, imo).

[Lee N]

Potentially stupid question: we've got 16 colors including black, correct? What happened to transparency?

Transparency can be any of the available colours. On a system where you are allowed to use 4 colours per sprite and tile, the 4th colour is used to define transparency leaving 3 colours to paint with.

[Helm]

Potentially stupid question: we've got 16 colors including black, correct? What happened to transparency?

This is a global palette, not the palette of a single sprite. Any sprite that uses some of the colors of it can reserve one (one that obviously it will not use on the sprite itself) and set it in code to transparent, if one were to program something using it.


edit: vanquished

[Rosse]

Potentially stupid question: we've got 16 colors including black, correct? What happened to transparency?

Because tranparency isn't a color technically. You have to know that a picture with a palette is just a "bit-map", you have for each x and y coordinate a value from your palette. And transparency means one specific value which isn't drawn from the computer.

[Helm]

We need more people to explain this.