Color effect

All topics about ZGameEditor goes here.

Moderator: Moderators

Post Reply
User avatar
rrTea
Posts: 475
Joined: Sat Feb 15, 2014 9:54 am

Color effect

Post by rrTea »

I'm thinking of implementing an effect that would make the whole screen look as if it were rendered in 8 bit palette. The effect should look something like in the attached screenshot - note the glitchy effects on the background etc. This particular example was done by just recording the screen and reducing it to 256 colors. Ideally there could also be some dithering effects and varying color fidelity for a slightly "gif-y' effect.
https://imgur.com/wuGbA2r

How would I go about this? Right now I draw the screen using one single RenderTarget, so I assume the next step would be to plug a shader into the Material that I use to draw the RenderTarget texture? Or?...
Last edited by rrTea on Thu Mar 22, 2018 10:11 am, edited 1 time in total.
User avatar
Kjell
Posts: 1876
Joined: Sat Feb 23, 2008 11:15 pm

Re: Color effect

Post by Kjell »

Hi rrTea,

Basically yes .. but there quite a few different dithering algorithms ( each with their own specific look ). Attached are two simple examples; one that simply reduces the output to 256 colors / 8-bit ( red and green are 3-bit while blue is 2-bit ) and another one that dithers the output using ordered dithering ( Bayer matrix ).

By the way, i'd strongly recommend not going this route. Your game is already "difficult to read" at times due to the low resolution. Reducing the color-depth would only make this worse ( in my opinion ).

K
Attachments
256.zgeproj
(2.08 KiB) Downloaded 414 times
Dither.zgeproj
(3.8 KiB) Downloaded 429 times
User avatar
rrTea
Posts: 475
Joined: Sat Feb 15, 2014 9:54 am

Re: Color effect

Post by rrTea »

Gave it a quick test - it works! I tried using it in my current project - actually looks pretty good... for the most part ;) (but there are some things that turn into a mess). Right now I don't really understand how it works so I'll have to study it a bit before trying to (eventually) use it seriously. Still, good to know this is how it's done, thanks!
User avatar
Kjell
Posts: 1876
Joined: Sat Feb 23, 2008 11:15 pm

Re: Color effect

Post by Kjell »

Hi rrTea,
rrTea wrote:Right now I don't really understand how it works so I'll have to study it a bit before trying to (eventually) use it seriously.
The way that it works is that the screen is divided up in blocks of 8x8 pixels ( using modulo ). Each color component of those pixels are compared against a value from a 8x8 dithering threshold matrix ( you can find these values on Wikipedia ). So when you want 3-bit depth ( just like red and green in the example ), you multiply those components by 7 ( 3-bit ranges from 0 to 7 ), use the floor as the base-value and test whether the remaining fraction is above or below the dithering threshold for that pixel.

K
User avatar
rrTea
Posts: 475
Joined: Sat Feb 15, 2014 9:54 am

Re: Color effect

Post by rrTea »

Yes, I thought so - after a bit of testing it seems this approach can't work well for my particular situation without significant tweakings.

The actual game itself looks almost the same but without even going into the whole readability issue, some things look almost unrecognizable, especially the parts where lots of gradients are used (the banding takes over the whole image - cutscenes etc).

Too bad, some parts look very interesting rendered like this, especially various fadings. I'll try to use this for some other things.
Post Reply