A major aspect of Cursed Voyage involves sea travel. We are in the process of experimenting with a variety of water tiles! Animating isometric tiles can be tricky and was searching for isometric water tutorials myself. Since I had very little luck I decided to create my own method. I’ve included some animated guides for this 16 frame tile animation. The tutorial water is different from the above example, but the process is the same.
The first thing you will want to do is create your water tile! For Cursed Voyage we are working with a tile size of 64×32. Figure out the type of water you want to create. In this mockup example I was aiming for a tropical island. For water during a storm you might want to double the stagger height.
Now you have tiling water with waves! But what if you want water that isn’t moving in a specific direction? Having non directional water is more subtle and you don’t have to worry about interacting with objects at a specific angle.
Great! Now the water is non directional. But there is one little problem. By placing the transparent tile on top we’ve introduced new colours! It looks a bit blurry and not like the pixel art we intended it to be. Thankfully this just requires some minor tweaking.
And there you have it! Looping Isometric water tiles. Play around with the staggering for different results. Please leave a comment if you have any questions or feedback.