pouët.net

Go to bottom

Fading with limited colors.

category: gfx [glöplog]
Hey dudes.

How do you make a nice fade from white to black with a limited set of colors.

I'm writing a "demo" for virtual machine i have designed and written. It has 4096 colors and i need to do a nice fade from white to black. Since there is only 16 different levels of gray i would like to extend this by using some more colors.

I have seen nice fades from white to black on the c64 using far fewer colors.

Is there any general function for doing this in arbitrary color spaces.?
Dithering.
added on the 2014-07-29 12:48:49 by kusma kusma
and in the case of fixed palettes, sorting the colors by luminosity (and discarding colors with too large RGB-space distance)
added on the 2014-07-29 12:50:10 by kusma kusma
you have your gfxslave define a nice colorslide from black to white in the required amount of steps
added on the 2014-07-29 12:50:39 by britelite britelite
Also, making the fade rapid decrease the risk of "getting caught".
added on the 2014-07-29 12:51:18 by kusma kusma
if everything is fixed, you can just draw the pixels with a clever (pseudo random) pattern. it would very much look like fading ;)

Dragon Fade
BB Image
added on the 2014-07-29 12:55:18 by HellMood HellMood
That's pretty much what Kusma meant by "dithering", I guess. :)

A strictly linear fade does not look that good imho, so I'd go with a "brightness hick-up" in the look-up function. Takes some experiments to see what suits best.
added on the 2014-07-29 12:58:16 by tomaes tomaes
Set up a table of all colors, sorted by luminance...use it, done!
The c64 has 16 colors, only by interlacing you get the amount of 256 different colors...
...the 16 colors given having some given amount of rgb does not help your task! ...except you sort em by luminance again! ;)
So the sorting is the way to go if you want some smooth (?!?!?!) fades!
( pre-sorted setup-table! )
END_OF_STORY!
what everyone said.

on c64 color fades only cares about luma, if you do it at 50fps the eye cant make out the colors really. 16 levels of gray are more than enough for a nice fade, if you want to extend the duration then try ordered dithering between adjacent grays.
added on the 2014-07-29 13:10:55 by Oswald Oswald
Thanks dudes!

Dithering is not really an option. I will look in to sorting them by luminescence!
you can make them fades look better (own styled) by resorting your pre-sorted-table btw! ;) just a hint, everyone needs its own style, so try not to COPY but being ORIGINAL! ;) 256 colors should be enuff to choose from! (except for some simple fade to black!) ...i hope you get what i tried to imply! ;) :)
Some people are making colored fade, ie you start by fading R+G value then B value.
added on the 2014-07-29 13:24:44 by baah baah
I ended up just using the 16 shades of gray. Sorting colors by luminescence was unnecessarily complicated and I'm somewhat pressed for time.
But it turned out just fine:
BB Image
sure! ;)
what "limited" set of colors of what "limited" hardware are you using there, please?! :p
DEINE OMA!
4096 colors. Which is the worst chise of color.

Its for the FML vm. Its a VM i have designed from scratch. And I'm making a demo for it.

I designed it with ease of use in mind. Its a hybrid stack register machine with a very straight forward RISC ISA using only 29 op-codes.

I have written an assembler for it as well.
Oh and it uses a 32bit signed integers for everything.
too many opcodes.
added on the 2014-07-29 14:39:43 by visy visy
Nae. I dint want people (which is pretty much just me) to have to write their own multiplication and division subroutines.
And then it supports two different kinds of conditional branching.
Sorting on luminance shouldn't be hard if you designed the VM yourself?
Then I assume you hardcoded the 4096 RGB values yourself as well.
The REALLY cheap way is to just have:
Y = (R+G+B)/3
Something slightly more accurate for linear RGB space would be this:
Y = 0.2126 R + 0.7152 G + 0.0722 B
Then you have your list of 4096 luminance values... just sort, et voila.
added on the 2014-07-29 15:12:52 by Scali Scali
what if you switch very fast to simulate color. For example on a black and white only display you would switch black / white to simulate gray (in a efficent way for eg using some pattern to avoid flash). perhaps 60fps is not enough for that.
added on the 2014-07-29 15:13:59 by Tigrou Tigrou
temporal dithering sounds better than it looks, at least on modern monitors :/
added on the 2014-07-29 15:23:33 by kusma kusma
4096 colors? 16 gray? i assume you use rgb4 direct. not palettized. well then do bit sh*t. with the red green blue shades of gray. 64 grays. or use dithering. but it looks ugly imo at that resolution.
added on the 2014-07-29 15:35:03 by yumeji yumeji
Gradient or fade? If it's a gradient and it's text, I'd say stick with 16 shades. Images tend to look a lot better with dithering.

If it's a fade in/out, I'd seriously try the colour options. I just did an experiment, with 16 shades per colour component. A pure greyscale fade in/out was very noticeable. A "colour interpolated" fade looked pretty smooth, and the colouring was barely noticeable.

All I did was to get the coloured fade was:

Code:if (1st frame) red++ if (2nd frame) green++ if( 3rd frame) blue++ [repeat]


I.e. the r,g,b values don't change together, they're staggered.
added on the 2014-07-29 17:50:15 by psonice psonice
Quote:

If it's a fade in/out, I'd seriously try the colour options. I just did an experiment, with 16 shades per colour component. A pure greyscale fade in/out was very noticeable. A "colour interpolated" fade looked pretty smooth, and the colouring was barely noticeable.


Interesting. There is a part of the demo where I do image fading. Ill look in to it.
Got inspired to play around with it a bit. Here's few first sorted-by-luminosity-with-increasing-difference-from-middle-gray-ramp-things. Probably with some bugs.

As you can see, the further difference from the mid-gray we accept, the more error creeps in.. I didn't bother doing the difference calculation by calculating actual saturation, it's simply (abs(avg-r)+abs(avg-g)+abs(avg-b)). The first few work pretty well though..

BB Image
added on the 2014-07-29 19:52:18 by sol_hsa sol_hsa

login

Go to top