HOME | DD
World-of-NoeL β Water Temple - Wave Tutorial
Published: 2014-04-16 11:14:02 +0000 UTC; Views: 19624; Favourites: 679; Downloads: 289
Redirect to original
Description
EDIT: Just realised step 4 should be (base, peak, base, trough), not (base, peak, trough, peak).A few people had asked how I did the waves in my Water Temple ( world-of-noel.deviantart.com/a⦠) so I made a tutorial. Sorry if it's hard to follow - I'm not the best teacher.
Depending on how you shape the masks and which direction you offset each frame you can create waves in any direction you want.
Related content
Comments: 49
π: 0 β©: 0
Hy,
Thank you so much for this tutorial. I was looking for a long time how to animate water pretty simple.
I have made a windows app to generate a animation strip from a texture and a mask image to make it easier if you want base on your tutorial. here (drive.google.com/drive/folders⦠)
Again thank for this.
π: 0 β©: 1
Thanks, that should be helpful!
π: 0 β©: 1
π: 0 β©: 0
Hey World-of-NoeL, thank you so much for the tutorial. I think I managed to replicate the result fairly well and I do like how it looks. Proper water animation tutorials have been hard to come by, so I'm thankful to you for putting this together. I have posted the result of my efforts here -Β www.pixilart.com/art/world-of-β¦ with your name and a link to this tutorial. I have encouraged other users to come look at this. My post is almost a complete replica of your finished animation, and I don't want this to come across as art theft. If you would like me to remove this post, please let me know and I will do so.Β
π: 0 β©: 1
Looks good to me! I've got no problem with it.
π: 0 β©: 0
Helps alot! 
π: 0 β©: 0
I really wish I understood the terminology a bit better so I could follow your tutorial. I need it dumbed down >.>
I LOVE the effect, and want to try and do something similar, I just... can't brain it.Β
I tried doing this, though my result wasn't as smooth or nice :/
My tiles are 64x64, so i shifted 8px per frame. It ended up feeling choppy and didn't look nearly as nice. Maybe I have to go with 4px down per frame and increase frame rate? idk -_- Not happy wiht my results. MORE PRACTICE NEEDED!
π: 0 β©: 1
This example shifts 1px for a 16px tile, so shifting 4px for a 64px tile for eight frames should have a similar result. That said, at higher resolutions the animation can appear choppier than at lower res so you might need to go with even more frames again.
Sorry the tutorial's a bit hard to understand. Any part in particular you're having trouble with?
π: 0 β©: 1
I think I kind of figured out how to do it overall. Just that the program I'm using doesn't allow me to make masks and is very limited on what I can do. It lacks the freedom programs like Photoshop has.
However, due to my higher resolution, and disinterest in painstakingly working through so many frames, I think I'll have to work a much more subtle animation.
π: 0 β©: 1
Grab Graphics Gale. The free version should be good enough, it's lightweight and pretty simple to use.
Oh, I should mention that the "masks" I'm referring to here aren't "layer masks" or anything fancy, they're just flat colours that you cut+paste on top of the graphic. Even MSPaint can do this.
π: 0 β©: 0
Very cool. I take it you have other Tutorials handy?
π: 0 β©: 1
Thanks, but unfortunately no I don't. Not much of a tutorial guy.
π: 0 β©: 1
Ok fair enough. I also assume you must have some Tutorials that you've followed to create your work, correct? If so which one and where?
π: 0 β©: 1
Kiwinuptuo had some good ones before he deleted his account, but here are two of his good ones:
web.archive.org/web/2013102904β¦
web.archive.org/web/2013070408β¦
Some more can be found here: web.archive.org/web/2013072419β¦ but I was never a fan of the way he lit the undersides of objects.
π: 0 β©: 1
Oh Yeah! I remember this guy's Tutorials! Some years back when I tried to learn Pixel Art--and failed miserably at it--I saw some of his on this site. The ones that caught my eyes were the Tree one, the Textures and the Shading. THANK YOU!!!!! I've been trying to find his Tutorials but to no avail! Dude you're a LIFESAVER!!!!!
What is this web archive thing? This something dA created to retrieve lost Artwork and other Resources from ex-Members? Is this how I can find stuff from Members not around anymore?
π: 0 β©: 1
No, the "Wayback Machine" (Google it) let's you scan the archives of the internet collected by a non-profit organisation, so many things that have since been deleted can still be found there - not just deviantART, but everything on the web. If you can remember the old members' usernames you could search for "username.deviantart.com" and very likely find their old art.
π: 0 β©: 1
Ahhhhh I see. That's a pretty nifty Search Engine.
π: 0 β©: 0
Helpful. I should save this for a game of my own.
π: 0 β©: 0
You are a genius! Thanks so much for this, is a incredibly clever way to do water tiles!
π: 0 β©: 1
Haha, you're welcome.
π: 0 β©: 0
This is super interesting, thanks so much for sharing!
π: 0 β©: 0
Wow, this effect is super cool.
π: 0 β©: 0
Gahhh thank you so much for this your really awesome for sharing such a genius method
π: 0 β©: 1
A mask! I never would have thought. This is amazing!
π: 0 β©: 0
great tutorial! Not hard to follow at all
π: 0 β©: 0
I don't understand any of this, but it looks brilliant.
π: 0 β©: 0
The last thing we need is another Water Temple.
"Ocarina of Time" is an example.
π: 0 β©: 0
it is a very good tutorial (y)
thanks for sharing
π: 0 β©: 0
This is something new to me, and very effective. Great effect you achieved there and you had an interesting approach to the topic. I admire that.
π: 0 β©: 0