Distance Fields (Part 1) | 5-Minute Materials [UE4/UE5]

[@wackcrewpeeps]

Make sure to enable "generate distance fields" in your project settings or else this won't work in 4.27

[@user-li9ep5cb6n]

This thing tormented me for 3 hours. I always thought I did something wrong. Thank you for saving me

[@wackcrewpeeps]

@@user-li9ep5cb6n You're welcome!

[@cyqry]

Absolute legend.

[@lucasflamein9080]

merci monsieur macron..... juste merci...

[@cloudandwind]

is really important thank you so much

[@lacouture3]

This has been the clearest explanation of distance fields in Unreal I've seen. Thank you!

[@staror890]

Wow, Seriously good tutorial. Like A+ . Most tutorials just hold your hand while showing you how to make one narrow thing (i.e. How to make a water ripple effect) But in your one you really explained the foundation of the effect and left the creativity up to us. I really like that approach !

[@PrismaticaDev]

Cheers Rory! I definitely prefer to learn that way, hence why I teach that way haha. I'd prefer people to learn how to do something, not just learn how to follow instructions!

[@gamecreator7214]

@@PrismaticaDev Love the style, now I actually start to understand what is happening and why. This is education.

[@steliosstavropoulos499]

tutorial king of youtube!!!!

[@PrismaticaDev]

Haha you're the king of my comment section

[@HaydenGausnell]

For UE5 users, if you want the blob thing to work, you have to use absolute world position node, and then you wanna plug in only the z axis to the position node link in DistanceToNearestSurface node.

[@baronlanteigne]

it's the other way around for me.. but I got some weird lighting issues whenever I use the 1-x or try to remap the mask value after the saturate node...

[@vulgaria4795]

ok,.... guy,.... this is amazing!, you solved my 2 year long question. Fyi i opened this tab and didn't watch this video for weeks and finally got around to it,.. so extremely glad I did!

[@RmaNYouTube]

I never understood mesh disntance fields up until now, you're really a good teacher.

[@Max_Stupa]

Dude, this is so useful. You saved me a lot of time. Many thanks to you! Disabling affecting distance field solved all my issues.

[@realyoyoweb]

Wow thanks man this is crazy the amount of things i just unlock in my project just with THIS video. I was struggling with poor foliage effect just because of a "substract" instead of a "divide"

[@buddelexperte5956]

All your little videos help me so much understand materials in UE4

[@StevenDiLeo]

This looks like a blast to play with. Thank you for the informative vid ❤

[@DerClaudius]

This is the first video I found of you. Unity dev here. Great tutorial, thanks! Subbed.

[@SrSKaTiZSrS]

That river looks awesome. Would love to learn more about how to do that.

[@AdelaideBen1]

Great vid... would be good to talk about the costs of these nodes as well.

[@saskia9934]

prismaticaDev? more like the G.O.A.T Dev

[@psy237]

haha great usecase :'D blob the sidekick who melts with anything surrounding him. attach two eyes and u got a character :'D :'D perfect explanation and demonstration how distance fields look/what they exactly are, my imagination looked a bit different, thanks!!

[@mariobros2867]

Thanks for keeping this tutorials short and sweet. You got a new subscriber!

[@clorent]

epic pro gamer tip; if yer fuckin around with dynamic meshes (which don't automatically generate distance fields) for procedural and random landscapes etc., you can allocate a static mesh file to save it to which it will generate distance field for. be careful as this will overwrite the file for whatever mesh you have referenced, but will keep tags and settings. I wasn't able to find any official documentation on how to do DF's for dynamic shit so I thought i'd leave this here (hectic tutorial btw very good!)

[@rauljaramillo923]

Thank you Charlie!!!! I'll try to find a way to make foliage cull when near a distance field :)

[@PrismaticaDev]

Good idea! I actually have a video about Grass Culling using RVT, but this would also work as long as the Landscape wasn't emitting distance fields :)

[@xabunoxx2850]

Another fantastic video, distracting me from my project with dozens of new ideas. Keep up the great work!

[@PrismaticaDev]

Cheers Xab haha. It's not a distraction if it makes it in to the final game! ;)

[@beaver_stealer]

your knowledge astounds me

[@IllyasArt]

Holyshit I just got like 100+ different ideas with this video. Please make more of these videos I beg you!

[@PrismaticaDev]

Glad to hear it!! Would love to see what you come up with :)

[@melpeslier]

For the distance field, you need scalability to be set to medium at least, in low it does not work

[@jtm6186]

Extremely useful tutorial! Great job!

[@Baleur]

I cant get this to generate properly at all. In 5.1 project, have the distance field generation in project settings, have all meshes set to generate, have rebuilt level several times, saved all, rebooted, no difference.

[@bento_th]

did u find a solution?

[@lorryburger8165]

Awesome! I didn't know i needed to know this!

[@PrismaticaDev]

Haha that's me every single day when I find out something cool and do that instead of work on the game :))

[@NordBearHard]

Hell yeah my dude, keep it up, that's so cool

[@davidmettetaljr6461]

The last bit for metaballs and simulated mesh deformation will be great for blending the base of large rocks or trees into the landscape. Just have to figure out how to make sure it only reacts to landscape and not other objects and it should work.

[@alf3977]

Always Pog!

[@PrismaticaDev]

Cheers Alf

[@JumboTTV]

Love you bro! haven't manage to catch your twitch stream over the last week hope you are doing as good as ever :)

[@PrismaticaDev]

Thanks Snake

[@JumboTTV]

@@PrismaticaDev thats cool! I udnerstand probably more than anyone, I probably ask the most slightly off topic questions xD excited to catch the next one :)

[@enriquemunoz6148]

Great explanation!

[@grahambeaumont7172]

Awesome!

[@Maniac-Design]

It's awesome ! I want to see how you made the turbulence waves with the rock

[@PrismaticaDev]

I'll be covering it in the future when I do a full run-down of my water system (once it's complete)

[@Maniac-Design]

@@PrismaticaDev Perfect, thank you ! :)

[@tehsimo]

This is very interesting!

[@PrismaticaDev]

Thanks Simo! I love distance fields haha there's so much possibility. The DF algorithm also got a makeover in UE5 so it should be more efficient and more accurate as well!

[@Deck_Dynasty]

I loved this video.

[@PrismaticaDev]

I loved you.

[@TY_Blender]

so simple so easy so nice

[@pto2k]

04:41 for me with UE5, there is pixelation glitches bewteen the bandings and the solid color . I read somewhere that Distance Field in UE5 is broken. Is that still the case, or am I missing something?

[@fuglong]

I can't even get distance fields to generate in 5.3

[@NickFromPlanetEarth]

I know this is an older video, but I was wondering if this would work in a lava material to create a blue emissive when objects interact with said lava? Great video! thanks!

[@PrismaticaDev]

Sure could! However keep in mind you won't get any "trailing" effects, only the effect where the object currently is

[@youth20003]

learning the stuff that I don't immediately need but I will for sure need later in my project all thanks to the absolute MAN Charles

[@youth20003]

god okay I just finished the video this is so fucking useful wow

[@PrismaticaDev]

Hahaha embrace the side-tracking :P

[@Fokkusu]

wow this is really really interesting, I'm going to make some good use of this knowledge thanks a lot ^^

[@PrismaticaDev]

Keen to see what you do with it! :)

[@OreoRobDog]

i lerped the offset code with a simple grass wind with 1 on all the factors and set the alpha to the main script and it made a cool slime material.

[@PrismaticaDev]

oooooh haha nice idea! Extra jiggly :)

[@thesystemera]

Legend! Thanks from NZ

[@mightymayray1314]

Such a great tutorial! Appreciate it! One question - @0:05 sec in your video, you're painting the ground with a blob and making the ground red. How did you do that? I'm trying to do something similar except I want the blob to just reveal via distance field and then keep the material revealed instead of urning transparent again. Maybe you have another video about this that I'm missing. I'll check. Anyways, appreciate your great work and thanks for sharing with all of us!

[@jairdeoliveiraneto605]

Very nice!

[@Tarroook]

Cheers for the explanation, I learned a lot through your videos ! I tried making a blob like you did at 0:05 but for some reason the shadow that the blob casts is based around the orange outline instead of where the vertices actually are (it ends up casting a shadow around the whole mesh). Did you encounter this problem ? If so would love to know how you solved it because your version looks perfect !

[@PrismaticaDev]

@@Tarroook it’s a weird artefact that happens because the Shadow Pass doesn’t render distance fields, since it’s orthographic and stuff. You can try using the Shadow Pass switch node and then the vertex normal WS node multiplied by a positive or negative number into the WPO. So basically the shadow pass will use an inflated/deflated version of the mesh which can fix the shadows issue

[@radosawzaremba7963]

Ok, that seems great and working in UE4, but I got problem in UE5 to achieve it, as as soon as I add distance field node(DistanceToNearestSurface) there is pitch black base additional geometry that stays still and other one following all the world position offset as should. So duplicated geometry in addition to offset one.

[@ZahhibbDev]

As always Charlie, great and informative video! ps: give Boycat, Girlcat and Ladycat some snuggles since you took _their_ seat! ;)

[@PrismaticaDev]

No problemo Zahhibb :) Haha I'll give them some extra cuddles... As if I wouldn't anyway :P

[@auaukiko.oficial]

That is so cool thank you

[@fleurbird]

Very interesting!

[@coleastaire]

awesome!

[@PrismaticaDev]

You are

[@mjesensky2760]

Amazing! This looks like so much fun. Thank you very much for your tutorial. Liked and subscribed.

[@crakatinni]

Hey mate great content! Do you use world position offset to create ripples too or just create the illusion with refraction and emissive color?

[@PrismaticaDev]

All of them, actually! Haha

[@crakatinni]

@@PrismaticaDev brilliant! I find that the emissive color and WPO don't sync up exactly if I plug the same material function containing the distance field sine function into their respective result nodes 🤔

[@subrootsound]

This is amazing stuff, thank you so much!

[@travisadkin5782]

Hi Charlie, could you show the decal aspect at the start of the vid maybe in a decals breakdown?

[@KryyssTV]

This reminds me of when you see shows revealing how magic tricks are done. All this time I though that "sticky" meshes must be really complicated to produce and then I find it's actually very basic stuff lol

[@Supernaturalcloak]

Can you make a video making a clear wall (forcefield) that glows blue when an object goes through it? Its for a spaceships forcefield that separates space and the ships hanger. Allowing ships to go through with a glowing blue (or any color) light that outlines the ships as they enter. I keep trying and can't seem to get it to look cool. And I cant get the glow to be a color other then white or black. And... I can't get the forcefield to be clear in the middle. It would be ok for it to glow around the edges, where it meets the ships distances field, but I want the middle to be clear... Ok, enough crying from me. Thanks for your content, I'm making my way through your videos and they are a great source of knowledge!

[@jhebadiasprunklefunk9243]

Hey Charlie, on distance fields I was wondering if you know any way to improve the quality of the fall off? Like if you divide it by too high a number then it becomes jagged the further away from the object casting the DF is.

[@RainsalotProductions]

The same thing with me... I need this effect to stay consistent within any distance from the camera. Have u figured out a way to get this to work?

[@dominikgomoka8541]

Hi! It is all fine and well sir but I have a tiny question :) i've set up those wobbly distance field ripples for my water shader and included them into vertex displacement. And refraction. But - cannot figure out how to derive normals from this displacement and blend it together with other normals (based on gerstner waves or textures) so that I get proper reflection "bending" in the areas where ripples are in effect ;) Got any tips for me? Thank you for your tutorials, great fan of 5 Minutes Material the Show ;)

[@TheGulperEel]

Thanks!

[@buddelexperte5956]

This doesn't sound nice but I think it's nice that you aren't that big of a YTer, so we have your content all for us

[@sbwhity]

Could it be that this doesn't work with UE5? My distance fields look all messed up in the viewport when I turn it on the visualize. It's mostly white and kinda looks like a bad AO bake. Also i tried doing the edges with the sine wave and for me the whole object just blinks on and off. hmm...

[@travisadkin5782]

Hi Charlie, really am enjoying your format, it is to the point. Quick question I wanted to isolate which objects, cause the distance fx. I do FX so, possibly the shader would only be effected by a character on impact or surface types and lerp in for variation types. If you get a chance, I would appreciate it and I will certainly let you know if I get the setup working. Keep up the Fab shaders tutorials.

[@PrismaticaDev]

Hey hey Travis! You can disable a mesh from affecting distance fields by disabling the "affects distance field lighting" tickbox in the world viewport. Unfortunately this is global, so the mesh in question would also not recieve distance field lighting information etc

[@travisadkin5782]

@@PrismaticaDev Charlie thanks for the quick reply. I may be able to use this for a cinematic shot so, that's good but, it would preclude functionality in gameplay if, i isolate to just a character . I will follow your stuff you delineate the functions very well.

[@itanshi]

what might prevent the gradient from being applied to the ball and the blob animations? I have a white squashed ball that is retaining its shape. ty At 2:55 its just a black sphere for me.

[@Effet666]

As I got, you need to activate "Generate Mesh Distance Field" into the project settings

[@ricardovega1407]

Majestic! How about going from solid to liquid to gas? Have a blobby day!

[@PrismaticaDev]

I actually have an interesting idea to do that! Hahaha all within 1 material. Would be interesting

[@slothsarecool]

I wish the documentation described what these nodes actually return numerically. I'm a bit confused why dividing it feathers out the effect, if a particular pixel is some distance away, wouldn't multiplying it increase its influence?

[@PrismaticaDev]

The node is returning the Distance to nearest surface, so when the mesh is 100 units from a surface it will return 100, and towards the mesh it will be 0. Since we want to operate within 0-1 space, we divide it by 100, which turns 100 in to 1, 50 in to 0.5, and 0 stays at 0. Now that we're in the 0-1 range, we can flip it over (OneMinus) and now the white part is near the mesh, and the black part it away from the mesh. Hope that helped! It might be worth checking out my Math Nodes video as well

[@PrismaticaDev]

Oh and to clarify, 1 unit in worldspace = 1cm

[@slothsarecool]

@@PrismaticaDev ahh ok that makes sense, thanks! Also I subscribed on Patreon, really appreciate all your videos! 😎

[@RomarioDev]

thumbnail is 10/10

[@PrismaticaDev]

Hahaha I need to use the CharlieBall in more thumbnails

[@ariiteajuventin3408]

Awesome as always, but I have a problem with my landscape, the distance field doesn't work, Any idea why and how to fix it ?

[@Supernaturalcloak]

I was looking for a way to pass through a force field with some glow around the character. I think this is just the thing. Only day 3 since downloading unreal, so... we'll see if this is too advanced for me or if I can pull it off. 🤣

[@PrismaticaDev]

Keep in mind that skeletal meshes don’t emit distance fields, however you can use a dummy mesh over the top of your character with a masked material set to 0 opacity which will still emit a distance field

[@Dhieen]

wow very interesting, instead of doing a blob you can make moss or snow like this right?

[@sams_3d_stuff]

Amazing!!

[@danbellian5617]

Hey all, that awesome blob effect at 6:40 appears to not work in Unreal Engine 5 official release. Position offset referencing distance fields causes bizarre ghost-like rendering bugs. Tested by copy-pasted nodes from UE5 to UE4 blank projects, works properly in UE4, does not in UE5. Influence distance field set to false on the static mesh. Can anyone else confirm this?

[@DerPolee]

i tried to create this blob effect right now and i can confirm that its not working in ue5.

[@Sorarox59]

Am I the only one who got some sharp effect at some distance with the DistanceToNearest node ? From 0-70 it works, but with larger value, my borders juste get sharp with square border instead of smooth one :/ Do you have any idea how to fix this ? Thank you !

[@likewahtzup]

I am having the exact same problem! Sorry no idea how to fix though :/ I am a newb, hope you are doing well despite this set back from 7 months ago :)

[@3DuoAnimation]

Hi, thanks for the tutorial. any idea why my foam disappear in UE5 once i move the camera farer away from the water surface ? Thx for help

[@thegreatSalu]

One question, I'm trying to create a half submerged car in a lake..is it possible to make the merged part of the car wet with this material? Cheers!

[@DELTA4785]

Awesome tutorial! Funny, in-depth and inspiring! Can you increase the max distance of a distance field? (ex. when you are dividing at 2:50 resulting in a much wider gradient)

[@PrismaticaDev]

It seems like there is SOME limit, not 100% sure what it is though or if it can be broadened. If you go into the DistanceField viewer you can get a rough idea how far they go

[@AhriCRose]

The Runescape music xD

[@3xchris]

can you access distance field ao in ue5 to create masks, for like dirt build up?

[@Luke-3D]

Is there a way to only include one object. for example a stone being thrown in the middle of a lake, but you don't want ripples on the lake edges

[@PrismaticaDev]

Unfortunately not, unless you disabled Distance Fields on your landscape etc which can make shadows look quite weird. It would be really great if Distance Fields were a vec4 value instead of scalar so you could essentially have 4 "channels" but that would require some engine work haha

[@Luke-3D]

@@PrismaticaDev That's a shame! Thanks for the reply

[@semmert]

I subscribed for the cats. Stayed for the tutorials.

[@semmert]

also PLEASE turn the music down, or off, in these tutorials. It's pretty loud and distracting. Just my $.02

[@taarcks223]

Its not working for me in 5.1..... is there something i miss? Distance Fields are enabled and so on....

[@joeldbenjamin]

I would love to be able to use the distance field as a mask but include the object itself, so NOT turning off "Affect Distance Field Lighting". Not sure if this is possible... Basically I'm trying to create an AO mask but not have to use precomputed Baked AO, and distance fields seem promising, but if the object itself has to not affect distance field lighting then the effect isn't going to work

[@Dhieen]

if you want 2 objects having the same base material with distance field AO for example, how would you do that? since you have to uncheck "affect distance field lighting on the object that has the material Like a set of modular walls, you want to put AO to them, but it wont work because of that Is there another way?

[@ue4learn191]

this is my question too .

[@LionUnchained]

The blob was not whack. All hail the blob.

[@wackcrewpeeps]

Are you going to create a video talking about how you made that blob paint the grass from the beginning of the video?

[@eligijuspranskunas3509]

how to make ripples to react to the character?

[@mattwright880]

Is there a way to get this effect working, without disabling the distance field lighting for an object? I was thinking of using distance fields to mask out a wet surface effect when an object is above the surface in question, but I need all objects to use distance field lighting.

[@Qwert_Zuiop]

I love these tutorials! Explained in such a great way and also short enough to bring yourself to actually watch the whole thing BEFORE you get stuck somewhere ;) Just one question, is there a way to make the effect last longer, even when the mesh is already somewhere else, like as an "afterglow" (like in the video of yours with the grass that glows when you step on it)?

[@PrismaticaDev]

Hey Linda! Unfortunately I can’t think of a way to do an afterglow effect without the use of Render Targets, or a non distance field approach like an array of sphere masks generated by the character

[@yamasaa]

Hey, thanks for this video! I love the 5 minute format, most videos are 30+ minutes long and take forever to explain things so this is perfect :) subbed! I'm wondering whether this "distance fields + lerping" wombo combo could be used to blend transitions between different geometry. In my case I want to blend the terrain and elevation of different hexagon tiles at their shared edges, similarly to how Civilization 5/6 manages to have seamless terrain/elevation transitions on their hex-based maps. I'm curious to try it out soon!

[@PrismaticaDev]

Ooh that’s an interesting one... I think the only issue would be that you can’t have something using DF’s in the shader be emitting distance fields itself. Maybe there is a workaround though!

[@logan_paul]

unfortunately I did not understand, but how to make the coloring effect like in 4-8 seconds?

[@SanthoshKumarfojoheartthrobe]

i'm working on it too bro. Any luck getting it to work? I think it uses render targets. but not sure how to pass information to the render target

[@keylight8647]

Realy Good Turorial your work is juste Insane ! I just have a small problem, I'm trying to do the same thing with the blob sphere but in my case instead to be like a slime ball the sphere stay black like if my base color wasen't there and the form the sphere dosent change. I use Unreal engine 5.0.1 idk if there some setting I forgot to set or this is something else.

[@sukritact]

From what I can tell, distance fields seem to have broken when used with world position offset or the opacity channels: though I haven't been able to find documentation about this.

[@RXGLine]

still dont know what distance filed is. what is the field, distance between each point to what?

[@ThadeousM]

I need to extend/scale the ripple effect. but as I divide beyond 100 (e.g 1000) I no longer have control over the radiating effect shown at 4:25 Does anyone have any idea for how to correctly scale this effect to fit larger scenarios? For context I need to see large rippled from far away on a large islandd Thanks all!

[@PrismaticaDev]

Hey hey - unfortunately there isn't a solution, since Distance fields on extend so far internally. You might be able to edit engine code to make them generate even further, but it will use a tonne of memory. For something like ripples/waves along a shoreline, I would create an RVT and draw a spline around the island. In the spline's material you'd have a gradient from one side to the other which you could then sample in your water material and create waves/blend between ocean and shore waves.

[@kidneyaiopm1903]

howd you do that slime smudge on the grund in the beginning bro

[@lz4090]

Thanks for this. How do make it meta balls like when you have two spheres? I cant seem to let them interact to each other even if I turn on their own distance lighting. Thanks

[@Dorizdt]

Could you use this effect to also add curved "bevels" to hard edge shapes?

[@dragoonduneman4161]

Have you done something like Overlapping itself as like two object interaction with each over and then masking out only on when it overlap itself ... i tried but only info i got is when you got two different object but never itself against two object .

[@PrismaticaDev]

I haven't found a solution yet unfortunately :( I know it's possible but might require some custom code

[@krzychos7]

It's a pity that in UE5 it doesn't work anymore.

[@PrismaticaDev]

It does, it may just require changing some settings. Lumen did some weird stuff to distance fields, like changing the voxel density

[@bento_th]

@@PrismaticaDev Could you please let us know what settings needs to be arranged as enabling in project settings distance fields in ue5 doesnt help. Thanks

[@kasha-san5597]

My jaw dropped so much in this video, great tutorial thank you for making it!! I seem to be having some issues with my material though, it looks very dark between the bands, almost like it's multiplied. I've turned some things on and off and the issue is still there. Any advice?

[@kasha-san5597]

SOLVED!! Run the last multiply and 1-x through an add before plugging into the lerp alpha

[@EvilPainNova]

Can I reverse the mask so the blobb goes inverters and not outverts? like its trying to avoid things that came near it.

[@Urammar]

Litterally just a one minus node out of the result of the mask bruh. You gotta think a little bit for yourself

[@PrismaticaDev]

Yep, definitely doable - you can set the Multiplier value to a negative and it will shrink inwards. You might have some issues with shadows when using WPO/distance fields, so you can plug it into a Shadow Pass switch to use the default shadow.

[@jorgevalles6835]

Can we say Distance Field are more or less like an Ambien Occlusion?

[@PrismaticaDev]

Yep - it’s offline ambient occlusion computed through ray-marching