Intro to Flow Maps [UE5]

Hello! Today we're looking at Flowmaps in Unreal Engine! This is a great alternative to Panners and offers much more flexibility for effects like oceans, rivers and lakes as well as fluid sim effects and rain effects. You can have variability in speed and direction without sacrificing quality, and they can all change at runtime!
----------------------------
Buy my Prismatiscape Interaction Plugin for $34.99!
UE Marketplace: www.unrealengi...
Gumroad: prismaticadev....
-----------------------------
Pastebin for the FlowMap Function I created:
blueprintue.co...
-----------------------------
Patreon: / prismaticadev
Twitch: / prismaticadev
Discord: / discord
KZbin: / prismaticadev
Twitter: / prismaticadev
----------------------------
Computer Specs:
Ryzen 3900x 12-core CPU
MSI Geforce RTX 2080 Super
64GB Corsair RAM
One of those fancy nvme m.2 SSD's
Programs of choice:
Unreal Engine - (Game Dev)
Blender - (Animation and Modelling)
OBS - (Video/screen capture)
Davinci Resolve - (Video editing)
Adobe Photoshop - (Graphics and Texturing)
ProTools 11 - (Compositions and mixing)
OldSchool Runescape - (The best game)
Filmed using:
Sony A7s2 body
Sony 24-70mm f/2.8 GM lens
Yonguo YN360 LED's for colour
Yongnuo YN760 chip LED w/ Godox softbox for key
My lovely cats names are Boycat, Girlcat and Ladycat :)

[@mijocasper6423]

i think this dude deserves a windows licence key donation

[@Bife_A_Lo_Vulnerable]

Love how he starts from a small example and the last minute of the video is an eldritch chaos of nodes

[@PrismaticaDev]

@@Bife_A_Lo_Vulnerable oh this is nothing compared to some material graphs… hahaha

[@Haukett]

without fail, every time i run into a weird niche issue (like wind direction changing at runtime! or object pivot points for foliage instances, or so many other things) you always come in clutch with a wonderful video explaining how it all works and how to do good and useful stuff. For everything that you do and all the time you put into it, thank you

[@PrismaticaDev]

@@Haukett happy to help! :)

[@YourSandbox]

U grew up as a strong tech artist. Keep doing your stuff, great progress

[@PrismaticaDev]

@@YourSandbox means a lot from you

[@SpinnyHat]

Another banger from the man himself thank you for what you do!

[@PrismaticaDev]

Thank you for watching :)

[@oo_ashton_oo3897]

Thank you for this tutorial! I could not find any other KZbin video that explains flow maps. You are great at what you do and I appreciate your help!

[@rocker10039]

Bro is literally reading my mind. I am struggling so hard with making a water shader and flow maps were one of the things that has 0 good information out in the internet.

[@PrismaticaDev]

Hope this can get you pointed in the right direction!

[@mehface]

To be fair, that's 90% of unreal xD

[@NorthernPixels1]

I have been so insanely intimidated by flowmaps I've always just defaulted to UVs and masking all the seams and jank with hacks. The game I'm working on has a lot more dynamic/complex and frankly massive world that I can't be doing that, and I just gotta say this tutorial made things a lot clearer to me. Thanks for putting out these resources, you're a king.

[@hristozafirov7110]

Still waiting for render target and rvt tutorials 🙏 You're the best, thank you for the awesome tutorial once again! ❤

[@PrismaticaDev]

RVTs video is the next big long one! Hopefully doing a few smaller ones inbetween :)

[@workflowinmind]

@@PrismaticaDev Can't wait, I learn better thanks to your accent

[@Cz_Dani]

@@workflowinmind lol

[@UlshaRS]

Doing a project whose graphic theme is based on a water flow and this is such a excellent explanation of the map and underlying math.

[@Erieanna1234]

Absolutely love your content; you're always the first place I check when I need to learn something new (or remind myself). Can't wait for your next video.

[@MonsterJuiced]

You just significantly boosted the quality of my basic water without me having to rely on ninja fluids. Thank you! :)

[@PrismaticaDev]

@@MonsterJuiced happy to hear it! Don’t forget you can use flow maps for a tonne of other effects too :)

[@MonsterJuiced]

@PrismaticaDev I'll have fun thinking of ways to use them in different situations haha. Maybe flapping flags and large leaves

[@MonsterJuiced]

@@PrismaticaDev Hey so I was experimenting with the flow map, I realised that if the red channel = right then green must = left. So I made a texture with a flow mask on red for the main river direction, and then a flow mask on green to create bounceback flow from the edges and obstacles. However only the red channel is being red for the direction and I can't figure out how to make the green channel apply. Is it me or is this shader not working with green like that?

[@PrismaticaDev]

@@MonsterJuiced It's actually Red for Left/Right, and Green for Forward/Backward (or the other way around) You use negative values in the RG channels for the backwards directions, however when they're in a texture they need to be 0 for backwards, 0.5 for stationary and 1 for forwards. You'll need to "unpack" the texture manually (unless it's being sampled as a normal map) by adding 1 and dividing by 2

[@MonsterJuiced]

@PrismaticaDev oohh right ofcourse I see now. Thank you I'll set it up later and see how it goes. I appreciate your reply man. Keep setting great examples :)

[@robinj6997]

Thank you for taking the time to explain everything. I'm reading it in high definition in the bought plugin (well worth it), then rewriting what I need in Godot

[@leonfomin9250]

when he starts to draw somethign in paint you know its gonna be good

[@vaillecgart1854]

So much informations, thank you so much for taking the time to share of all of this !

[@benjaminreinsch392]

Wow that is so amazing! Just what I was trying to create for a long time. Thank you so much!

[@calycheers]

your videos are always useful to improve learning curve about Unreal materials. Thanks.

[@Gambsmoore]

wow I didn't think I was going to understand that material.. But you explained it very well.

[@davidji4035]

Wow amazing tutorial, I really love this tutorials for water and river shaders. Thank you so much for providing quality content for everyone

[@PrismaticaDev]

@@davidji4035 thanks for watching and enjoying! :)

[@jankystreams3337]

You are so awesome, Charlie. You have really helped me get back into unreal and be able to do a lot more in unreal with your videos. (P.s. I love Prismatica's style so much, it's beautiful 😭)

[@PrismaticaDev]

@@jankystreams3337 not as beautiful as your comment

[@jerobarraco]

13:24 you can actually visualize those with the plot and debug scalar nodes (and clever inputs) Also thanks for explaining how the flowmap node is made. Thatsmthe fun part ofbthis channel.

[@MPRX87]

Great tutorial! One quick thing: If you want to get rid of those 2px mip seams(really evident around the 15:47 mark), you need to set the samplers to use the ddx/ddy inputs and calculate them with the ddx/ddy nodes(you do it from the UVs).

[@greebly6011]

oh wow when I saw this I thought for sure it needed to store some state in a render texture. In the case of very large open world environments things like water and wind would take up tons of space and would need to be done through a virtual texture. But this technique is amazing since it is stateless.

[@suraj.1889]

😁you are always such a fun teacher!

[@amura_]

yippee I just started digging into flowmaps) And just by the way, additional information. Thank you!)

[@heylister]

Amazing. It unlocks a lot of ideas. How to give more natural and reactive movement to things.

[@jerobarraco]

Nice vid. I like it was full of neat tricks, like warping time with a texture.

[@PrismaticaDev]

I go in to more detail about that in the Time node video :)

[@Potentially_Hacker]

A very nice 5 minute video!

[@PrismaticaDev]

:)))))))

[@AaronNeal]

Niiiiice dude! Thanks for the paste bin link, good looking out!

[@MatthewGDunlap]

Thanks. I think this is exactly what I needed to work out gas giants in my game.

[@ZacDonald]

I like how the 3 texture overlapping in the flow map node functions like a Shepard Tone.

[@stvarnov8754]

I would love to see a video from you on Save systems, you are an excellent educator

[@tondann]

26:00 its actually the opposite, because when the water is deeper, there is a bigger body of water below, dragging down the speed of the flow. If you experiment with fluid sims or study real life rivers, you quickly realize this. For example when a shallow little whitewater stream running into a deep river, you see how its being slowed down where they meet and you get this backwash kind of effect

[@snook-official]

This is awesome, thank you! and thanks for the material function!

[@Radwalls]

really cool lesson! Thanks prismatica dev!

[@PrismaticaDev]

All good! Glad you enjoyed :)

[@JakePlayableDev]

I can't believe you just said skibbity rizz

[@vembdev]

nice been wanting to do rivers

[@magilouprovence5340]

Another banger

[@PrismaticaDev]

u r

[@magilouprovence5340]

@@PrismaticaDev Gotta say this to you, thank you so much. I'm in my last semester being a student in game development and you thought me more about this stuff than any of our professors. They don't even come close, lmao. Big up, you're a lifesaver♥

[@CerealYUNGMaohu]

Hola! I have been struggling to implement a day/night cycle in my game. I was wondering if you could make an explanation video on how to set that up with stylized clouds, time based colored fog/sky etc. Love the videos!

[@JacobPernell]

Thank youuuu so much for this!!

[@DinoClaudDesign]

Thanks for the great tutorials and streams. Still haven't finished all so much good stuff 👍 . Question about combining the single water material with the flow map. What's the best solution to match normals ( waves ) with the flow ( if possible ).

[@sithmaster]

I just tried to follow the river tutorial. The quick and sudden cuts made it a bit difficult to follow. I decided to buy the plugin, since you said it's all in there. Pardon my lack of knowledge, but I can't find that particular shader in the Prismatic plugin. There is "some" ripple water, but can't find any river material or shader that seems to cover what is being shown at Minute 25:30. Sorry for asking.

[@PrismaticaDev]

@@sithmaster hey hey! Unfortunately I went on holiday before I could add it to the PScape project fully. There was also a bug in 5.3 that prevented it from looking the way I wanted. I’ll make a mock-up material and put it in the description of this video when I get home in a couple of days :)

[@sithmaster]

@@PrismaticaDev Aww no rush Sir! You are awesome! I am so happy and learned so much with your videos. I will keep the plugin for sure, just to honor all the time you invest in showing us things that can have a big learning curve at times. Btw, this is being used in a real game-dev scenario inside bigger landscapes (8x8 km) with dozens of rivers with branches. The water itself is using the singlelayer material base. The most difficult challenge is to get this on top of very realistic water with non stylized foam. Currently, I am making some mockup based on some of your implementation, but lacks proper "flow" that runs a bit longer through the river. For now, it's just being visible where I have the distance field and distance field gradient, which sadly, even in 5.5 looks very blocky on larger scale. I have added a 4motion inside the foam itself based on Ben Clowards tutorials to get a little bit more realism to it. Another issue is the brightness of it. Normally, I would pass 50% into the emissive channel for whiter foam, but since we have full day and night cycles, I wonder how to make it look more bright without using the emissive at all. Looks nice in the sunshine, but is too bright in shadowed places, like inside caves and tunnels. We paired it with Ultra Dynamic Skies for the day to night transition brightness, but that does not work nice at all. I wonder if there is a way to render it on base material but boosting it a bit more that it looks like using emissive on daytime. Same issue with waterfalls, since the base gets too much coloring from global illumination. That's not how foam or water fog/mist works in real life.

[@importon]

These are great. will you continue to make these edited short form videos? or are you sticking with longform livestreams from now on?

[@PrismaticaDev]

I have a few standalone videos that are being edited at the moment, and I also have plans for a very big series about modular characters :)

[@nikwalz3429]

Hi, do you know Gaea? Is it possible to use this technique to get a realistic river from the export files from Gaea? I am still struggling on how to create a realistic river from that exported files in Unreal Engine 5. Gaea gives you the river data in form of heatmaps and heightmaps. River flow direction, River depth, river surface etc. It would be cool to see a video on how to use you technique to create a river from Gaea cause there doesn´t exits one at the moment...

[@PrismaticaDev]

Sure can! You'd need to use the "landscape coords" node to sample the textures along the entire landscape etc. Not sure how you'd generate the river meshes though...

[@nikwalz3429]

@@PrismaticaDev I will try :-) Thanks for your fast reply

[@Bornstella]

Is it possible to somehow use this flow map function to warp a texture around the contors of a mesh using world space normals in a post process material? Over and against a triplanar effect. Thinking of an etching effect that flows across curves of a mesh.

[@glitchered]

9:52 missing the subtitle. heavy metal version -> blüvüläshhavülaflüvülüvüla. ;D good tutorial too. flow can be used for a lot of good scrolling effects. the river is basic noise. with dedicated textures you can do more. retro style scrolling, coloramp emulation. all the good stuff. hmmhmm

[@itay7]

Hi! I'm trying to create a road but using Landscape Spline instead of a Spline Mesh. Any tips on how to align the texture correctly to follow along the curving spline?

[@0805slawek]

You read this publication ? "Real-time Simulation of Large Bodies of Water with Small Scale Details Nuttapong Chentanez and Matthias Müller" the Fluid Flux plugin using this method, would be great some day explain how it works in UE5 xD

[@PrismaticaDev]

@@0805slawek ill give it a read! I’ve read some 2D water body simulation papers. Fluid Flux is a beast, I’ve seen it in action in another project I was working on and I looooove the river water mesh/flow map generation

[@gustaveriksson3585]

How would you approach this when tiling textures for larger rivers? I'm having issues hiding the repetition, even when blending multiple textures you still see the general world position direction. I tried tweaking the other parameters such as distortion but it doesn't really hide the repeat completely. I'm trying to use this with a spline mesh as you showed, with a Single Layer Water material.

[@PrismaticaDev]

Good question - it might just be a case of using a higher-resolution texture over a larger area, or using 2 separate textures blended together (a macro and a micro)

[@gustaveriksson3585]

@@PrismaticaDev That's great input! I ended up using 3 different textures micro -> macro. Then I added some flow variation with the sine node and noise for some convincing variation. You might still see the banding if you are looking for it but it sells it pretty well. Thanks for a great video and MF!

[@ajibolalaleye769]

thanks for this. please i have a question to do with character clothing. i have a long puncho. im looking to animate into some poses kinda like spawn(comic book characters) cape. basically in using chaos cloth as i cant get rigid bodies or kawai to work properly as the whole thing is simulated. how can i drive the poses (pose morphs dont work with cloth sim) to specific shapes or arrangements. thanks.also if you have a discord or a way i can contact you please let me know. have a great day

[@stvarnov8754]

How do you handle your player's inventory if you don't mind me asking. is it a plugin or a bespoke system?

[@PrismaticaDev]

Hey there - it's all bespoke, but essentially each Entity in my game is a uObject instance that can contain other Entities in numerous ways, I'll be making a video about it in a new Devlog by the end of this year :)

[@H0lyFr0ggy]

5 minutes video --> 35 minutes 🤣 on a serious note, good stuff very interesting!

[@shabadava62]

What kind of noise are you using? I tend to cross with that cloudy neat texture in another of your videos but I can't indentify what kind of noise is (any noise pack is also appreaciated)

Great stuff, many thanks! It does get a bit samey, just panning...

[@techuser1619]

Hey! Love your videos! They’ve been very helpful with my project! I was wondering if you could go over the art style of Astro Bot? They have this bright contrast look to their game that makes it look very vibrant. Do you have any advice/ tips to achieve a similar look? Thanks in advance!

[@hyper_1337]

hey prismatic although not related to this video I wanted to ask you, regarding your physical animation turorial, how do I if I want a bone (such as breasts) to be constantly in physical animation (possibly with its own profile) even when I decide to turn off the general physical animation. I have tried many times and in all ways I cannot get the desired result, which is that the bone remains in the same position while continuing to be simulated

[@PrismaticaDev]

@@hyper_1337 hey there! You can disable simulation for particular bones using the ‘all bones below’ nodes. You might also benefit from looking into the Physics Control component that was added in UE5 as the successor to Phys Anim (I’ll be making a video about it in the future now that it’s had time to mature)

[@hyper_1337]

@@PrismaticaDev I am aware of Physics Control but I have seen that it is incredibly more complicated than Physics Animation. Anyway, the “all bodies below” nodes cause problems because if I disable the general physics animation and with disable physics on all bodies below (bone: pelvis) and then reactivate it on the bone that always needs to be simulated with enable physics on all bodies below (bone: breast_r for instance), the bone continues to be simulated but it suddenly moves to the original position. I've tried using things like “copy pose from component”(can't remember exactly the name of the node) on another mesh that will be the set of animation and physics or to create a skeletal mesh component child of another but all these methods don't work. I also thought about creating an animation blueprint that would copy the pose of the bone and reuse it in the transition so that the sudden change in position would not be noticed but it was too complicated. I guess I will wait for your tutorial.

[@PrismaticaDev]

@@hyper_1337 Ahhhh yep, I see what you're saying. Yeah Phys Control would probably be the best solution, but I agree it is a bit more complicated.

[@hyper_1337]

@@PrismaticaDev do you think its possibile to use both?

[@hyper_1337]

@@PrismaticaDev @PrismaticaDev I found that you can use both but if you change the state of the bone in the physics animation component, it overwrites the physics control component. I guess I'll have to rewrite most of the code, but it's still better than abandoning my project

[@justin9649]

Do you think we could ever get a tutorial on how to use texture arrays? Like say height blending between different textures with a single vertex channel using a texture array.

[@dibritto1298]

Hey PrismaticaDev, I'm trying to render a character for my portfolio, and I'm having a hard time to rendering the Hair, especially the Eyebrow which is very close to the head mesh, when I Zoom out the eyebrow almost completely fade away, all I have in this material is the alpha map and the dither node connected. I don't know if you'll see this comment, but I wanna try anyway, because I didn't find any solution for this on the internet and it seems to be something very simple to solve, I'm just too beginner to figure out by myself

[@PrismaticaDev]

Hey there! It might be an issue caused by Mipmap settings - basically as the texture gets further away it changes to a lower resolution version, but the way the lower res textures are generated can be changed (sharpen, blur, unfiltered etc) Also might be worth trying with the alpha set to 1 to see if it still disappears (if it's going inside the characters head?) and if it is, you could try using the CameraOffset WPO function

[@dibritto1298]

@@PrismaticaDev WOOOW man the Mipmap solved it!! I can't thank you enough I really appreciate you, I was trying to fix It for weeks now, I probably wouldn't find the solution any time soon

[@PrismaticaDev]

@@dibritto1298 Glad to hear it!! :)

[@ha_eun_pi]

I'm a beginner who is learning the Unreal Engine. While imitating this video, searching for pris_flowmapsecresauce doesn't show up, so how do I get that to float?

[@eligijuspranskunas3509]

awesome!

[@linon8930]

Good video but may i add a friendly suggestion. It is very confusing when you cut the video and all of sudden there are nodes that just pop up without explaining them. It would be better if the material window was open completely to see the node tree. Also you should show the final setup at the end without all the unnecessary nodes that you eventually did not connect. It gets confusing having all of the nodes that eventually do not end up being part of the final material.

[@PrismaticaDev]

@@linon8930 great points, ill keep it in mind in the future :) it can often get a bit messy since I film these videos during livestreams so there are usually more little explanations happening that get edited out

[@linon8930]

@@PrismaticaDev I understand. I didn't know about the live streams. I'll go check it out. :) Keep up the good work. Your knowledge is very valuable. Your vids have helped me understand things that i used to bang my head against the wall for months.

[@importon]

Will you be doing a tutorial on how to activate windows next?

[@PrismaticaDev]

@@importon I would, but I don’t know how

[@kattenmusen10kofficial]

Why is there an exclamation mark above your head? Looks sick

[@juanmilanese]

the plugin comes with the charlie texture right?

[@PrismaticaDev]

It does, actually hahah

[@BeginnerDev]

Charlie you beautiful bastard!

[@Fawior]

Thanks for showing the differences between a flow map and a PENAH (sorry)

[@PrismaticaDev]

PEEEAHNAAHHHHH

[@noxtech]

how is your game going ? haven't seen for quite time any vids.

[@PrismaticaDev]

@@noxtech it’s going good! Just doing lots of refactoring and prototyping as my knowledge expands :)

[@noxtech]

@@PrismaticaDev any soon vid ?

[@Tommyboi7566]

7:02 great video so far🤣🤣🤣🤣

[@KoolioBaka]

Very cool, I'd love to use this but I'm having some trouble implementing the pastebin into a new MF. Might need to reconnect some textures?

[@PrismaticaDev]

@@KoolioBaka yeah you’ll need to put in your own noise textures. I’m not sure how pastebin works with the Function Inputs too. I’ll double check tomorrow and see if there’s anything I can do

[@KoolioBaka]

@@PrismaticaDev Cheers for that! I'm fairly new at Unreal so figuring it out is a little bit more challenging for me, but I think it's something to do with the material expression function inputs. Maybe I'm missing something. In any case, I'm not used to material functions yet so I'm not sure where to look, but I could see this tool having a ton of application once I figure it out :)

[@stvarnov8754]

Are you using forward shading on your game?

[@PrismaticaDev]

@@stvarnov8754 deferred shading with a post-process

[@HelpfulHuntersGuild]

Must be a new motherboard, I spent the last year or so seeing that activate windows on my pc haha

[@tylerscott3192]

ever think of doing a high quality flowing lava?

[@enki5446]

Anyone know how did he create the mesh at 27:12 ?

[@DinoClaudDesign]

Hi I think you can see that in the stream recording otherwise look for Spline blueprint

[@lil.shaman6384]

Why not use 4 samples?

[@PrismaticaDev]

Why not use a BILLION?? :P

[@lil.shaman6384]

@@PrismaticaDev can you compare the performance cost?

[@PrismaticaDev]

@@lil.shaman6384 it would be very minimal going from 3 to 4, although it depends on how many textures you needed to flow. If you had colour, normals and ORM textures then it would add 3 extra samples

[@bethedust]

He really said "skibidi rizz"😭😭

[@AhmadAli-kv2ho]

5 minutes but its 35 min long lol

[@PrismaticaDev]

7 for the price of 1! :P

[@Juno006]

It's still 5 mins...you just didn't frac it

[@RoboticDev]

Babe, wakeup... FLOW MAPS...

[@RedRocksies]

(3)5 minute materials

[@plasid2]

This dude is Kangoo Land national treasure

[@jayhop960]

Awesome thank you man made me realize i didnt need to spend $170 on ninjalive

[@PrismaticaDev]

@@jayhop960 NinjaLive is extremely powerful, but sometimes the simplest tricks can get the job done. Depends on the project!

[@jayhop960]

@ do you have any videos on making the cel shaded landscapes you have those are beautiful!

[@PrismaticaDev]

@ I have a very very old video about my cel shader, but there are some others that use the same ideas