Vertex Paint Flow map and flow map visualisation

-
There aren't many tutorials to go with when it comes to Vertex painting Flow maps. I was going to use the concepts that are in UnrealSimon's Flow map Tutorial: https://www.youtube.com/watch?v=tEr3NE_XLbc  But luckily I found one tutorial by TharleVFX which uses more or less the same process as the flow map texture technique in Unreal Simon's tutorial but uses vertex painting the way I want it: https://www.youtube.com/watch?v=hDH25HnFneQ.

I also wanted a way to visualise the Flow map and distortion of the water system. It can be difficult to see in different lighting conditions especially with the unlit water system I have made. I remembered an old twitter post by H.Kudo:



I really like how he added arrows to help visualise the flow direction. However, From the way, the arrows were casting shadows. it seems to be a blueprint and I wanted it to be a material. I really wanted to add the arrows but I didn't know how to rotate an arrow texture in the material. However, towards the end of the video, He added grid texture as a secondary way of visualising flow maps. So I thought I'd use that if I have no luck in adding in arrows.

I was able to find a UE4 marketplace asset, Aquatic Surface by Krystian Komisare (https://www.unrealengine.com/marketplace/en-US/slug/aquatic-surface) that shows arrow visualisation within the material really well. I might purchase his content in the future and study how he has done this but for now I am sticking with the grid visualisation technique instead.

Aquatic Surface by Krystian Komisare - Vertex Paint Flow map with arrows to help visualise the direction of flow

Here is vertex painting in action for my water system along with the grid visualisation:



This is the final feature I wanted to add to the water system. It's now onto combining everything such as integrating Gerstner waves and adding subtle changes. But the main focus is on creating the environment.

Comments

Post a Comment

Popular posts from this blog

Environment Showcase Concepts

-
Image
I thought it's about time to start working on creating the environment to showcase the water in the best way possible. It was suggested that I create this really cool Skull Waterfall environment concept art by Andrey Egorov: However, I will be using this concept as my initial inspiration and will be making my own iteration to the environment so it will not look exactly the same as the concept. It takes a bit of time figuring out and creating some of the features for the water shader. While I do this, I can work on creating the environment so I will be working on the water shader in small increments.
Read more

Distance Field water foam

-
Image
Distance Field Foam Vectortoradialvalue, DistanceFieldGradient used for U channel and DistanceToNearestSurface used for V. I thought about how texture coordinates worked and how VectorToRadialValue worked. Both being gradients in R(U) and G(V), I had a theory about creating coordinates based on using Distancetonearestsurface node as G(V) channel and have VectorToRadialValue or Distancefieldgradient node as the R(U) channel. I was initially going to use the DistanceFieldGradient node that I learned about when making the distance field flow map. This is because the node had that Texture coordinate look to it but it adds a lot to the shader instructions so I went with VectorToRadialValue node. I extracted and used maths for the R channel from VectorToRadialValue and it produced the coordinates I wanted. I then added this coordinate to the noise based foam I made earlier using Alex Vinogradov's approach. I later decided to add Distancefieldgradient node just to see if it pro
Read more

World alignment (Tri-planar mapping)

-
Image
From reading the UE4 documentation, I found out that material functions are a bunch of nodes packed into one node. I figured out the Math behind how world alignment works by deconstructing and experimenting with the World Aligned Texture node. This node is one example of a material function. It is also widely known as Tri-planar mapping in substance painter. Material Function for Tri-planar mapping  This gave me the idea to make a block out material which can have grids, scale without texture stretching and change colours the way I want it to. I also wanted to add the functionality of animating the material. I did this by making some modifications to the World Aligned Texture material function. Modified Material function with comments to help understand which part is doing what. I found that substracting the WorldPosition from the Object Position will force the material to move along with the object and not have a weird scrolling effect whenever you move the object.
Read more