Interpolating background color continuously

ModernMonkeys

Hi there,

I have created a simple background where the color is constantly interpolating in a natural way. Basically, my code i something like this :

When self.color.red = 1 && self.color.green = 0 && self.color.blue= 0
Interpolate self.color.green to 1

When self.color red = 1 && self.color.green = 1 && self.color.blue= 0
Interpolate self.color.red to 0

When self.color green = 1 && self.color.blue= 0 && && self.color.red= 0
Interpolate self.color.blue to 1

and so on... an endless colorful cycle.

I have noticed thought that whenever one of the color reach its 100% (1), the color kinda jumps to it in a very unnatural way. Like if it was jumping from 0.90 to 1 instantly instead of using the interpolate action.

Has anyone experienced this or is this just lag on my crappy computer? How does it translate on the phone screen?

Thanks!

Socks

I'm not sure if the interpolation glitch was fixed in PC GS, or if it was even in PC GS in the first place, but it sounds exactly like the interpolation glitch, it does exactly what you describe, it jumps from 0.9 to 1 missing out 10% of the last whole number of the interpolation, so if you are interpolating over a small value (1 in the case of colour values) then it's very visible.

It also world the other way, interpolating down from 1 to 0 will clip off the last 10% too (0.1 to 0).

Fix: interpolate from 0 to 1.112 instead of 0 to 1 - this pushes the little glitch outside of the range of colour values.

Even better dump all the interpolates and rules and use three constrains, constrain each colour channel to a sine wave, offset each sine wave by 120 deg, and then clip the top and bottom off the sine wave . . . II'll try and post a demo a little later (not at my computer).

Socks

I see you are on a PC, so I'll just type out the code rather than supply an OSX demo . . .

(top image) spectrum with clipped peaks.

Constrain R to sin ( self.Time *100 ) + 0.5
Constrain G to sin (( self.Time *100 ) + 120 ) + 0.5
Constrain B to sin (( self.Time *100 ) + 240) + 0.5

The '100' is the speed at which the colour cycles through the spectrum.

(bottom image) a more blended spectrum . . . (the peaks of the sine wave are not clipped)

Constrain R to (sin( self.Time *100 ) /2 )+.5
Constrain G to (sin(( self.Time *100 ) + 120) /2 ) + 0.5
Constrain B to (sin(( self.Time *100 ) + 240) /2 ) + 0.5

Socks

...

ModernMonkeys

Works like a charm! Thanks again!

This is the moment I realize my math are now far far away in my memory... Sin, cos and tan feels like alien language to me...

ModernMonkeys

Is it normal that large image (aka the background) still lags (not at the end, but through the whole process) with this method?

Socks

@DoctorPimp said:
Is it normal that large image (aka the background) still lags (not at the end, but through the whole process) with this method?

You've not given any information about this large image background - like its size/resolution, what it's doing, whether it's moving or animated (etc etc) so I can't really comment.

ModernMonkeys

Size : 160x480 in the creator. 2 times (I have 2 backgrounds that both take half the screen).
24-bit png.
72 dpi.

Not movable, not animated. It's mostly white and grey shapes who gets colored through the process inside gamesalad. Nothing that would make any game lag in a normal case.

Socks

@DoctorPimp said:
Size : 160x480 in the creator. 2 times (I have 2 backgrounds that both take half the screen).
24-bit png.
72 dpi.

Not movable, not animated. It's mostly white and grey shapes who gets colored through the process inside gamesalad. Nothing that would make any game lag in a normal case.

Thanks for the info . . . in what way is it lagging ?

Hopscotch

@DoctorPimp‌ , I do this in my inbetweener line runner (with heart ).

Full screen iPad background, plus other images, are blended and cycle in hue with no lag issues.

https://itunes.apple.com/us/app/hell-escape/id892608212?mt=8

ModernMonkeys

Instead of changing colors smoothly, it looks like the game is at 1 or 0.5 fps and the color change is brutal. It works well on another actor that is a simple white square even if I make it fullscreen, so I guess the problem is with my image itself.

Maybe the fact that it is imported...

Maybe the fact that the image has some white/grey gradients... (If I could post it I would.)

Hopscotch

@DoctorPimp, just tried it on a PC version of GS and don't notice a problem, image or no image.

ModernMonkeys

Weird... I guess it wouldn't lag on an Iphone but it's gonna be a pain in the ass to test the game while building it.

ModernMonkeys

Actually... Just found how I can resolve the problem. Instead of making 1 actor for the whole background, I'll just make one blank actor without importing it and I'll add imported dark shapes at 10% transparency. Lot let demanding for the system, and I can actually give the illusion that the background is moving.