Jump to content

  • Log In with Google      Sign In   
  • Create Account


Coding gradiant transitions


Old topic!
Guest, the last post of this topic is over 60 days old and at this point you may not reply in this topic. If you wish to continue this conversation start a new topic.

  • You cannot reply to this topic
14 replies to this topic

#1 riuthamus   Moderators   -  Reputation: 4864

Like
0Likes
Like

Posted 05 September 2012 - 03:33 PM

We have a small issue with our skybox now. We have been using two color tones and blending them... the issue with this is we are getting the following:

Posted Image

Now, being an artist I know that when I use photoshop if I try to create a manual gradient using two colors is generally a bad thing. You get this procedural look like you see here. When you use the gradient tool you get a very nice and smooth transition from point a - b. Question is, does anybody know how many points they are using to create such a nice smooth look? Is there a better equation or system we should be using to generate the sky? With our HDR in place now I feel that our sky is lacking.... and I want to get the best from it that we possibly could.

Any and all suggestions are welcome. Thanks in advance.

Sponsor:

#2 quiSHADgho   Members   -  Reputation: 325

Like
2Likes
Like

Posted 05 September 2012 - 03:49 PM

You could try Atmospheric Scattering to get a realistic sky with nice transitions.
http://http.developer.nvidia.com/GPUGems2/gpugems2_chapter16.html

#3 riuthamus   Moderators   -  Reputation: 4864

Like
0Likes
Like

Posted 05 September 2012 - 03:57 PM

I think we had something like that, problem was for me to get values i wanted... i didnt understand it. And telanor was too lazy to make me a tool to get it to work. I had to load up photoshop, create a subtractive layer and then play with inverse coloring to try to get the right colors. If I ever wanted orange or blue it would totally mess up the entire system.... ( again probably because I did not understand the complex systems behind it. )

I think he will kill me if I make him go back to that system! Then again I will kill him if I have to spend 50 hours a night trying to get colors right. Hm... okay thanks for the link though. I found a few other good suggestions as well by doing some searching, none of them really answering what I was looking for but good enough solutions indeed.

For example, we found this guys article and code and attempted to work with that:
Click here for the website

and while many of the results were great I could not find a happy answer to some of the stuff that I wanted to control. If i used bright blue or bright orange I would get a massive green... could have been because it needed the HDR like the GPU Gem one did... ( which we now have ) The other issue was he had 50 variables that we knew not what they were, again because we kinda just grabbed it and started to play with it.

float InvOpticalDepthNLessOne = 1.0f/255.0f;
float InvOpticalDepthN = 1.0f/256.0f;
float InnerRadius = 6356.7523142;
float OuterRadius = 6356.7523142 * 1.0157313;
float PI = 3.1415159;
float NumSamples = 20;
float fScale = 1.0 / (6356.7523142 * 1.0157313 - 6356.7523142);
float2 v2dRayleighMieScaleHeight = {0.25, 0.1};
float2 InvRayleighMieNLessOne = {1.0f/255.0f, 1.0f/127.0f};
float3 v3SunDir = { 0, 1, 0 };
//float ESun = 20.0f;
//float Kr = 0.0025f;
//float Km = 0.0010f;
float KrESun = 0.0025f * 20.0f;
float KmESun = 0.0010f * 20.0f;
float Kr4PI = 0.0025f * 4.0f * 3.1415159;
float Km4PI = 0.0010f * 4.0f * 3.1415159;
float g = -0.990;
float g2 = (-0.990) * (-0.990);

So, yeah... so that is why i turned to this wonderful place again. Sorry, i feel so needy some times... :(

Edited by riuthamus, 05 September 2012 - 04:20 PM.


#4 Radikalizm   Crossbones+   -  Reputation: 2828

Like
1Likes
Like

Posted 05 September 2012 - 05:05 PM

You can find a cleaned up and more documented version of O'Neil's atmospheric scattering implementation as proposed in GPU Gems 2 on his website: http://sponeil.net/
The implementation really does need a proper HDR pipeline to get good results, but with the added documentation it becomes much easier to play with all the inputs

I gets all your texture budgets!


#5 riuthamus   Moderators   -  Reputation: 4864

Like
0Likes
Like

Posted 05 September 2012 - 06:05 PM

That looks simply amazing! we do have an HDR setup though so we should be good, thank you for this link.

#6 Radikalizm   Crossbones+   -  Reputation: 2828

Like
2Likes
Like

Posted 05 September 2012 - 06:48 PM

That looks simply amazing! we do have an HDR setup though so we should be good, thank you for this link.


If you want to add more wow-factor and a more realistic scattering implementation you should take a look at the technique proposed by Bruneton and Neyret, on which a paper can be found here

This technique is quite a bit more complex though and requires some pre-processing, so if you just want a believable and simple approach the O'Neil implementation should do just fine Posted Image

I gets all your texture budgets!


#7 riuthamus   Moderators   -  Reputation: 4864

Like
0Likes
Like

Posted 06 September 2012 - 12:32 AM

The only problem we can see with oniell is, it still suffers from the color gradient issue. I have made an example here:

Posted Image

https://dl.dropbox.c...ame/skygrad.png ( incase the top link doesnt work )

Anyway, the issue is that with photoshop I can make one that is very smooth. I have seen other big game names have the same issue ( skyrim ) so maybe it is not possible to fix it... it is just really annoying to see.

I realize the previous image was a bit dark for low contrast monitors so...

Posted Image

If you notice the methods of rendering are different. Our sky and some other skys do this straight line of color while photoshop does this dither pixelation process. Does anybody have any idea how one might go about doing that?

Edited by riuthamus, 06 September 2012 - 12:46 AM.


#8 Ashaman73   Crossbones+   -  Reputation: 7134

Like
2Likes
Like

Posted 06 September 2012 - 12:53 AM

Your issue could be the machband effect.

The problem is, that you try to blend very dark values. HDR will not help you here as long as you do map your sky to these dark values. HDR normally tries to map an high dynamic ranged image to the whole available color value range of your monitor. This would increase the contrast and therefore to a steeper gradient, which should reduce the machband effect.

#9 riuthamus   Moderators   -  Reputation: 4864

Like
0Likes
Like

Posted 06 September 2012 - 01:09 AM

So my understand is HDR would actually help the issue?

#10 Lauris Kaplinski   Members   -  Reputation: 841

Like
2Likes
Like

Posted 06 September 2012 - 01:34 AM

As I understand your banding is caused by the mapping of smooth gradient (either HDR image or calulated floating-point color values) to 8-bit color channels. You cannot get rid of these bands unless you introduce some dithering.
As a test you may try to add some low-intensity high-frequency (pixel) noise to you color values before sending these to framebuffer. Or even better - add the noise before smapling gradient values so the bands will be smeared aout a bit.
Lauris Kaplinski

First technology demo of my game Shinya is out: http://lauris.kaplinski.com/shinya
Khayyam 3D - a freeware poser and scene builder application: http://khayyam.kaplinski.com/

#11 riuthamus   Moderators   -  Reputation: 4864

Like
0Likes
Like

Posted 06 September 2012 - 02:14 AM

How would you suggest adding that noise? A texture? Perlin equation?

#12 Ashaman73   Crossbones+   -  Reputation: 7134

Like
1Likes
Like

Posted 06 September 2012 - 04:28 AM

Play around with your tonemapper.

Instead of an almost 1:1 mapping like
[0..0.1] => [0...0.1]
you need to expose the upper values in this concrete scene more, something like
[0..0.1] => [0...0.5]

Here's a great link about different tone mapping algorithms.

#13 riuthamus   Moderators   -  Reputation: 4864

Like
0Likes
Like

Posted 06 September 2012 - 04:48 AM

Ah, well thank you for that. Saw that before but didnt really understand how that would help with this. Maybe i will mess with that tonight when i get a chance and report back. Thanks again for all the responses here.

#14 mikiex   Members   -  Reputation: 237

Like
1Likes
Like

Posted 06 September 2012 - 04:31 PM

In the past while working on the front end of a console game I used a very subtle noise texture mixed with a pixelshader gradient and the result was pretty good for reducing banding. I cannot remember exactly how I modulated the noise with the gradient. It pretty much removed banding - but I do not know if there are better solutions than this, My example was a simple 2d scene though so might not be a great example.

Edited by mikiex, 06 September 2012 - 04:32 PM.


#15 riuthamus   Moderators   -  Reputation: 4864

Like
0Likes
Like

Posted 06 September 2012 - 11:09 PM

I will look into that process, thank you for all the replies.




Old topic!
Guest, the last post of this topic is over 60 days old and at this point you may not reply in this topic. If you wish to continue this conversation start a new topic.



PARTNERS