Graphics Eye Pleasing Water (Art Critique)

RujiK

Member
A little over a year ago I asked for art suggestions on my water. I am finally trying to finish my water and asking for more feedback.

I want shorelines I can be proud of. Observe!

1. Wave (Note bottom tiles)................2. Wobble


3. Sparkle .......................................... 4. Glow/Pseudo wave


Which is better?! A mix or a few tweaks is on the menu as well. All of these are heavy WIP.

UPDATE!:
5. Mix of 1,2,3
 
Last edited:

BLang

Member
I think a combination of 1 and either 2 or 3 would be best.

But what I think could use the most work is the water animation itself. It just looks a bit stiff right now.
 

aamatniekss

Member
The first one looks the best imo. The waves make it seem like the water is actually there, but for others the constant scrolling without the waves, just makes it look like its some sort of reflection of the sky or its a hole to another dimension or something like that. Also it seems that the water might be moving a bit too fast.
 
D

darthlupi

Guest
I vote for the Wobble of 2! The waves look more realistic with the slight randomness. Waves don't wall splash at the same time on a shore.
Dynamic! That is the word.

Either one is SWEET though. Nicely realized water man.
 

RujiK

Member
Thanks for the comments guys. It looks like 4 is the loser and maybe 1 and 2 are the winners. I'll try and work out some kind of combo and post back. More comments are still appreciated.

But what I think could use the most work is the water animation itself. It just looks a bit stiff right now.
[water] look like its some sort of reflection of the sky or its a hole to another dimension or something like that.
After I get the shore looking okay, I plan on actually animating the water texture itself.
 

FredFredrickson

Artist, designer, & developer
GMC Elder
I definitely prefer the first. The shoreline is a little too pulse-y, but aside from that, I think it's great.

The water in the first example is also good - it doesn't need much more work beyond that, depending on the look you're going for.
 
F

F_Clowder

Guest
I like the little hint of water on the shorelines (1) and the random sparkles of (4).

How about instead of the water moving only one way, i.e. from right to left, have the water movement go a few frames to the left and then a few frames to the right and then reverse, etc. That way the illusion of movement is more natural rather than clinically just going one way. This water example you have for us is a pond, not a river. Hope that makes sense. Anyways, like it overall.
 

FredFredrickson

Artist, designer, & developer
GMC Elder
How about instead of the water moving only one way, i.e. from right to left, have the water movement go a few frames to the left and then a few frames to the right and then reverse, etc. That way the illusion of movement is more natural rather than clinically just going one way. This water example you have for us is a pond, not a river.
If you had a pond with the wind blowing ripples into it from one direction, that would create the effect you see here. Kinda.

That's how I'd justify it anyway. ;)

I agree though, it might be nice to see the water cycle like that.
 
S

Snail Man

Guest
I'd say a combination of 1 and 3 looks the best. 3 has a bit more "noise" or randomness which adds realism, but 1 is the actual movement you want
 
F

Fuzenrad

Guest
Exactly, 3 is closest to a real movement to be a bit random, but still tries to remove this displacement effect of the water.
 
C

CoreGG

Guest
I like the first one. You can combine it with the third one tho, might look good!
 

RangerX

Member
I prefer the first one. The movement of the water and the edges animations feels less "detached from each other" than the other choice and the edge animations on the beach side is way better.
 

RujiK

Member
OKAY! I tried to combine 1,2,3 (Sorry F_Clowder, only you liked 4) but I kind of cheated on combining the waves of number 1. Waves tend to make the tiling obvious, so I'm wondering if I can get away with random splashes instead of shorelines having waves. Here is mock 2:

5. Mix of 1,2,3


More sparkles? Less wobble?
(I also edited the main post if you want to compare side by side)
 
G

graviax

Guest
I like it better but my brain don't understand why the water is flowing to the left and disapearing in the grass. I know it's to show that this is water but, I look at little too fast.
 

RangerX

Member
It scrolls fast and that "middle water" if I can call it that way is too static in style compared to borders. If you'd make it wobble and move, it would look better. Now the middle water looks disconnected from the edges animations.
Also, beach on the south side, I prefer the effects you had in #1
 

RujiK

Member
As I mentioned earlier, the water texture/surface is still placeholder. I plan on drawing an actual animation instead of just a pixel shift. That should fix the problem with the water going nowhere thing.

@RangerX
I'll work in more edge splashes in the next update. Also changing the texture will hopefully fix the "disconnection" between surface and edges.

Thanks for the comments guys. I'll be back with an update in a few days/years or whatever.
 

Cpaz

Member
OKAY! I tried to combine 1,2,3 (Sorry F_Clowder, only you liked 4) but I kind of cheated on combining the waves of number 1. Waves tend to make the tiling obvious, so I'm wondering if I can get away with random splashes instead of shorelines having waves. Here is mock 2:

5. Mix of 1,2,3


More sparkles? Less wobble?
(I also edited the main post if you want to compare side by side)
This Is what I was thinking. Honestly, I like it the best.
 
E

Ethanicus

Guest
@RujiK - I like the end result, but I agree you need less "wobble."

@CamperLv - Wow, that's sweet! Really complicated, but I get the concept!
 
X

Xskode

Guest
OKAY! I tried to combine 1,2,3 (Sorry F_Clowder, only you liked 4) but I kind of cheated on combining the waves of number 1. Waves tend to make the tiling obvious, so I'm wondering if I can get away with random splashes instead of shorelines having waves. Here is mock 2:

5. Mix of 1,2,3


More sparkles? Less wobble?
(I also edited the main post if you want to compare side by side)
I think it would be much better if
1. was not as fast but more relax
2. turn the wobble down just a tabbit
3. a little less sparkles or, not making the sparkles appear that fast back to back

applying those things should make the water look more natural and relax and nicely animated.
right now, there is to much attention in the water's effect than in how awesome the water looks and behave
 

Yal

šŸ§ *penguin noises*
GMC Elder
I was going to chime in that in real water, waves don't actually move water laterally, it just makes bits of the water run in circles... the tutorial @CamperLv dug up doesn't state that, but the end result kinda shows a similar effect.

Also, for things like this where you'll need to operate on multiple similar images in a row, I'd suggest making use of GM's save-as-strip / load-from-strip functionality so you can save the masks as a single image, paste on a single image consisting of repeats of the water, do operations, and THEN load it as an animated sprite instead. Not sure if you use GM's editors that much, but if you do, that functionality is pretty useful in situations like this.
 
K

Kululu17

Guest
Hi, I think the last one is showing great improvement. I have tried water before and was not able to get this good of results. But something about the continuous movement of the water (the underlying pattern) seems out of place with the rest. I have seen this pattern before in animated water, but was never able to get it to move in a nice looking fashion. I think the trick is that if you use a pattern that shows those pentagon shaped peaks, each of those would in reality comprise several different waves, which would be moving in different directions, so the actual shape of each pentagon would be constantly changing. For my game, I was able to get "ok" results by using a sprite with moving highlights (sparkles) where the peaks would be.

Are you going to have just lakes and ponds in your game? Or rivers too? I would be curious to see how you handle rivers.

Please keep posting your progress!
 

RujiK

Member
(I don't have weekend internet, so I didn't read any of the new comments before making this update.)

@CamperLv I actually tried implementing that exact tutorial but I didn't like the end result. I have a screenshot I might post later.
@Ethanicus, Xskode I'll try tweaking some wobbles if you still think it looks too much in 1x zoom. Also thanks for the detailed response Xskode.
@Yal Thanks for the advice, I use GM editor. Also how the heck do you have 300 posts already?! And your an elder now?! Where have I been...
@Kululu17 Ponds, lakes, rivers, and oceans. Unfortunately I am not sure I will be able to have special cases for rivers and streams since all water is a single texture.


UPDATE #3
1. WIP animated surface
2. Re-added waves. Waves now occur randomly instead of on every tile to avoid tiling.
3. Slowed down the water shifting. Unfortunately, any slower looks jerky.
3. Also How does it look at 1x instead of the previous 2x?

Fun fact: I now loathe animating water surfaces.
 

BLang

Member
Well, I think the edges of the water look really good now, not much there that can be improved in my opinion.

The water surface, on the other hand, still looks jarring. I don't think it should 'flow' at all. What @CamperLv suggested might be a much better choice. Since you don't like the end result, maybe try making a similar effect that would work with this?

Also, and this might just be me, but now that I see it at 1x, I can't help but think that the water looks a bit too involved and too turbulent. The waves are too small for what looks like a still body of water. Maybe think about making the water texture bigger?
 
F

Fuzenrad

Guest
Hey man, i don't want to criticize the way you work, but do you know the KISS methodology?

KISS is an acronym for "Keep it simple, stupid", this principle states that most systems work best if they are kept simple rather than made complicated, therefore simplicity should be a key goal in design and unnecessary complexity should be avoided.

I see there is an enormous concern with "how the water will move" (and it shows that you care about your own work, and it's really good), but have you thought that this may slow down your project?

Excuse my sincerity. Best regards.
 
Last edited by a moderator:

Ninety

Member
Well I think this is a vast improvement and possibly about as good as you'll get it. The water moves enough to suggest direction but not so much that it looks weird, and the random waves are nice and make for some good visual variety. The main thing that bothers me is that the animation on the edges of the land has a slower frame rate than the water itself, but like others have said, at some point you have to call it done.
 

Yal

šŸ§ *penguin noises*
GMC Elder
I see there is an enormous concern with "how the water will move" (and it shows that you care about your own work, and it's really good), but have you thought that this may slow down your project?
From how I interpret the first post, the OP wants to improve their water in general, not just for one project. (Which seems like a pretty sound time investment to me... water is the least questionable/intrusive invisible wall so making it look good benefits a lot of games)
 
K

Kululu17

Guest
Hello again,

So if I may ask, the technique you use is a mask to cover everything that is not water, and use a water layer that moves at a constant speed??? And then sprites for the bubble and ripple effects?

I have toyed with everything from using objects instead of tiles where ever there is water (thus allowing animation), or just using tiles but drawing semi-transparent sprites on top. Mixed results, but it does allow you to differentiate between river and lake. And since you need an object on top of the water to block players from falling in, I figure it doesn't hurt performance that much...
 
Pardon me asking but i like that water, thats some nice water

do you have some way to easily impliment it in a game? like as a drop icon you can put in a room and it will map the shore around the shape of the combined water mass?

if you do or can do that could you upload it for other people to use, either here or over in the market place please.

only thing left it really needs is some leaves, fish wandering around anf some birds bobbing up and down and this would be very impressive exspecially if it was on a hand held console.

thank you
 

RujiK

Member
I'm explaining my game a lot in this post so I figure I might as well post a devlog instead of these post-by-post mini-devlogs.
So, Check out my devlog! (It has cool gifs)


@BLang Unfortunately CamperLv's wave effect is extremely "Tiled" looking when its in 1600x900 resolution. See the image below and note the horizontal repition. Animated, the repition is significantly more noticable.
Earlier prototypes for water: (Stolen sprites)


@Fuzenrad That is good advice, and the water has slowed me down a bit, but as a huge fan of fluids in games, I wanted to go the extra mile for my liquids.

@Ninety I hadn't thought of syncing the shore with the water ANIMATION, but I went ahead and synced them. The water SHIFTING, however, can't be synced with the shores without tripling the frames of the shores. Too much work for little profit unfortunately.

@Yal Actually, it's just for one project but this one project is my entire gamedev career. It will be years of work if I ever finish it.

@Kululu17 Block the player from water?! With all this work you know I gotta let the player jump in and swim! :p There are no specific objects for the water, splashes, or shore, the whole thing is run by a single control object that runs almost the whole game. Also I've been posting small screenshots, but the game world/room is huge. (See devlog for more info) Objects for every 16x16 water tile would be over 5 million objects. Even if I just checked what was on screen, in 1600x900 that would be 5625 objects to check/draw. It's definately possible, but it would be a big performance killer. I know how cool flowing water is, so I might return to this some day if I ever get better at shaders.

@JML Leaves on water? That is an awesome idea! Also that you would possibly consider paying for this on the marketplace is a huge compliment, so thanks! The water is very easy to implement in my game (See devlog for it in action) but it is ONLY easy to implement in MY game. I don't use the room editor (Made a custom ingame one), tiles, or objects for the landscape. So really, to get this to work I would pretty much have to upload the whole engine to get the water to work. Sorry mate, but I'm not ready to do that. Thanks again though.

@RangerX Yes, but not scrolling looks really weird. Like the water is jumping up and down. It doesn't really even look like water but more like pinched fabric.

@Niels, @Snail Man Thanks guys. Positive feedback is very encouraging

And just for fun, here is what the water looked like in early 2015. (There was no animation. Not on the surface or the shores.)


Man, that was a long reply.
 
X

Xskode

Guest
(I don't have weekend internet, so I didn't read any of the new comments before making this update.)

@CamperLv I actually tried implementing that exact tutorial but I didn't like the end result. I have a screenshot I might post later.
@Ethanicus, Xskode I'll try tweaking some wobbles if you still think it looks too much in 1x zoom. Also thanks for the detailed response Xskode.
@Yal Thanks for the advice, I use GM editor. Also how the heck do you have 300 posts already?! And your an elder now?! Where have I been...
@Kululu17 Ponds, lakes, rivers, and oceans. Unfortunately I am not sure I will be able to have special cases for rivers and streams since all water is a single texture.


UPDATE #3
1. WIP animated surface
2. Re-added waves. Waves now occur randomly instead of on every tile to avoid tiling.
3. Slowed down the water shifting. Unfortunately, any slower looks jerky.
3. Also How does it look at 1x instead of the previous 2x?

Fun fact: I now loathe animating water surfaces.
This does look alot better than the others. and I do think this would do just fine.

however, since I read you mentioning
@Fuzenrad That is good advice, and the water has slowed me down a bit, *but as a huge fan of fluids in games, I wanted to go the extra mile for my liquids.*
if you just want to try to improve the water a little more, then the only issue that seems to stick out (to me) is the speed- however, the more I study the picture the more I believe it's the speed at which the wobbles happens or, how strong the wobbles are, that gives the illusion of the water moving faster than it actually is. which can come across as slightly over agitated water.

In your image look where the red circle is (in the image below) and you will see that the water
is moving from the right end of circle to the left at a nice speed. this is why I think the strength of the wobble is the cause for false perception of it's speed.
noticewaterspeed.png

however, I do think this water would work fine in games, but if you want to try and perfect it, maybe you can reduce the strength of the wobbles a little bit.
and I think i looks way better at 1x instead of 2x.
 
W

Wraithious

Guest
looks really awesome! I like #5 or #2, don't know about the random white circles in #5 tho, id maybe leave those out or use them sparringly.
 
T

ThompMel

Guest
I think number 2 was best in the original and your update looks good to me. I wish I was that good at water...
 
Top