See Through Wall Shader - Unity Shader Graph Tutorial

Поділитися
Вставка
  • Опубліковано 10 гру 2024

КОМЕНТАРІ • 121

  • @ThiccestMayo
    @ThiccestMayo 3 роки тому +5

    For those who cant "Show Generated Code", just go to where you have saved your shader in the unity editor, right click, properties, and view generated code.

  • @Lavimoe
    @Lavimoe 10 місяців тому +9

    For people who stumble across this great tutorial, in Unity 2022 at least, you can set "Depth Write" to "ForcedEnabled" in "Graph Settings" in the shadergraph to force enable ZWrite, so you don't have to do the ZWrite Fix part :D

  • @harvestergames
    @harvestergames 8 днів тому

    Perfect tutorial, thumbs up for calm voice and background music!

  • @joshuabidwell2614
    @joshuabidwell2614 4 місяці тому +1

    Champion. I was entering render-order-hell trying to show a different silhouette for a multiplayer game. Instead I used your idea of a draw-behind material and dithered-out a hole for each of the players :)

    • @HuntersonStudio
      @HuntersonStudio  4 місяці тому

      Is you use global materials for the player data, you don't have to do it per material

  • @exhit-gamedeveloper9971
    @exhit-gamedeveloper9971 3 роки тому +1

    Loved this tutorial BECAUSE you explained the whole process. Learned so much about how Shader Graph works!

  • @Hazuuur
    @Hazuuur 2 роки тому +11

    Hey, it still works on Unity 2021.3.12f URP template, but they removed PBR Master, instead you can create Unlit Shader Graph and by clicking space add Alpha property to the 'fragment' node. Rest of steps are almost the same, only UI may look a lilttle bit different.

    • @fraz66
      @fraz66 Рік тому +3

      Great comment, thank you! Another note they renamed 'Albedo' to 'Base Color', which is also in the fragment node

  • @toddkuebler6081
    @toddkuebler6081 3 роки тому

    For those of you like me who require explanation of the 'why' the zwrite section may be a bit opaque - the reason I figured out is that shader graphs are stored in a very different format than shaders, so editing the generated code from the shader isn't savable back to your shader graph file. The step to create a shader in the video ( it could be literally any shader, not just the one he chose ) was just to create the .shader file so the generated code had a place to live. You could have just created a .shader file with a text editor or your ide and it would be the same thing. This may be obvious to most, but found it very confusing until I edited the different files in vi and saw the different formats.

  • @luizfellipe1206
    @luizfellipe1206 3 роки тому +1

    You saved a good citizen today my friend! thanks a tons!

  • @AcrylicPixel
    @AcrylicPixel 4 роки тому +3

    Thank you so much for this tutorial! I learnt so much.

  • @rocketshader2699
    @rocketshader2699 2 роки тому

    Amazing tutorial and it works smoothly!

  • @FaeranJourneys
    @FaeranJourneys 4 роки тому +1

    Man! you ROCK! this its Awasome!

  • @vitvohralik5557
    @vitvohralik5557 2 роки тому

    Perfect! Thank you, this is best tutorial

  • @chm10323
    @chm10323 7 місяців тому

    that is great tutorial, thanks for sharing

  • @azyjmexcuseokstop924
    @azyjmexcuseokstop924 24 дні тому +1

    any ideas how to make this work for multiple objects ?

  • @juandeybycarlos-chullo6741
    @juandeybycarlos-chullo6741 3 роки тому

    Thank you, this video was usefully, I love this

  • @T0assted
    @T0assted 4 роки тому

    This was great! helped me understand shaders better :)

    • @T0assted
      @T0assted 4 роки тому

      How could you modify this to use multiple object? Or would this require something special?

  • @tariqmahamid1633
    @tariqmahamid1633 4 роки тому

    Good tutorial! Well put together.

  • @trs81234
    @trs81234 4 роки тому

    Thank you ! It help me a lot !
    Great work !!

  • @CodeBlues-TimeisGold
    @CodeBlues-TimeisGold 2 роки тому

    I lived thanks to you. Thank you so much.

  • @michpo1445
    @michpo1445 2 роки тому +1

    How did you get to your Graph. I cannot find the Node called Texture and Tint. There is no PBR Graph anymore. I am using Unity 2022. Can you please update for latest unity version, everything is different.

  • @Agigaherger
    @Agigaherger Місяць тому

    AMAZING

  • @Ricky-sr5ie
    @Ricky-sr5ie Місяць тому +1

    Has anyone had an issue with this where the color of the tint overwrites any material you’re assigning the shader to? And then assigning the texture adds the color of the tint in different areas of the material?

    • @JustJak15
      @JustJak15 18 днів тому

      same here. I'm new to shaders so I'm a bit lost on this. Did you find a solution in the end?

  • @bahadirkandemir
    @bahadirkandemir 4 роки тому +1

    Hi!
    I tried to fix ZWrite issue properly, this led me to do similar effect with Amplify Shader Editor. Some node like Screen Position were missing or completely different, so I followed your approach (peeking Ellipse implementation) and did the same thing with existing nodes. I feel a lot comfortable with using shader editor thanks to you.
    Now I'm trying to add lightmaps to the shader, for some reason baked lights are missing.
    Cheers!

    • @HuntersonStudio
      @HuntersonStudio  4 роки тому +1

      Nice to hear you are trying it! I haven't used Amplify, but nice to hear this tutorial make you feel more comfortable

  • @abhishekkanaujia3492
    @abhishekkanaujia3492 2 роки тому +1

    Hi I tried making this Unity 2020.3.35f1 and shader graph 10 everything works fine except for saturate and smoothness properties. I got no idea what could be going wrong any help is appreciated.

  • @ArthurGamer
    @ArthurGamer 2 роки тому +1

    Friend, your tutorial helped me a lot, I made some modifications that made it even better visually speaking, a doubt, how could I use it in material with alpha clipping activated? the circle smoothing effect kind of dies...

  • @sayuhhhm
    @sayuhhhm 7 місяців тому

    Thank you for this! ☺ working in 2022.3 - I'm using this for an isometric game and trying to scale the _Size with my camera's Orthographic Size to keep the ellipse consistent when zooming in and out. If anyone has any ideas please feel free to let me know 🙇‍♀

  • @SixDayStudio
    @SixDayStudio 4 роки тому +1

    Thank you man! You rock!

  • @AcrylicPixel
    @AcrylicPixel 4 роки тому +2

    For some reason the script is following the camera and not the player in my game. I'm using Cinemachine (so the camera follows the player), am I missing a step? or do I need to change a line of code?

    • @HuntersonStudio
      @HuntersonStudio  4 роки тому

      You should add the script to the player itself. The script calls 'transform.position' which looks at its own position.
      If you add the script to the camera or something else, it will try to follow that.

  • @user-em9su3dd9y
    @user-em9su3dd9y 3 місяці тому

    Thank you!

  • @johnnilson9039
    @johnnilson9039 2 місяці тому

    Would this work with a Unity terrain? I'm trying to create a golf game and need to cut a hole in the terrain to simulate the cup on a golfing green. Unity's built in Create Hole terrain tool can only create square holes which makes things really complicated.

  • @NajibBari
    @NajibBari 4 роки тому

    Cool cool cool now let's get some cheese in here.

  • @VaneSlasher
    @VaneSlasher 13 днів тому

    What's da name of that techinique? Some people says it "occlusion culling" but although the concept is the same, I don't believe that this is the term that defines it. Could you tell me what the correct term is?

  • @vitbull88
    @vitbull88 3 місяці тому

    Great video thanks! I have this problem: I have a rotating isometric camera, and I want to apply this effect through walls. The problem is that walls can be in front or behind the player, depending on the camera rotation. The shader makes a hole in all the walls, of course, but I want it to affect only the wall between the camera and the player, while the one behind should be unaffected. I understand I should use the depth buffer in some way, can't figure it out how. Do you have any suggestions?

  • @r.gtz.4521
    @r.gtz.4521 2 роки тому

    Awesome tutorial man. I got through it and everything works. I thought I was having issues with WorldToViewportPoint and the cutout not exactly following my character, but looking at your end result, it looks like you actually have the same thing going on; where the circle "sort of" follows the character but when its close to the edges of the wall its really not centered on the character. I would love if it were always centered exactly over the character, but I know WorldToViewportPoint is translating the point relative to the camera so this gets finicky.

  • @bovineox1111
    @bovineox1111 Місяць тому

    Interesting solution, but renderin lots of opaque geometry as transparent could get hella expensive, especially on some platforms. Might be okay to swap the shader for parts of the scene but isn't necessarily a quick operation either.... I'll continue watching to see if you offer up some magic for this...

  • @rsjabber1231
    @rsjabber1231 3 роки тому

    Perfect! Thanks!

  • @changruizhu7923
    @changruizhu7923 4 роки тому +2

    That is so Awesome!!! But I can't find the wall layer mask , can you help me?

    • @HuntersonStudio
      @HuntersonStudio  4 роки тому +2

      Thanks. Of course! When selecting the object, at the top right of the inspection you can select a layer. Click on the 'Add layer' button. Add 'Wall' to the list and then select it again at the object. Otherwise look for 'unity layers' on youtube.

  • @moorllk6290
    @moorllk6290 7 місяців тому

    Thank you very much

  • @viva-la-baz1458
    @viva-la-baz1458 Рік тому

    this doesnt seem to work with different materials for different walls.

  • @janhildebrandt2598
    @janhildebrandt2598 2 роки тому

    For some reason, when i set the opacity above .5 it starts just changing the size of the circle. Does anyone else have this?

  • @jazzy_rey
    @jazzy_rey 2 роки тому

    when the shader is changed to transparent the models start overlapping themself so this is not working properly, (SOLVE) THE FIX IS ON 18:43

    • @HuntersonStudio
      @HuntersonStudio  2 роки тому

      Does the proposed fix later on in the video not work?

    • @jazzy_rey
      @jazzy_rey 2 роки тому

      I just try it and yes it is working, I was getting frustrated but it was my fault cause i never watch the video till the ZWrite Fix thanks.

    • @HuntersonStudio
      @HuntersonStudio  2 роки тому +1

      I understand, we all have those moments when watching tutorials. :D

  • @venesardthethief6704
    @venesardthethief6704 2 місяці тому

    In the moment where I divide height by width and pass the result to the Vector2, shader stops working. If I use purely "size" for both height and width, everything works fine. What is going on?

  • @Sorvete2
    @Sorvete2 4 роки тому +1

    How do I apply that shader to an existing material? For example, How did you apply that shader to the material used on the tree?
    I am asking because I am new to shader and when I try to use the shader on a material I lose all the material details

    • @HuntersonStudio
      @HuntersonStudio  4 роки тому

      You can view the shader as a material. But a material is an individual instance of that shader.
      All of the variables defined in Shadergraph's Blackboard are the variables you can set in Unity. So this shader does not have a normal, because I didn't define that in the blackboard.

  • @theishiopian68
    @theishiopian68 4 роки тому +1

    Excellent video, it seems like this should be such a simple thing but sadly isn't, I spent hours searching until I found this.
    One question, what would it take to make this work completely with flat meshes? I have a game where the world objects are all 2D quads (think don't starve but you cant rotate the camera) and for large objects I want the player to be able to see themselves behind them. The shader, albeit modified to support textures with transparency (I'm just combining the alpha of the circle with the texture using subtraction and clamp) works pretty well if the player is behind the object, but also adds transparency when the player is in front. I assume this is due to the thinness of the player and the objects. Is there some way to ensure the transparency only kicks in when behind the objects?

    • @HuntersonStudio
      @HuntersonStudio  4 роки тому +1

      The video also shows how to deal with this. You can cast a ray from the play towards the camera. If it hits something, you know the player is behind something and you can activate the transparency. This can also work in 2D

  • @user-dd9is6iy9m
    @user-dd9is6iy9m 3 роки тому

    This was quite hard to follow - I appreciate the effort and thank you but at 2:24 what keys did you press to open that window? How do you setup the Simple Texture 2D window at the start with B set to "Tint" etc? So much unexplained :(

    • @HuntersonStudio
      @HuntersonStudio  3 роки тому +1

      I should have made this clearer at the start of the tutorial. The tutorial is about the shader itself and how I made it, not about how to use Shader Graph. I would suggest using Brackeys' video on the basics of Shader Graph: ua-cam.com/video/Ar9eIn4z6XE/v-deo.html

    • @AndreCorreon
      @AndreCorreon 3 роки тому +1

      Hey, complete beginner in Shader Graph here. But if you're referring to the Properties, you might notice next to "Tint" it says "Color", that's something you can add by clicking the + sign! I was struggling to find a "Tint" option there, only to realise it's actually a "Color". Same thing applies for the "Main Texture", click the + sign and select "Texture2D".

  • @Matt-qr7sy
    @Matt-qr7sy 2 роки тому

    hey can you tell me how to do it with texture not ecplise?

  • @youarepredictable
    @youarepredictable 4 роки тому +1

    would it be possible to have a raycast or spherecast from the camera or something then based on those collisions, apply a texture/shader on the fly? I want to avoid having to assign the shader/texture to every wall/object in my scene before hand, but instead do it programatically based on the camera and what it is looking at.

    • @LockTheMage
      @LockTheMage Рік тому

      You can do this. Objects can have more than one material so you could just apply the material to it via code if its detected by the object

  • @theoistic7002
    @theoistic7002 2 роки тому

    dude .. just what i was looking for ... that being said, is there a way to specify regions of a mesh that can be cut-out .. lets say we walk behind the wall and the size is large .. we can potentially make the entire wall disappear. so the lower part of the wall could/should always stay visible. to mark the level boundary. I thought about complex vertex shaders, but it should be possible with screen space alpha masking .. no?

    • @HuntersonStudio
      @HuntersonStudio  2 роки тому

      You can indeed simple use the UV and add a mask to specify parts which are masked out. A simple black and red texture will do. After the texture sample, just grab the red value

  • @markoz985
    @markoz985 2 роки тому

    what do i have to change to make this ''seeThrough wall shader'' into a ''see inside a object shader''?
    I always want to see the location of my sphere/player/etc inside my body so the shader has to turn on at least the moment my sphere/player/etc makes contact with the object
    Any suggestions?

  • @giulianoscalamandre1555
    @giulianoscalamandre1555 3 роки тому

    which color have you assigned to the tint property?

  • @ragetist
    @ragetist 4 роки тому +1

    First of all, a big hearty thank you for this amazing tutorial! This made my life a lot easier and my learning project a lot cooler.
    Now, I have a problem where if the player goes into a 90-degree corner in a room where this shader is applied to both walls the see-through effect makes even the wall behind him goes transparent. I think a hacky fix would be to make two variants of the same material, one for vertical and one for horizontal walls so that the raycast returns only one of them but I wanted to ask if there was maybe a more refined method you could think of?

    • @HuntersonStudio
      @HuntersonStudio  4 роки тому +1

      A fix for the long run could be to get the distance from the player to the camera and compare it with the depth buffer. if the distance is shorter than the object's depth value, the wall can just be rendered solid

    • @hansshadow360
      @hansshadow360 3 роки тому

      @@HuntersonStudio Hi, if the object is a cave, the shader replace all inside the fade circle. How i can replace only the top part, but keep the bottom cave part?? The game have a top down view.

    • @ragetist
      @ragetist 3 роки тому

      @@HuntersonStudio Thanks! I'll check that out.

    • @ragetist
      @ragetist 3 роки тому

      @@hansshadow360 I think the easiest method would be to just slice the cave model into two parts and use the shader only on the "roof", I would imagine getting the shader to affect only the horizontally aligned sides would be a lot more complicated.

    • @teddybacon1483
      @teddybacon1483 2 роки тому

      @@HuntersonStudio Do you know any good tutorials on coding something like this? Depth buffers are out of my league 😭

  • @akc5725
    @akc5725 3 роки тому

    Thanks for this tutorial
    I have a question
    In my sceen three camera and I want to only one camera show this effect not other two...
    How can solve it
    Please help me

    • @HuntersonStudio
      @HuntersonStudio  3 роки тому

      The only way I can think of, is using different layers. That one camera can render a see through layer, which the other 2 can't see? Other than thay, there is no fix. This is a Shader effect and will be applied regardless of camera

    • @akc5725
      @akc5725 3 роки тому

      @@HuntersonStudio OK I will try this method.
      Thanks for reply

  • @IncroyablePix
    @IncroyablePix 3 роки тому

    Absolutely wonderful, trying to figure this out on my own was driving me nuts
    I'd have a question however... Considering that I've a character who's in a four wall room and a camera in the back, would it be possible to apply the shader on the wall that's behind me only, without revealing the wall that's in front of me (whose material is the same and should act the same depending on the camera position)? (:

    • @HuntersonStudio
      @HuntersonStudio  3 роки тому

      You could do a check on the distance of the player to the geometry. If the player is closer to the camera than the geometry is, don't fade

    • @IncroyablePix
      @IncroyablePix 3 роки тому

      @@HuntersonStudio Got it - thanks again!

  • @astralengineer1
    @astralengineer1 3 роки тому

    When i apply the change size stuff from the Camera to the divide to the multiply going to the size and then ellipse. The transparent form dissapears totally but when i remove those nodes its back in a stretched form. I followed every step

    • @HuntersonStudio
      @HuntersonStudio  3 роки тому

      It might be because the size variable you use with the multiply is 0 in the blackboard. I could be wrong

    • @astralengineer1
      @astralengineer1 3 роки тому

      @@HuntersonStudio i did change it in the inspector if that’s what you mean. Sorry if I’m wrong but it’s first time with shader graph in unity for me. Tho I am experienced in Unity not I graphs.

    • @HuntersonStudio
      @HuntersonStudio  3 роки тому

      @@astralengineer1 I understand. I recently went back to the default renderer. Hopefully learning HLSL helps with the Shader Graph later on.
      If you join the Discord and ask your question there, maybe the screenshots, it might be easier to help you :D

    • @astralengineer1
      @astralengineer1 3 роки тому

      @@HuntersonStudio sure will do

    • @josephbunda9106
      @josephbunda9106 3 роки тому +2

      Dunno if you've solved this by now, but here's what I found. The camera node only outputs width and height (for the aspect ratio) if the camera is orthographic. To get the aspect ratio, use a screen node instead.

  • @taibasarovadil
    @taibasarovadil 3 роки тому

    Thanks for a great tutorial. Unfortunatly I have a little problem. Depending on camera angle blocks may be rendered on top of each other while actually being on the same height. Any chance of you knowing what causes it?

  • @neoneperful
    @neoneperful 4 роки тому

    I found your tutorial incredible. Thank you for that. I would like to ask you something.
    Would you be able to tell me how I can include border of objects only within this visibility area
    ?

    • @HuntersonStudio
      @HuntersonStudio  4 роки тому +1

      If you can find another tutorial on getting the border, you can multiple the hole-mask with the border.
      Unfortunately, I don't know how to get the border

  • @vincentchan4754
    @vincentchan4754 4 роки тому

    Is it possible to use Tag rather then Layer? because some of the prefabs contains LOD, this will not work... or am I doing something wrong.

    • @HuntersonStudio
      @HuntersonStudio  4 роки тому

      Tag could work but would require the raycast method to look at all layers to compare the tag. By calling the raycast method with a single layer is just more performant.

  • @Nakso13
    @Nakso13 2 роки тому

    Hi there, thanks for the tutorial its really great but is there a way to make this work with multiple players please?
    I want to generate has much ellipses as I have players, is it possible?

    • @HuntersonStudio
      @HuntersonStudio  2 роки тому

      It is possible, just not very clean. You have to copy the eclipse noses as many times as you have players and expose as many vector3 values as well.
      Not clean, but possible

    • @Nakso13
      @Nakso13 2 роки тому

      ​@@HuntersonStudio Okay thanks for the quick answer but the problem is that I have a dynamic number of players, sometimes there will only be 2 players and sometimes 4 at most. I could still do it as you say but its really not clean :c
      Isn't another method to get the same result but more properly?

    • @HuntersonStudio
      @HuntersonStudio  2 роки тому +1

      You have set the shader to work with the most amount of players. Then in code simply set the size of a circle to 0 for every circle which has no player

  • @TheWendo101
    @TheWendo101 3 роки тому

    Since you posted this video I feel like everything about shader graphs has changed from a UI perspective. Everyone in the comments says the tutorial works great but so many of these options aren’t even available to me. Is there a similar tutorial for the 2021 version?

  • @Chalkcs
    @Chalkcs 3 роки тому

    Does this still work with Unity 2020.2? I can't get this to work at all, from the start I'm getting no result

    • @HuntersonStudio
      @HuntersonStudio  3 роки тому

      Hmm, that's weird. I guess it should. Is URP setup properly? I heard there might be problems with hdrp

    • @Chalkcs
      @Chalkcs 3 роки тому

      @@HuntersonStudio URP is working fine, I'm quite far in development - I'm not sure why this isn't working. I think the workflow changed for shader graphs, but in general it works about the same so I'm not sure what's wrong

  • @kuzanagi9334
    @kuzanagi9334 Рік тому

    nice

  • @blankcanvas499
    @blankcanvas499 4 роки тому

    Hey, thanks for the tutorial! I had one question; If I have 2-3 materials in the scene which use this shader will this need me to individually add the materials in the inspector of the player?

    • @HuntersonStudio
      @HuntersonStudio  4 роки тому +1

      Good question. Unfortunately, yes. Shader graph does not support global variables (as of now) so every material needs to be updated individually

    • @kyledavies3721
      @kyledavies3721 Рік тому +2

      This may be a little late, but a fix I found to this is by changing the code in the player.
      Inside the If statement adding these 3 lines of code above the line to set size will let it work with whatever objects material is directly blocking the player from character:
      RaycastHit hit;
      Physics.Raycast(ray, out hit);
      WallMat = hit.collider.gameObject.GetComponent().material;
      where "WallMat" is the variable name of the material you would otherwise use in inspector.
      This might not be a one solution fits all, but it allowed me in my project to use multiple materials without relying on setting them all in the inspector.
      Also if there is multiple objects blocking the view of the player you could also use RaycastHit[ ] and Physics.RaycastAll to store multiple hit objects with a distance calculation to the player for length and iterate through each hit object and change them all together.
      Hope this helps someone! 😁😁

  • @keeko7820
    @keeko7820 4 роки тому +1

    Is this URP or HDRP?

    • @HuntersonStudio
      @HuntersonStudio  4 роки тому

      This is URP, but i am fairly certain this will also work with HDRP

    • @keeko7820
      @keeko7820 4 роки тому

      @@HuntersonStudio I am also using URP, and I have the same issue at the end with the Z sorting issue when I use the transparent surface mode. However, when i view the code, ZDepth is turned on already?

    • @HuntersonStudio
      @HuntersonStudio  4 роки тому

      @@keeko7820 You mean ZWrite? What version of Unity, URP and Shader Graph are you using? They can all be different

  • @DonDisainer
    @DonDisainer 4 роки тому

    love your video, thanks so much, the ray condition doesnt works because i use a ortographic camera :c

    • @HuntersonStudio
      @HuntersonStudio  4 роки тому +2

      The only thing you need to change with the ray is the direction, which is just the inverted direction the camera is facing. so: -camera.transform.forward. That's it

  • @orangelimesky
    @orangelimesky 3 роки тому

    does this work for 2D objects?

    • @HuntersonStudio
      @HuntersonStudio  3 роки тому

      It should. I haven't tried it, so I'm not sure. But I guess it should

    • @orangelimesky
      @orangelimesky 3 роки тому

      @@HuntersonStudio It does. However I'm losing the 2D lighting on tilemaps once I use this material for them :( Wish I knew how the lit graph worked

    • @HuntersonStudio
      @HuntersonStudio  3 роки тому

      I guess you can make a 2D graph and apply the same shader graph nodes as the tutorial. This might fix the issues

  • @jamesboyer4631
    @jamesboyer4631 4 роки тому +1

    Can this be used without using URP, or LWRP?

    • @HuntersonStudio
      @HuntersonStudio  4 роки тому

      Most, if not all, shader graph's nodes can be translated to HLSL code. So, yes, you could!

  • @rbanister100
    @rbanister100 3 роки тому

    CAPSHULE? I thought you were talking about the CAPSULE, not a CAPSHULE

  • @totidokkan
    @totidokkan 2 роки тому

    If you are a complete beginner...dont watch this. He didn't explain that you have to download the Shader package from the asset store. He didn't explain how he made the "simple" shader graph.

    • @HuntersonStudio
      @HuntersonStudio  2 роки тому +2

      Please note that you have to grab URP or HDRP from the package manager in order to use Shader Graph. Not 'shader package' from the asset store.
      Also, feel free to pause the video at the moment I show the simple shader. I believe you'll learn more from creating it yourself (albeit from a screenshot) than to blindly copy what someone from a tutorial says

  • @Valentyn90A
    @Valentyn90A 9 місяців тому

    Dankje!