UE5: Transition Between Multiple Materials // Unreal Engine Livestream

do you remember that video from one of the previous streams it's not public on YouTube it's there for the for the patreon subscribers it was about material tricks um having many texture sets exported separately in substance and then choosing between them using some using some Randomness values so this was a texture array and at the time I did not yet understand the limitations of texture arrays so it was perfect I did this stream because then emmanuella Charlie said oh exactly this uh the texture arrays don't support mid Maps which is a shame because otherwise they'll be just brilliant for it so the trick was to make a texture array texture array is like a sandwich of textures like you know additional component Z which is the layer let's say and you can for example put all textures of the same type into a single texture array so Albedo uh for example I should have it here let me just find them instancing maths oh exactly take a look this is a texture array it's not a collection of six rectangular textures rather look on the right these are full textures Square on the same UVS because this is the same object textured with cloth textured with polyester with some gilted pattern and then with rust so pull textures combined into a texture array I think you have to enable that in the project settings and then you just select textures of the same compression type and do right click uh I don't have it enabled as you can see but here you have make texture array or converts to texture array so this was supposed to give us a possibility to randomly choose between a full texture set let me show you how it worked there's M instancing randomizer I can actually open the map itself and then I will tell you why is it not enough and what we'll do today instancing mods by the way about that on patreon the pinned post is Twitch project files right for the subscribers for the patrons and recently I updated these files so if you get them you have every single thing that you can see here on the left so the newest additions are of course geometry script the latest stream nanite tips and I think shaping functions because the previous pack was from May and it works in unreal 503. okay this is the map instancing commods it shows the same object the same mesh with the same material no individual instances there just copy it like that same material and object position or ID something like that is used to choose between the layer of a texture array or actually of multiple arrays roughness will be done normal so as you can see distinct materials yet it's just one material so let me open it instant smash oh where's the material oh here so as you can see no instances just material what does it do um it takes or is it there or not up here yes so it takes a texture sample using standard UVS and then it adds the Z component so it's X Y then Z Z is basically per instance random multiplied by the number of layers we have in this array and then floors to make an integer so it basically uses standard UV then picks a random layer in the Z axis so Z axis in that case is the layer of that texture array what happens then this could be working right this could be nice but is it that's because texture arrays don't support Maps it's not visible when you zoom in it's a problem when you zoom out let me show you so here we have some aliasing problems here not yet but we start to see them and here definitely take a look that's because texture arrays in unreal as of now as of 5.0 they don't support MIP mapping MIP mapping are mid maps are down sampled variants of the same texture here Maps so you know half the size quarter the size 1 8 and so on but this process also filters them it's not perfect filtering but it's good enough it serves like a filter before anti-aliasing kicks in it's very important and also it's a very important thing for optimization for texture bandwidth basically texture sampling will just die even on Modern gpus if it tries if you try to always read something from the original it needs the local cache it's neat it needs the resolution that fits the size of the object on the screen that's very important and texture arrays don't provide that you always sample from the highest possible source regardless of the size of the object on the screen of course in such a simple scenario is not a problem especially that I have an RTX 2080 but it is impacting things if you have more objects if you have bigger textures so this technique basically is a dead end because of that you can't use it for anything bigger than you know 128 textures or 256 because then you run into problems so not recommended but it was a good try so what if it worked what if we found a way to actually have it working and then does it allow us to blend between these materials of course it does take a look let's try something like that for now let's stick to texture arrays and that's where we start today's topic I will show multiple let's say level of complexity of blending multiple scenarios because everybody understands it differently what does it mean to blend materials so Let Me Maybe open vs code um and let's write it down a little okay let's start so what do people mean when they think about learning materials an overlay on top of another material right or maybe not the blending by transitioning but let's stick it stick to that name for now second thing that people think of when blending is to have two materials on the same object transitioning let's say spatially okay so the materials on one object with spatial Edition spatial meaning over an area right over a distance um so this can be mask right and and blending then EG effect AFX right and then it can be material morphing into another material over time so imagine this blue thing is slowly blending towards this not as a static mask uh it must gradient Etc but over time so these are some examples when I would say people think of as blending the government asks him this collection this array you mean is a continuous chunk of memory or they just showing away in community user so I'm not sure how exactly they are implemented as Sudoku says texture arrays are textured the array from DirectX or opengl um oh sorry for this the camera yeah now you should see entire text yeah so again about the arrays let me find them uh where were they instancing mats oh yes so this array right Source textures are here so I'm not super sure because no I'm not a rendering programmer but from what I understand texture array is just a pointer to the actual texture resource like this or maybe it contains them but basically these are full textures so they have a you know a given compression type everything they are not combined into a continuous Atlas okay there are still textures however however what they give you is the fact that to switch between a full texture you just use one texture sample so there's one texture sample command invocation and then [Music] um the wrapping of the UVS is still continuous imagine what will happen if you let's say took this Circle paint you took this if you took that and let's say you wanted to scale your UVS right so the default UVs devotee this will look like oh okay like this for example this would be some decent UVS some are in the painter and then you decide to increase tiling so what will you do is to basically scale them but what happens then if this wasn't a texture array it will ultimately reach this area okay so you have a problem so then what you probably can do is add additional math and let me use a bigger brush under this is a map and start doing a frag or module to wrap this so modulo with 1.0 to start start wrapping this area towards the beginning of the texture you can do this you can use the command code frog for example or modular but this is additional math and this is not always it doesn't always work because we break the continuity of the UVS so we have problem with okay here we don't have problems but normally we would basically stuff gets complicated so the actual arrays are nice in that regard that these are full textures with a wrap something possible just separate this is combined for convenience into a single resource so at least we have one resource can you just drag and drop it like a single file which is fantastic because you configure such a collection you just drag and drop it perfect um so the government asks if there are basically udems no that's the fake utips are separate and your names are what I would recommend today over texture arrays let's show you what it takes to uh to get a udem first project settings enable virtual textures virtual textures are a different technology arrays are very simple they are very very simple basic DirectX thing virtual textures on the other hand they have Hardware support sure you have to enable virtual texture support in the project settings here and then as you can see there's tile size 128 what does it mean I don't know if you explain it on any stream already or not but if not let me just go back here let's say this texture is 1K it actually is so virtual texturing is a technology that divides that texture into parts into tiles of the given constant size this actually uh 256 so this would be 128. and then it looks at what is used in the current scene and for example here it can see only that part of the texture so it looks at the texture again here where was it uh-huh it finds the same areas on the texture somewhere here for example this is visible probably this is probably also it basically checks what's visible if something is not in the camera so behind that object occluded it discards these Styles these are not loaded at all and this is amazing in Virtual texturing so this will be loaded this tool and then also and other things will be on stream it has a delay of one frame so for one frame things will be blurry or outdated and then the actual streaming kicks in but thanks to that we can have a huge address and still only load whatever was requested by the material in the previous frame so very static virtual textures are amazing in that regard and I would recommend them over texture arrays and that's also how other implemented units so what are yields do them maybe there's Wikipedia page or something it's original in Israel you didn't work any nice images or no okay this is technical image maybe enough for now so udems are basically additional um let's say parts of the UV set this is your normal texture this zero to one as you can see zero one one and then if you move your UVS towards the next Square it will load the next file a separate texture and that way you can have rows and Columns of udems um and in unreal it's possible to not only use them for separate parts of the mesh but also to use them for having actually all of the mesh here but then having variance variants of the texture placed as additional u-dips um the government asks what will happen to Virtual textures if we moved very fast in the game for example jet fighter game so unfortunately what will happen is if you load the texture proxy texture proxy is a 128 version of a texture super small smaller than that actually like this proxy will be loaded because it's always there and only then after one frame so probably too late for a jet fighter game when you fly low over the terrain with some delayed all resolution types will load but for more static games for RPGs is just an amazing technology thanks other for the Discord link so yeah users are the better texture arrays let's say they can be used that way I always have to find ufr udem dots give them support base name okay then Dot then one zero zero one exactly is in The Foundry image here and then PNG so we can try it in a moment but for now let's stick to a texture array just to see how we can blend multiple materials okay so let's go or do we do that already I think we do let's open this material randomizer fake so what do we have here we have something called make material attributes what does it do when you normally create a material let me find some other material or even make one and material whatever enter this is the output base color metallic specular roughness and you can for example create some Vector put it into base color like that right Deepika material but what you can do is create make material attributes looks very similar very similar you put stuff there you create another set of make material attributes you put some different stuff there like this well it's not different stuff is the same stuff okay now uh-huh and then these are full set some base color roughness metallic and then you do material blend blend material attributes a with B using some gradient as the mask and then you put it not here because you can't do it actually you can you can do get material attribute and with Plus on the left you add new stuff so you want to get base color so you get the base color and put in the base color you get metallic and put it into metallic but there's a simpler way click on the empty on the left use material attributes yes stuff disappeared there's just one output material attributes and you just put them directly here either this first thing or the second thing or the Blended it's a struct material attributes a complex variable type so that's how we typically blend materials right but as you can see what it requires is knowing what exact texture you have to have here texture sample something uh missing texture yes I know and then another one right typical blending of two already known materials but what if you had like in that example okay what if you have six textures to choose between let's say you only want to blend between two of them right at the same time but do you have six to choose from and what you have to put them all like this and then put many many textures here or there's another way you can have just two material blends but to choose you have to create multiple texture samplers and then do if if for example variable choice is zero or if it's one then do this if it's smaller than that and then if actually the variable is more like two right then do that texture if not oh sorry I do that texture wait what no this is not here not here this is Choice again if choice is bigger than this take that texture if smaller let's make texture and so on and so forth until you end up with the final text or two of them so you have Choice a and then you have to repeat it for Choice B on the bottom repeat the whole setup right like this it's a lot of work and you didn't save anything because such Construction in unreal it's not branching it behaves like a very cheap lerb so the if note it doesn't switch between variants it basically switches this between stuff that's already done so all of these will be sampled wasting your bandwidth massively and then these things will choose between them and choose and switch in the end all of the calculations will be done anyway and you just end up with visual results that's chosen but the work had to be done so imagine CX variants will be a massive waste because not only this you also have roughness you also have normal mobs um silicon says it's not just unreal it's hsl and glsl that's true however if you have a custom node with code on the left you could do such a code normally you have if for example Choice a equals 1.0 then you do number [Music] um my text Mom somewhere UV right you can just write that like text for example and this is similar to unreal but in hsl but they have two keywords in hsl they also doesn't but hls does provide you with something nothing is the behavior that actually does both branches so is sample my texture so flatten actually will sample both and then it will uh so it will sample both and then just replace the text with the thing that is appropriate depending on the choice a but branch actually branch tells it to only do one of these and actually make a stop in the Shader so stop evaluate do one of these Reserve memory for both but just perform one of these operations and then continue it's still heavy if the branch is not coherent within the same waveform So within nearest 64 pixels if the choice will be different if one of these then the branch will fall apart and it will have to sample both but if a whole group of pixels have the same result of the comparison then it will only do one of these operations because it can do it for the entire group it can choose one path of the code that's why Branch okay so you can do such a code here in custom input where was it input name code yes yeah right you can type some code and use branching but it's not guaranteed and even compilers don't guarantee that they will actually respect your branch if the code doesn't make sense to make branching according to a compiler then it will just replace it with flatten and it won't tell you so don't rely on it too much and unless you know what you are doing and also don't think that stuff will be for free because branching only uh regards instructions but it still reserves the memory in case multiple pixels will have a different condition value so it has to have memory for all of these things anyway unreal has the simplest possible if which is a fake is basically doing all of that just choosing in the end oh yes uh and the camera is right that writing custom code is not convenient in unreal right so that's the theory behind something multiple textures let's hydrate and in a moment let's devise a simpler way okay straight texture arrays will be perfect for this but as I said they are problematic so let's try to do stuff like texture arrays but with utils udems as shown here somewhere here let's utilize that technology in the movie industry it was there for quite a while in the games to have them properly supported it requires some some work some pipeline work some runtime work like epic did with their virtual textures or actually the company was called graphite and then bought by epic something like that anyway we have nice virtual texture scenario let's utilize that so this is a complex node setup let's simplify it let's go here um but to content textures where do I have that Focus here on models no what let me check where is it imported from browse projects twitch instance mods okay weird which instance mods right textures here they are and they are called the the variant 0 0 okay perfect so now let's make udem according to the documentation and by the way a short reminder patreon here you have three tires and this middle one and the last one give you the files that we are working here on not the source files but the other project so by now there's plenty of them from burning wood uh not like tests sign distance fields and so on and if you're curious about any of the streams your basic engine you can just open them and take a look inside so much recommended and thank you for those who are already supporting me says a few recent movies was kind of Scrappy outside of pipeline okay now I think they are quite nice so these files and the documentation work using workflow in unreal is texture name then Dot and then the udem coordinates so let's do that let's copy these textures and rename them like units so I think I'll have to um to duplicate that yeah okay let me duplicate them cut them you know them enter and then it will be called different things it will be called d and variance 0 will be one zero zero one okay then another day one zero zero between those exactly is in the documentation and this way unreal will recognize them automatically as the next udem uh textures with python will be much easier that would take more time or and one oh that's hot okay before we rename the remaining ones Let's test if unreal Imports this as you lips so here okay switch to tiles oh they're huge okay let's make a folder called Jordan and now let's import only the first one let's see what it does and for those who join later short reminder project settings enable virtual texture support okay so let's import the first item yes take a look VT is there and source files are actually all five source files from o1 to o5 and even the thumbnail represents that because this is how they look like and this is the thumbnail so we imported successfully a udem into Henry if I open it as you can see there are actually file textures next to each other and the imported size is 5120 by 1K but don't think it's any problem it's not because it's method on the right top is virtual streamed meaning it's a virtual texture so it's divided or exactly as I draw here into tiles of 128 in size and then it loads only whatever is necessary for the current view in the resolution that's necessary for the given view that's the huge advantage of our texture arrays udems and virtual textures have Maps so they stream in only the size that's needed for the given view just amazing and this guessing what size there should be is much better much more precise than typical streaming in unreal okay so here we are compression is default so it's RGB perfect let's save it and in this material we don't have to have that magic anymore we have a different Magic for now let's not blend let's just use the first material only um what have I done okay I don't use it yet and then we will have a variable call called layer Choice a okay or another layer variant variance Choice any then let's drag and drop the udem into that material so show it drag it here it's here and take a look it looks like a normal texture just have a little VT on the bottom so now what will happen if we typically just did this base cut oh sorry it's going back here let's go back here um and the Red House Games asks is there any specific case where texture array is preferred over YouTube uh the Simplicity of sampling I'd say use them sampling is is heavy there is an overhead to all this convenience and Magic of you know loading the tiles finding the tiles to load from the desk that's complex machinery the actual arrays and standard textures are very simple give me the UVS I will load the pixel that's it um if I show the stats here you'll be able to see this so let me drag and drop a texture array or just a standard texture for now single texture one um RGB here and now let's show the stats or platform stats actually here and this okay come back compiling compiling and one texture RGB to base color says pixel Shader 126 instructions for samplers it would be even less sometimes if I click this and change sampler source to shirt a wrap usually is the better choice most of the time compiling still for sometimes weird um let's modify the UVS a little to be more fair so multiply the UVS by the scale of 1.5 and put them here so this is a standard texture under texture okay 127 instructions for samplers now take a look I take the udem the movies and use it instead compiling 225 instructions so because most of the Simplicity of this material but still an addition of almost the same number of instructions as the whole Shader before of course these are not as heavy instructions as some this is not super reliable if you want to know more go to techraday.com and find the tutorial about about laser optimization optimizing shaders yeah it's a tutorial about true instruction cost what does it mean instruction and and so on but still it's a ballpark number that says new names are heavier to use but what is heavier in math doesn't really matter that much because these days bandwidth of memory is so much more precious than the calculations after it started with like Intel 486 in 1990 something the the disconnect between memory speed and calculation speed like memory was always slower and the trend just continued these days saving memory bandwidth is like much more important incredibly more important than saving shaving off a few instructions uh arithmetic instructions so don't be scared by this but take this into considerations that heliums are more complex plus the involve streaming normal texture is just the textures are extremely just read it so yeah that's it red house games um oh Sudoku says that samples come from decals try disabling the Deferred response that's interesting I don't know about that so you say Advanced dika responds none huh that's a lot thank you 182 instructions let's check the default texture 103 that's amazing thank you okay so hey you then what does it give us for all that cost it gives us five Textures in one very conveniently we just name the files our property 1 over 1 1002 with a DOT before and that's it it recognizes them as a udem grid as a udem grid we know already what we can do so let's say we don't multiply this UVs we don't do anything to them and there's also one and one important distinction how to make udem faster if you have multiple samples of different textures but the same UVS same meaning even you multiply them but then use the same output right then if you reuse UVS in udems you massively save on calculations oh I don't quite have a way to show you right now because this texture is the same or maybe let's try let's try um sampler Source would be different to break it and then let's learn between them just as a test you know synthetic test to show you what I mean with the UVS so these are both utensils same UVS UVS are identical compiling compiling 199 instructions what if the second udem will be with different UVs different UVS okay multiplied by a different number and here you see my determinate is different the cost is much bigger so 249 instructions now let me replace them by the same UVS 199 instructions so if you want to optimize udem if you do something for tiling or offset or something do that once and reuse them for different textures as much as you can of course some situations you can't do that but if you can design your pipeline in such a way do it reuse UVS for udems because as I said the math is complex and you want to have the calculations done once I think Android documentation pause it UV stacking for udems so you prepare the stack of the same UVS for different users and just reuse partially the calculations okay so we have two items but we don't need them yet we need a different fig first let's see what will happen if we just sample default text coordinates with a udem that contains five textures okay so it's as simple as it can be save that go back here and let's make a udem map probably this is instancing commands or actually we can go to the maps and save it as instancing or no uh is done since maths version two okay let's use fewer instances for now perfect okay that's our instance and let's assign this new material so instant smash material material it will be um is something much yielding place it here compiles uh-huh so as you can see despite the fact that the udem contains five textures sampling it with default UVS gives us the appropriate Bank so what now what can we do we can assume then that this thing is actually like in the model documentation from 0 0 to 1 1. as promised so what do we do to shift to the next texture let me show you tell you than us is it our material no sorry I need to open the material okay okay so what do we do we take the texture coordinates do add do a pen the second thing that we append will be zero because we don't modify the the V coordinate and the first thing will be a scalar called uh offset U okay let's just add let's play this offset just for a test half and Save so this is what happened texture was offset by a hub if it was Zero zero point one [Music] right it offset the texture in the in the U axis then when it reaches one we have actually moved by entire Square so here again new dim workflow Newton workflow this is one one so if we add Plus one zero then the zero one becomes one one then two then three if you add two if you add three and so on so to shift to yet another texture we use offset 2. offset three offset four and so on so how do we prevent the user by offsetting by half of a texture we take that offset and we do more just floor or around whatever you prefer round is more complex a little later looks more expensive so this floor just snaps it to the nearest integer all right so now I just move it fluently and it snaps to the next and lower integer so it just works however as you have noticed on the chart you cannot easily tile that stuff right or can you finding mistaking texture coordinates and multiplying them by some number so let's do time tiny timing put it here for now let's discard the offset does not care about that oh timing zero perfect I think one by default here okay timing five uh-huh we are all over the place on the udem here because we multiply this UVS five times so we got all five and when the and so on right so how do we actually tile museums you multiply this UVS like that then you do either track which Cuts everything does not the fractional part or you can do modulo with one which will always wrap if something is bigger than one let's say 1.1 it becomes 0.1 basically it's wrapping the thing let me show this on graphite I know it's simple but just to have it test it this is number X and this is modular X let's say cool right so every time it reaches 2 is back to zero back to zero so if you do module F1 it's wrapping like if it reaches one goes back to zero and so on so this is synonymous with frag X as you can see identical and shortcut for module F1 right uh at least I think so okay so you do rock put it through this after tiling after multiplying it will never exceed one meaning it will tile but what then if you want it to change the UV the the variant of course it won't work because after one it will go back to zero so you first do the frag and then you add the offset now take a look it just works it just works here is your timing of course the texture is drawn like that because it was baked in painter it's not a tieable texture it's like that um but still you can see it working so now I shift the offset okay and the timing also works like it should as I said the texture is not tidable but it doesn't matter it just works so frag and then do your operations however however I don't know if I will find that place where the seams are about this frog creates problems no it's not visible I think it's okay but sometimes it will be visible the I think it works with you these but with different textures Pro a different texture sampling is a problem doing this breaks the continuity because normally let's say you have zero you have one it grows right it grows towards two and so on doing this brings it back to zero zero meaning that the difference between that point on the UVs and that point in the UV is very close points the difference is insane it's like the entire texture like if this is here to actually the difference the whole texture computer doesn't know what's going on the GPU goes crazy so you can often see a blurred line because it thinks the distance is infinitely huge so yeah be careful there are techniques to do it we use dbx you calculate some stuff before doing frog pass it somewhere there you have to search on the internet because the whole topic on its own but basically that's take it into you know into consideration when thinking about tiling and doing work okay come and doodle welcome also thanks for following anthropic one job not and open diabet both soak amazing name so here we are we have dining we have offset okay let's bring back time to one here it is so now this offset can be random now it's a attribute from a person from us let's add more instances count instance count 300 okay many more let's change this material a little instead of Offset you with this manual let's use pair instance random which is available when you used a curriculum instant study mesh you take this multiply it by uh number of variants in udem number virus in our udem is five minutes multiply that stuff then flow it and here we go here you go so this this will be called um pick random probably you then okay and this will be called apply finally to you please okay take a look at the magic so now we have wait a second okay so now we have many variants of the same mesh using one mesh one material there are no material instances it's just you then shifting shifting UVS to the right by the entire size of a texture okay can you see that different textures so now the blending will be a breeze because take a look take a look let's repeat the entire setup [Music] um I know we should make a material function but it would be more obscure to viewers so let's just copy brute force that stuff uh so this will be to read [Music] from you then from a new them up okay let's copy that as I said Brute Force for readability on the stream read another texture from the and using address so now this is the same but we'll add just add one and okay [Music] um let's do it like that we add one or something so or maybe at the random Ah that's one or two whatever this will be called image to another extra okay then to make sure it's still within the limits we will do modulo Death Mode with number of variants in udem and four so this will be called make sure uh is within the number of doctors available okay so we have almost the same but shifting by some random number two okay I'm Gonna Be Free whatever and then and then let's read this and the blending mask will be local bounds so bounce zero one remapped or with contrast applied Maybe so saturate first I applied cheap contrast so transition contest okay or gradient contrast acne gradient contrast one let's first display the mask itself before we go further so let's do make material attributes let's display the mask itself as a base card the bounding box d-axis contrast it Sunoco asks if we need to care about tight packing of udems do I really have to use 101 then 102 then immediately of O3 or can I jump all over the place so normally you would have to right because of the caches if stuff is oh sorry for the color uh if staff will be nearby it'll be always better in traditional texturing continuously like that but thanks to Virtual textures you can make those parts all over the place and doesn't care at all I think this is that is how I understand the technology because it's anyway split into small tires so it doesn't matter if it reaches you know the tile here or the tile here it's split into tires anyway so it just needs to know what styles and then within the tile of course there will be some optimization so don't apply random noise to the UVS but if you coherently move stuff by F4 udem or even for 128 pixel grids it's okay so don't apply noise to the UVS but move stuff you if you move stuff like by whole udems you can do them spariously you don't have to care about utilizing all Neighbors which means you can use very nice parking structure because let's say you may decide that rows will be variance like I did but then you can decide that columns will be something else for example I don't know snow sand mud or wet type of object of the same object so for example conditions can be one axis the virus could be another axis then you can have three types of something and then one type of something else udem doesn't care because it's virtual texture so just move stuff like four units will be fine okay this is our mask take a look gradient based on bounding blocks of the object then Z and that's it chip contrast applied or 16 and so on okay so this is our mask now what do we have here on the top the top is what we previously had so the top oh come on what are you okay this was just the preview right Alpha um gradient mask so the top part is just the texture that we had the randomly picked one here right they're playing some tiling picking random textures from the udem and then some pick it here for those of you who joined later the udem looks like this and to import that you name the files are propriety dot 1001.1002 1003 and so on basically take a look at the documentation uh udem's in another engine so by shifting by a full number so floor a full number we change the texture having just one material one texture this is one texture okay so now the second thing is the same but contains some more Randomness just adds shifts it by three okay uh so let's see how does the second thing look like it would be the same but slightly different right differently picked texture so now when you have both and we make material attributes it's a special node and then you click on empty and here you select use material attributes it changes the output to use material attributes right when you do that you can make material to build pack stuff there and then blend between four material sets like this so material one material tool and the gradient mask let's apply and yes as you can see two materials on one object using just one material and one texture right now to prove this I know they look similar so let's make the bottom one let's say less rough or a bit okay the top one the top one will or what okay this whatever okay again the top one we have roughness 0.1 and the bottom one will have higher what copy bottom one we have roughness 0.9 and then you will see difference that they are actually full materials not just base colors let's hydrate not that much of a difference but there actually is okay you can see it right the bottom one is shiny the top one is very rough right so full materials now what do we do if we have not just the base color but also the normal and stuff what do we do then well we have the UVS already so instead of read the texture let's do repair UVs to read a texture from a unimatus and then prepare different UVs to read another texture from a UD mattress then instead of texture sample at the end we just put this put that and then here this is our base color and let's make another uden udem of normals so here we go rename it as I said um and 1001 that's for unreal recognize it as you'd um and 1003 now this I've done something wrong right what did I do wrong actually wait a second there are more variant zero variant one two oh I have six variants right and okay but let's take let's delete variant 5 for now I don't need that okay we have them so as I said before we just import the first one and unreal Imports all five as you then compression normal map of course save it and now here we just put the normals so take a look we have the normals and we use the same UVS and as I explained before reusing UVS in udem is of crucial importance because it's a big optimization UVS are put into a UV stack which then determines which part of the udem to load from disk so it's important to have them coherent as much as possible if not then oh well but if yes then reuse them RGB till now okay now we should have normals from it or at least the one part mm-hmm we do right so a full material make materials then we repeat that stuff so take a look same Atlas normal and we're good to go um works like a charm so we've reached the first point blending materials meaning not the second point two materials on one object with a spatial transition a static mask gradient whatever right so great is here blend material attributes two sets of a udem a full array of stuff full address and then you just prepare the text the the coordinates in a specific way it doesn't have to be random you can put the user data here to choose so as you can see spatial transition let's widen this gradient a little so let's contrast right you can see this is actual full material blending and we're not using a ton of ifs a ton of blends we just have four texture samples so amazingly low udem samples are heavier than typically but oh well they serve the purpose here and don't be too afraid of arithmetics of the cost of arithmetic it doesn't matter as much as texture bandwidth these days okay other has to go not feeling well take another thank you uh so yeah static transition is here so the next point will be a material morphing into another material over time oh and one important thing you cannot put different types of texture into same unit you them has a sample type filter color virtual virtual normal linear color so it means srgb and compression type has to be the same present our unit so that's why normals are separate colors are separate and gray skin masks will be another udem okay that's important so here we are so now animation animation will be easy this is a static gradient mask it's not a grinding mask what if instead we have what if we have craft story sine of x this but multiply by half that's so the sine of x will be transitional animation let's do it we have two materials to blend between we take time we to multiply it by animation speed let's say one two one months per second then we do sign then we multiply sign by of like this and then we add oh so this is I only made this transition it's a little orange is it in zero one range it is because if you multiply some by half and that half is removed from minus one to one to zero two let's visualize it straight here apply it's very fast there's no animation speed zero three as you can see its transitions between two different materials just like this and of course again this transition can be manual it doesn't have to come from a sign right you can put a variable there just make sure it's between 0 and 1. so as you can see it's a full nice transition right so with the same udem setup we've achieved animated transition within one material that of course means that every variant that you want to blend between we have to be specified in the udem itself here but the resolution doesn't constrain you you can go as much as you want to the right you'll have hundreds of them within a udem because it's a virtual texture so it's split into tiles and packed cleverly it doesn't matter so visual textures are really like a match made in heaven with units nice so one click and we have material morphing into the material over time but that also means that you can't do arbitrary meshes with arbitrary UVS it will have to be the same UV setup for both otherwise it would be won't be able to make the transition the material right we have to read everything typically so here you need to unify the UV setup for your stuff if you bought your assets or something you need to rebake them into coherent UVs of course you can use different UVS here and you know modify stuff but it won't be as simple then because here okay it picks random per instance but I can just not use it and just do noise of texture like this and take a look save it 'll be always texture zero for now tag transitions between the same so now look I change it to 1 apply oh have I changed it no default value sorry for one it's a different texture right now I change it to two three four so you can make it a manual choice what's more you can make it accessible to blueprint by converting into custom primitive data custom primitive data is here then it's not governed by a material instance it's per mesh you can use the same material in every mesh same material instance on every mesh and still send this individual param flip through blueprint so custom primitive data are amazing they are a topic on its own uh check interactive materials on techraday.com it explains how you can use custom primitive data to have the same material instance everywhere no draw calls no additional draw cost and still modify the parameters of material per mesh so with this combined you can have amazing things so let's go back for now to Randomness just to make stuff interesting more like this thank you okay let's see so we have both material morphing another matter over time the materials have started a special transition spatial transition now an overlay on top of another material how to apply for example fire or electricity on top I have Henry 5.1 already compiled from GitHub and if you're interested you have this earlier since 5.0 July 2022 I showed that two streams ago so recommended if you're curious because few months already have passed since 5.0 and there's a lot of nice things sorted translucency for example huge improvements to instancing usability and more stuff like this okay so this is Henry 5.1 take a look at this this is procedurally done in Blueprint and optimize procedurally in Blueprint it helps optimized too much but it's possible and here let's check this overlay stuff also take a look at the instances these are instances and I just select single instances okay enough of that hype and therefore where is this model actually pressed my instance group mesh okay we have some match some match we place a material on okay mesh with material and now let's create a new material that will be M overlay math in advance yes it's here it's already convinced you have overlay material so just take the material move it here not that much see so in any mesh you just place the overall material is here it also has Max draw distance so let's set max zero distance off of 1 meter it doesn't do anything whatever anyway it's there and if you have half translucency so opacity multiplied by take a look by half right in the node okay you have this emission is too bright I think uh [Music] or this opacity is too big let's try 0.1 zero zero zero one aha that's why that's why just darkens the stuff okay actually why it casts shadow or something let's try default in it that's weird why is it black so maybe it's masked opacity oh I don't know let's do um the box so bound saturate B and let's use that as opacity instead of grid filtered let's try okay so apparently it just makes stuff black hmm that's by the way into a power that's not fair okay so only when the opacity of overlay material is zero then it draws the underlying mesh so let's take a look uh this would be called opacity with zero so we'll see the original mesh take a look when opacity is zero overlay material is not visible 0.0001 apply okay still there 0.01 uh-huh and 0.02 so anything bigger than some very low threshold and the overlay material it's not it's not behaving like uh translucent thing it's behaving like masked opacity done basically darkening the stuff below I'm not sure why and if there's anything that can be done about that I'm going to change it to one red same story exactly same story what if it was a decal a decal actually works okay so that's the way that's the way take a look opacity one the right so it should be a decal now it's nice so a different decal material domain translucent blend mode okay and the overlay material works like a charm so again you select the mesh you find the overlay material you just drag the software material here okay so make sure it's a decal type here deferred deco translucent works like magic now this Max zero distance is curious wouldn't it just work water okay so I showed you another thing that's new in honorary engine 5. it's an overlay on top of another material so those of you who are still on the floor I know you are anxious to wait for this and of course you can set it from blueprint right so this will be most easy to use of course the cost is it draws another material on top of the mesh it draws the mesh twice but at least you don't have problems with Z fighting you can go as far as you want and it still just works another Advantage is you don't have to make your material complex because you can swap the overlay material to another material per mesh per single match Android 5.1 is not there because of course the files won't be compatible so yeah this is what we achieved today the blending and the udems see you today see you coming doodle see you next house games see you in a gamer and silicon thanks for being here thanks for the big attendance today bye

Channel: Tech Art Aid

Views: 14,463

Keywords: tech art, ue4, ue5, unreal engine, tutorial, shader, procedural, game art

Id: -oFY5QWXKZY

Length: 90min 29sec (5429 seconds)

Published: Thu Aug 18 2022