[Art] Water at Night
Onewing

Disclaimer: All who contribute will be properly notified in my game credits under specific topics.

This is a question on my continuing project. Some previous threads are Simulating Water and Generating a Wind Model.

The project is coming along nicely. The following screenshot is from the current version. It features a planet consisting of only red rock and water that was added at different locations by the user (== me) during gameplay. Assume you are looking at this planet from far away. The sun (or the star this planet is revolving around) is on the left side while the moon is on the right side (setting up day and night).

And now for the question, is the water on the night side suppose to be so dark you can't really see it or should it be an even brighter blue than the hilly/mountainous terrain? Right now, I have it as the darker version (with faint sparkles).

http://comp.uark.edu/~spsilve/terrain7.JPG

Comments appreciated.

miran
Quote:

Right now, I have it as the darker version (with faint sparkles).

??? Right now the right half of that picture is completely solid black. At least that's what I see...

HoHo
Quote:

And now for the question, is the water on the night side suppose to be so dark you can't really see it or should it be an even brighter blue than the hilly/mountainous terrain?

In my oppinion, when it's dark it is dark. Unless there are some lights sources like big cities, fires of phosphorous animals you shouldn't see anything because there is no light there.

Of course if you don't want to achieve too good realism but just make it usable for players it is a whole different story. I personally would like it to be almost black but still lit enough to see the important stuff. What you have right now is a bit too dark I think.

You could take a look at xcom or ufo:aftermath/shock series to see how they have done it.

BAF

I can faintly see the water on the right side. But, as HoHo said, make it as visible as it needs to be to be usable to the player.

Onewing
Quote:

Unless there are some lights sources

The moon provides a dim bluish light on the right side. You can barely see it.

Quote:

I can faintly see the water on the right side.

You're actually seeing the high mountains. On the left, the higher the ground is, the brighter the red. When the moon is full and in the midst of the darkness, it makes the higher ground bluish with a faint hint of red (kind of purply).

Quote:

make it as visible as it needs to be to be usable to the player.

There will be an option to turn off light sources and be able to view the entire playfield. SimCity 4 goes from Night to Day and back, but you can opt to keep it at daytime always. There will be a bar at the bottom to indicate what time it is and where on the planet, as well as where the moon is and what phase it is on.

Here's a link to a pic that might paint the picture better. It looks light the water is slightly lighter than the ground, but I think I might still keep it the way I have it currently.

[EDIT - UPDATE]
Here's now what it looks like. Modifications: increased lighting, water is brighter, optimization of code.

http://comp.uark.edu/~spsilve/terrain8.JPG

HoHo

Much better but a bit higher contrast would probably be even better.
Currently the water and mountains are a bit too dark on the light side. If it would be lighter you wouldn't have could use a bit more light on the dark side without losing the difference between day and night.

Heh, that sounded too much like Star Wars :P

Onewing

Better? I've increased the contrast by 15%, which turned out to be just a one line addition.

Thanks for the input, I really appreciate it. I'm trying to keep regular updates on my blog (see sig) if you want to know more about where the game is going. I don't imagine your that interested, though. ;)

HoHo

It does look better but does it only seem so or is there a single spot of light on that map?
I tried to outline it in the attatchment.

[edit]
something is wrong with the atatchment, I'll fix it right away

[edit2]
fixed

Onewing
Quote:

It does look better but does it only seem so or is there a single spot of light on that map?

I'm not sure what you are asking, but yes, the sun light source is the single spot of light centered in the circle you drew. It is suppose to get darker (slowly) until the moon light source takes over on the right side. The moon light is not nearly as strong and centered (if it were offset, there'd be an even darker area where the moonlight and sunlight didn't reach)in the darkest spot of where the sun doesn't reach.

HoHo

OK, that explains it. I thought you had the light source placed the same way as on the Earth picture you linked before.

Also I just understood you don't have a spherical planet but flat one :)

Onewing
Quote:

Also I just understood you don't have a spherical planet but flat one

Yeah, I went back and forth on whether I wanted a spherical or flat planet. I decided flat would still convey my, I guess, vision of what I'm intending. If this project turns out well, my future plans for a sequel would involve a spherical planet and using OpenLayer.

Credits will be given soon unless someone else interjects. :)

Vasco Freitas

This isn't related to your question, but when I first looked at your image I thought that the water was the sky, the white dots on the water were stars, and the red parts clouds maybe... IMHO, I think you should dim down the sparkles in the water, I think they are way too white (and maybe there should be less of them).

The transition of the color of the water that's close to land to the black in the deep water doesn't seem right either, I don't think it should be completly black, but just a darker shade of blue.

In the last image you showed, I think the dark side is very well on the bottom half, if you want it possible to see the land. The top half is pitch black, that doesn't look good, it's difficult to understand if there's land there or if it's water.

Just my opinion... :)

Onewing
Quote:

I think you should dim down the sparkles in the water, I think they are way too white (and maybe there should be less of them).

The sparkles are actually generated from highly unstable water and/or from lack of adjacent nodes to move to. This creates sparkles at the shoreline and where the water is deep and (supposedly) wavy. Still pictures look like some kind of nebula in space, but when it's in motion I think it is better, IMHO. When I have this functioning a little better, I will probably have an executable for testing instead of just screenshots.

Quote:

I don't think it should be completly black, but just a darker shade of blue.

I agree and was thinking the same thing. It's still blue, but it is so dark it appears to be black. I'll just raise the cap rate for how dark the water can be.

Quote:

In the last image you showed

The attached file a few posts up or the last one within the post?

Quote:

Just my opinion...

Couldn't ask for more. :)

Vasco Freitas
Steven Silvey said:

but when it's in motion I think it is better

Yes, animated probably looks much better.

Steven Silvey said:

The attached file a few posts up or the last one within the post?

The one within the post, I didn't notice the attached file. The attached image looks pretty good to me :)

Onewing

Just a small update plus giving credits.

http://comp.uark.edu/~spsilve/terrain8b.JPG

Now I have my revolving Sun & Moon. Plus, the Moon goes through phases. Here the moon is on it's Waxing Gibbous phase and is slightly off centered from the darkness, thus, the dark area is not as blue as it could be.

The little line indicator will be able to be turned off.

Fladimir da Gorf

I'd recommend changing the red to green, brown or gray, for example.

Onewing

The original concept was to only work with red, green and blue. Red for rock, green for grass, blue for water. However, since then, it's evolved a little more. The concept is still starting from a new planet of red rock (hopefully something like Mars) and adding water (which the player does) which eventually leads to clouds, flora and lifeforms. That's where I'm going with it at least. ;)

Fladimir da Gorf

Well, that's not the color of Mars anyways. And it doesn't look very "rocky" for me... it looks like some red fog.

Onewing
Quote:

Well, that's not the color of Mars anyways.

I was wondering when somebody was going to call me on that. ;) Fortunately, out of the 10 people or so I showed it to, none of them actually commented when I said "imagine you are on Mars." If the number were higher, yeah, I'd probably change it. Again, the original idea was kind of just manipulating rgb values without getting complex.

Quote:

And it doesn't look very "rocky" for me... it looks like some red fog.

There's no shading going on here. The intensity of the red is simply based on the height of that node. Now, I do take the returned value and add or subtract about 5 from it to give it more of a texture. Those screenshots are low quality JPEGs, so they blend all that into a single mesh. I should have said something about that...

BTW, what color(s) is the rock like on Mars? I knew it wasn't just red, but I wasn't sure on the exact color. However, I guess the more important question should be, what color of rock would it be for a brand new planet (from the cooling of a star)?

Fladimir da Gorf
Quote:

Again, the original idea was kind of just manipulating rgb values without getting complex.

You could write your own mixing function which you could use everywhere. Or steal one from OL ;)

Also I'd suggest using a texture instead of a single color. Even a simple texture would increase the quality of the graphics a lot. I actually have some surface textures that I've made if you might need some.

Vasco Freitas
Steven Silvey said:

BTW, what color(s) is the rock like on Mars?

It should be more brown, something like Red: 175, Green: 65, Blue: 10 (from 0 - 255)

Onewing

Well, just to test it out, I threw green intensity to be red intensity divided by 2.73 (which is 175/65). Do you guys like this better than the red planet? I'm not sure if I like it, it feels too...Earthy to me.

I'm supplying a link to a higher quality bitmap so you can see that it is slightly gritty.

Test Planet

Vasco Freitas

I think the red version looks better (although doesn't look at all like Mars), but anyways even if the color is like Mars (I think that in this image it's a bit too saturated, maybe decreasing both red and green a bit (more red than green) would be better) I don't think it's ever going to look like Mars if there's water :) Anyways if you want to make the color like Mars just compare it with a foto of Mars and keep tweaking until you think it's right :)

The grittyness is nice but there isn't any on the lighter spots, and I think the light spots are too light, and they are the same color in a big area, it should be more gradual.

Are you trying to imitate existing planets or create imagined ones?

Onewing
Quote:

Are you trying to imitate existing planets or create imagined ones?

Well, I'm creating imagined ones, but I want them to imitate existing planets as much as possible. It doesn't have to be dead on, this isn't for NASA or anything, it's just a game.

Quote:

The grittyness is nice but there isn't any on the lighter spots, and I think the light spots are too light, and they are the same color in a big area, it should be more gradual.

That's because those spots have reached the maximum height, therefore having maximum color of 255 (meaning I can't add to make them gritty). This can be fixed easily by just making the max height higher. I could cap the color at 240 or so, that way I could still add/subtract at the highest spots and keep it from being too bright. Neither cases are very high on my priorities.

While tweaking the colors, I'm planning the next phase of temperatures and atmospheres (and then ice & evaporation, then wind, then clouds, then flora, then...). Whatever happens, it's a lot of fun making it (I just hope that ends up being fun to play it). :)

Fladimir da Gorf

Are you using OpenGL, by the way? What about using proper lighting and shadowing? That would look great.

Richard Phipps

The problem is the land looks flat because of the lack of shading (or pillow shading to use an 'art' term). If you added a simple lighting effect based on the bump map effect it should look a lot better.

Onewing
Quote:

If this project turns out well, my future plans for a sequel would involve a spherical planet and using OpenLayer.

Quote:

Are you using OpenGL, by the way? What about using proper lighting and shadowing? That would look great.

Nope, I'm just using allegro, no add-on libraries. Due to time restrictions, I'm not going to tag on any library that I haven't worked with before. I am planning to expand my knowledge this summer.

I know (more like...'knew') the shading would be somewhat an issue. However, I really don't find it essential to the game itself, even though I'm trying to be realistic as possible. With my limited knowledge in the field, the limit as I approach a totally realistic simulation is infinity (amount of time). Thus, I have to make sacrifices to make sure the game continues progress. If all turns out well, I can revamp it for my next sequel.

I will, however, take a short look at possible means of shading. I'll limit myself to one hour of design/programming on it and if it can't be done in that time, I'll move on.

Fladimir da Gorf

Making some simple lighting would be easy - just calculate the dot product between the slope and the sun direction. Remember that unless you want to treat sun as a directional light, you'll need to calculate the direction of the sun at each point. In OL terms, but can be used anywhere: (~ is normalization)

Vec2D lightDir = ~( point - sunPos );
float lightIntensity = -( lightDir * slopeNormal );
if( lightIntensity < 0.0 ) {
  lightIntensity = 0.0;
}

Onewing
Quote:

Making some simple lighting would be easy

It was, although the current lighting scheme doesn't look at the mountains, it's more like putting a lamp over a sketch/picture of "mountains".

Quote:

Vec2D lightDir = ~( point - sunPos );

Let me make sure I understand this, if the point is on the left, lightDir will be 1 and if the point is on the right of the sun, lightDir will be -1? And I'm drawing a blank on the slopeNormal (probably because I'm at work and not suppose to be browsing forums).

[edit] - btw, you never commented on the brown-ish terrain if you liked it better than the red.

Fladimir da Gorf
Quote:

[edit] - btw, you never commented on the brown-ish terrain if you liked it better than the red.

Well, they both look a bit unrealistic...

Quote:

if the point is on the left, lightDir will be 1 and if the point is on the right of the sun, lightDir will be -1?

Well, if you think of the vector as a 1D vector, then yes.

Quote:

And I'm drawing a blank on the slopeNormal

That's the normal of the slope of the hill at the processed point. You could calculate it by finding 3 points around the point and calculating the normal with them.

relay01

I have nothing to contribute to this conversation because I know not what you speak about. I am a certified allegro newbie but... Thought I'd put my name out there... carry on

Onewing

Okay, I tried to draw out some numbers to see if I could make some sense of them. I'm going wrong in the logic, so feel free to inform me where and/or what I'm doing wrong. (This is the first time I've used any vector math in any thing other than a classroom that was poorly taught [even the teacher was falling asleep as he lectured]).

Okay, let's get some concrete numbers to work with:

                V2
                *
             (100,101,52)

   V1                          V3
   *            *              *                                            *
(99,100,48)  (100,100,50)  (101,100,49)                                 (200,200)

Assume the above dots are nodes in the graph where the parenthesis gives (x,y,z) where z is the height of that node. The (200,200) is the location of the sun. Let's say we are calculating the light at point (100,100,50). You said pick three points to calculate the normal. Should I take the cross product of these three locations? I searched for a quick refresh session on cross and dot products that led to this:

GameDev.net - Vectors and Planes

It says I only need two vectors on a plane to find the normal vector? And if I should take the cross product of three vectors, should I take the cross product on V1 and V2 to find a new Vc to cross product with V3?

Whatever the case, I'll try to step through your procedure anyway.

//from graph above
lightDir = ~(point - sunPos)
         = ~((100,100) - (200,200))
         = ~(-100,-100)
         = (-1,-1)

Assuming the sun is always higher, the lightDir vector would be (-1,-1,-1)

//from graph above
slopeNormal = V1 X V2 X V3
    V1 X V2 = {(100 * 52) - (48 * 101),
               (99 * 52) - (48 * 100),
               (99 * 101) - (100 * 100)}
            = {5200 - 4848, 5148 - 4800, 9999 - 10000}
            = {352, 348, -1}
    V1XV2 X V3 = {(348 * 49) - (-1 * 100),
                  (352 * 49) - (-1 * 101),
                  (352 * 100) - (348 * 101)}
               = {17052 - -100, 17248 - -101, 35200 - 35148}
               = {16952, 17349, 52}
               = slopeNormal

Phew, I know this can't be right, but I'm gonna keep pluggin' numbers...

//Now for the dot product (assuming GameDev's code section of the dot product is correct
lightIntensity = -(lightDir * slopeNormal)
               = -((-1,-1,-1) * (16952,17349,52))
               = -((16952 * -1) + (17349 * -1) + (52 * -1)) 
               = -(-16952 - 17349 - 52)
               = -(34353) = -34353

So might lightIntensity came out to -34353. I plugged these numbers because I wanted to show that I am trying to figure this out without you babying me all the way, but I just haven't done enough of this kind of math to know the logistics of it. It's definitely a lot more complicated than my "the intensity of a pixel is it's height in proportion to the Max_Height * sunlight where sunlight = ((m * distance_from_sun) + b) / 100"

See, I told you, now I've spent too much time on this subject when I could've have been making progress. :-/ (although, thanks are in order)

Fladimir da Gorf
Quote:

= (-1,-1)

That vector doesn't have the length of one. Instead the length is sqrt(2).

Quote:

So might lightIntensity came out to -34353.

In that case it might not be wrong - the slope just isn't facing the sun, but is in the dark side of the hill. Of course to further improve the quality of the graphics you could add some constant light intensity to lit up the dark areas.

Quote:

See, I told you, now I've spent too much time on this subject when I could've have been making progress.

Well, sooner or later you'll have to improve the graphics, too...

Onewing
Quote:

That vector doesn't have the length of one. Instead the length is sqrt(2).

I'm getting the unit vector mixed up with normalization. What exactly does normalization do?

Quote:

the slope just isn't facing the sun, but is in the dark side of the hill.

According to the graph above, I can't imagine that to be true, unless there were some higher heights from 101 to 200, but that wouldn't make sense either, considering the formula doesn't look at any of those coordinates.

Another problem I have is this formula doesn't seem to take into affect how bright the light source is. Lastly, if 34353 was the intensity, I can't just multiply that with whatever color the ground is, it was produce some monstrous number, unless, that's what suppose to happen.

HoHo
Quote:

What exactly does normalization do?

It sets the vector lenght to one. That means you divide every vector coordinate by the lenght of the vector.

Onewing

Hmmm, okay, if I take the (-100,-100) and normalize it, I get approx. (.71, .71). Would the Z still be -1? Or am I suppose to do the dot product with a 2 dimension vector and 3 dimension vector(which I thought I couldn't do)?

[edit] - typo

[edit] - If I move the sun to (101,101), I will get the same lightDir (as one would expect) and therefore, the exact same lightIntensity as if the sun were at (200,200), that can't be right...

Fladimir da Gorf
Quote:

Another problem I have is this formula doesn't seem to take into affect how bright the light source is. Lastly, if 34353 was the intensity, I can't just multiply that with whatever color the ground is, it was produce some monstrous number, unless, that's what suppose to happen.

Naturally you can just multiply the results with whatever you want. But the results should be in range [0, 1], there's something wrong with the calculation if you get such big numbers. Did you remember that the surface normal must be normalized as well?

Quote:

Or am I suppose to do the dot product with a 2 dimension vector and 3 dimension vector(which I thought I couldn't do)?

Heh, I forgot to say that all vectors and positions should be, in fact, 3D. That must be one of your problems.

Quote:

[edit] - If I move the sun to (101,101), I will get the same lightDir (as one would expect) and therefore, the exact same lightIntensity as if the sun were at (200,200), that can't be right...

Except that the formula is used in every 3D game/program out there...

Onewing
Quote:

Except that the formula is used in every 3D game/program out there...

I wouldn't be trying out these numbers if I thought this was all bogus, and I know you know what you are talking about, I'm just trying to get a good grasp of it myself. ;)

No, I never normalized the final value from the cross products, which is indeed a "d'oh" moment, considering the name, slopeNormal. But let me make sure, do I have to take the cross product of three vectors? Does it matter which three vectors I choose? And is there a method for doing the cross product on three vectors at the same time, or do I have to do it like I did above?

Quote:

But the results should be in range [0, 1]

That's what I wanted to hear.

Fladimir da Gorf

You just need two vectors: (point1, point2) and (point1, point3), for example. Then get a cross product between those two.

Onewing

Hmmm...something isn't working right. I've spent the past few hours making sure everything is as posted, but without a proper understanding of what's going on, I can't seem to tweak it right.

The Cross Product makes sense to me, but what is the Dot Product producing? Anyways, here's some results of the new code (keep in mind the moon is still trying to shade the right side). The first image is the normal (except for the far left side of the screen, which has already started converting to the other formulas).

The second screen is the result from the code posted below.

http://comp.uark.edu/~spsilve/terrain10a.JPG
http://comp.uark.edu/~spsilve/terrain10b.JPG

Code that is being used:

1class VECTOR
2{
3public:
4 float x;
5 float y;
6 float z;
7.
8.
9.
10 
11float VECTOR::length()
12{
13 return (sqrtf( (x * x) + (y * y) + (z * z)));
14}
15 
16void VECTOR::normalize()
17{
18 float temp = 1/length();
19 
20 x *= temp;
21 y *= temp;
22 z *= temp;
23}
24 
25float vDotProduct(VECTOR v1, VECTOR v2)
26{
27 return (v1.x * v2.x) + (v1.y * v2.y) + (v1.z * v2.z);
28}
29 
30VECTOR vCrossProduct(VECTOR v1, VECTOR v2)
31{
32 VECTOR vTemp;
33 vTemp.x = (v1.y * v2.z) - (v1.z * v2.y);
34 vTemp.y = (v1.z * v2.x) - (v1.x * v2.z);
35 vTemp.z = (v1.x * v2.y) - (v1.y * v2.x);
36 
37 return vTemp;
38}
39 
40//The function that determines the intensity of the light
41float PLANET::find_light(int x, int y)
42{
43 //Declarations
44 VECTOR v1, v2, vPoint, vSun;
45 VECTOR lightDir, slopeNormal;
46 float light_int;
47 int x1, x2;
48 int y1, y2;
49 
50 //setup vectors
51 x1 = x - 1;
52 y1 = y;
53 x2 = x;
54 y2 = y + 1;
55 if(x1 < 0) x1 = MAXX - 1;
56 if(y2 >= MAXY) y2 = 0;
57 
58 //Technically, x1,x2,y1,y2 will always be either -1,0 or 1, the z's will not
59 v1.x = x1 - x;
60 v1.y = y1 - y;
61 v1.z = ground[x1][y1].height - ground[x][y].height;
62 
63 v2.x = x2 - x;
64 v2.y = y2 - y;
65 v2.z = ground[x2][y2].height - ground[x][y].height;
66 
67 //The point needing its light intensity
68 vPoint.x = x;
69 vPoint.y = y;
70 vPoint.z = ground[x][y].height;
71 
72 vSun.x = sun; // sun moves during the game
73 vSun.y = 240; // The screen height is 480
74 vSun.z = MAX_HEIGHT;
75 
76 //Algorithm given by Fladimir
77 lightDir = vSubtract(vPoint, vSun);
78 lightDir.normalize();
79 
80 slopeNormal = vCrossProduct(v1, v2);
81 slopeNormal.normalize();
82 
83 light_int = -(vDotProduct(lightDir, slopeNormal));
84 if(light_int < 0.0)
85 light_int = 0.0;
86 
87 // Increase light strength
88 light_int = light_int * 100;
89 if(light_int > 1.0) light_int = 1.0;
90 
91 return light_int;
92}

Any ideas? (And yes, I know that the DotProduct and whatnot functions are already written somewhere and there probably was no need to rewrite them. Oh well).

[EDIT - Food for thought]
From the pictures, the light looks inverted (lighted where it should be shaded and heavily shaded where it should be light). This means the x,y of the hill are going the opposite way of the light source x,y. Look below:

                X    Y     Z
slopeNormal     +    +     -
lightDir        -    -     -
DotProduct      -    -     +

Since the light_int takes the negative of the DotProduct, if the DotProduct comes out to positive, then it will be negative, which will be less than 0, therefore, equalling 0. Thus, somehow, slopeNormal.z * lightDir.z > (slopeNormal.x * lightDir.x) + (slopeNormal.y * lightDir.y).

Fladimir da Gorf

Yeah, it looks like the intensity is inverted. Could you try not inverting the results of the dot product?

Onewing

I tried, but it wasn't much better. Imagine taking a negative of that picture above.

I think it has something to do with the points that I'm picking for figuring the slopeNormal. I tried several different values that led to several different results.

The scope of the world is basically 640 X 480 X 30000.

Thread #577910. Printed from Allegro.cc