Search Unity

Shader Graph image effects for the Postprocessing stack

Discussion in 'Graphics Experimental Previews' started by iBicha, Oct 10, 2018.

  1. iBicha

    iBicha

    Joined:
    Jul 7, 2013
    Posts:
    30
    Edit: I moved this experiment to a separate repo here: https://github.com/iBicha/ImageEffectGraph

    ImageEffectGraph

    As an experiment, I threw this together to see how nice it would be to edit Postprocessing stack effects in shader graph.

    Since effects are used to be done by transforming a source texture into a destination texture through a shader, The idea is to have a "Main Texture" source input node, and an "Image Effect Master" output node, and the graph would be responsible for transforming things in between.

    I wrote an effect renderer that takes a material as a parameter, allowing it to be generic and working for any full screen effect shader.

    The prototyping I did is too hacky for my taste, because I'm not familiar with all aspects of shader graph and SRP, but somehow it worked nicely:




    Which made it easy to get creative with image effects. Using graphs for image effects made so much sense, and was wondering if this is an idea Unity would like to pursue and have it builtin.




    The source code for this experiment: https://github.com/iBicha/sevakon
     
    Last edited: Nov 14, 2018
    Kabie, rizu, midsummer and 3 others like this.
  2. Jick87

    Jick87

    Joined:
    Oct 21, 2015
    Posts:
    124
    Big +1 from me. I think this is something that should definitely be possible with shader graph out-of-the-box. I can't imagine they would not add this ability at some point. It seems obvious.


    As an aside... I have to say that video is one of the greatest things I've ever seen. The sound effects and everything are just hilarious! I assume that is a game you're working on? Great work there. ;)
     
  3. iBicha

    iBicha

    Joined:
    Jul 7, 2013
    Posts:
    30
    Thanks! It was originally a job interview assignment (a simple first person that shoots whatever) but I decided to try out the newer Unity features for the sake of learning, and I put on a game jam mindset on, then it simply got weird haha.
     
    P_Jong likes this.
  4. iBicha

    iBicha

    Joined:
    Jul 7, 2013
    Posts:
    30
    Another experiment: creating a "stereo" post processing effect (shifting the red/blue channels to the left/right a little) using shader graph. Doesn't take depth into consideration, but still.

    Screen Shot 2018-10-12 at 1.20.05 PM.png
     
    Quatum1000 and Jick87 like this.
  5. m3rt32

    m3rt32

    Joined:
    Mar 5, 2013
    Posts:
    60
    @iBicha Which version are you using as Render pipeline ? Because, I've tried to import your project using Unity 18.3.b4, imported necessary packages and purged ecs related stuff bcuz it was giving roslyn related errors. Anyway, right now in shader graph there is a red error on top of Image Effect Master which says "Current render pipeline is not compatible with this master".
     
  6. iBicha

    iBicha

    Joined:
    Jul 7, 2013
    Posts:
    30
    The Image Effect Master is currently only implemented with the Lightweight render pipeline
     
  7. m3rt32

    m3rt32

    Joined:
    Mar 5, 2013
    Posts:
    60
    Yes I am using LWRP 4.0.1, Is there a way to seperate the image effect part from other experiments bcuz of compiler errors. I've tried it but it got broken
     
  8. iBicha

    iBicha

    Joined:
    Jul 7, 2013
    Posts:
    30
    That's pretty odd, since the LWRP 4.0.1 is what I'm using.

    I did a loaded a fresh clone of the repo in Unity 2018.3.0b5 both on Windows and Mac. They both failed with different kinds of errors. Restarting the editor on each made the project load successfully.

    But you are right, the image effect feature should have been in a separate repo, but it was hacked together for testing.
    This post is mainly to get the attention of Unity's graphics team and see if they want to implement such feature. If not, I might consider rewriting a clean version and publish it separately.
     
    P_Jong likes this.
  9. m3rt32

    m3rt32

    Joined:
    Mar 5, 2013
    Posts:
    60
    @iBicha What I see is this when I clean compiler/ECS related stuff with LWRP 4.0.0 (4.0.1 not working). This is the default repo files, I didnt change anything and post processing effect not works at all. Btw this is overlay shader.

    Other than that, I understand your intension and thats what I was looking for sometime, but when I asked to them over scriptablerenderpipeline repo, they replied me "Shader graph does not work with new srp" and they didnt have a plan to implement back then. But I'd like to create a tutorial video with an example bcuz I find it useful to create image effects with shader graph just like you do. And I believe it could be helpful for community.

     
    Last edited: Oct 17, 2018
  10. iBicha

    iBicha

    Joined:
    Jul 7, 2013
    Posts:
    30
    That looks indeed strange. I'll investigate!

    I'm a bit confused. Shader graph is supposed to work with SRP.
     
  11. m3rt32

    m3rt32

    Joined:
    Mar 5, 2013
    Posts:
    60
    Oh! Sorry my bad, I meant Post processing stack
     
  12. iBicha

    iBicha

    Joined:
    Jul 7, 2013
    Posts:
    30
    I see, thank you for bring this up then! I will pursue this as soon as I get some free time.
     
    m3rt32 likes this.
  13. farshidhss

    farshidhss

    Joined:
    Apr 4, 2015
    Posts:
    8
    This is really interesting! How about we prepare a separate sample project to demonstrate the usage of shader graph for image effects.
     
  14. iBicha

    iBicha

    Joined:
    Jul 7, 2013
    Posts:
    30
    This is currently in the works. I'm working on subshaders to support LWRP, HDRP, and the legacy rendering as well with the same graph. It should work well, at least for basic effects.
     
    P_Jong likes this.
  15. iBicha

    iBicha

    Joined:
    Jul 7, 2013
    Posts:
    30
    If anyone following this or interested, the trouble is every time I update the packages, everything just breaks (because of changes made to scripts or to the shader libraries etc). I knew the best route was to get Unity to somehow implement this instead of someone else. The second best approach is to build this in an independent way from the packages (shader wise, not using any of the shader libraries from SRP packages)

    Edit: I'm hacking with things here: https://github.com/iBicha/ImageEffectGraph
     
    Last edited: Nov 6, 2018
  16. farshidhss

    farshidhss

    Joined:
    Apr 4, 2015
    Posts:
    8
    Thanks! I could make the project in ImageEffectGraph work out of the box but the Sevakon threw a few shader errors and after I fixed them I got this scene:
    upload_2018-11-8_9-7-51.png
    Is that how it is supposed to look? :p
     
  17. iBicha

    iBicha

    Joined:
    Jul 7, 2013
    Posts:
    30
    That's right. On the Postprocessing volume component, you will see there are a couple of custom effects applied (in addition to the built-in ones). You can change the effects by swapping the material in the inspector (there are some materials included that you can try, found in Assets/Effects/Graphs (in the sevakon repo).
     
  18. farshidhss

    farshidhss

    Joined:
    Apr 4, 2015
    Posts:
    8
    Really excellent work! I would love to test this in my game. It brings a ton of possibilities to the effects that I can apply to camera transitions. Will showcase one here once I have it ready. Thanks for your great work.
     
  19. iBicha

    iBicha

    Joined:
    Jul 7, 2013
    Posts:
    30
    You're very welcome! Please let me know if there are some use cases where this doesn't work, or when some shaders are not possible to implement like this (an issue on github would be nice) Thanks
     
    P_Jong likes this.
  20. m3rt32

    m3rt32

    Joined:
    Mar 5, 2013
    Posts:
    60
    If you dont mind, I'm thinking about making a shader graph tutorial using your image graph implementation. I believe it will also help you to take some attention. I guess I'll do that this weekend.
     
  21. iBicha

    iBicha

    Joined:
    Jul 7, 2013
    Posts:
    30
    That's absolutely fine, a proper tutorial would be very helpful to get people started. Just make sure to point to the ImageEffectGraph repo, so people are always pointed to the latest version and benefit from future improvements and bug fixes. Thanks!
     
  22. rizu

    rizu

    Joined:
    Oct 8, 2013
    Posts:
    1,177
    Has Unity/@Tim-C responded to this in any way? Would really love to have this as official feat. I was so used to having this in UE4 that I completely forgot Unity can't do it yet.
     
    Flurgle likes this.
  23. hvent90

    hvent90

    Joined:
    Jun 18, 2018
    Posts:
    19
    Hi! Have you had any success implementing raymarching as a post-processing effect in SRP?
     
  24. adamb70

    adamb70

    Joined:
    Sep 12, 2018
    Posts:
    1
    This is really cool! Spent a little time reworking this halftone shader to get a spider-verse inspired look. normal.png
    I don't know how to stop it from stretching when using a different aspect ratio though, not sure if that's an issue with the shader or how the image effect node samples the camera view. wide.png

    Edit: Here's the code if anyone wants it.
     
    Last edited: Mar 9, 2019
    Flurgle likes this.
  25. iBicha

    iBicha

    Joined:
    Jul 7, 2013
    Posts:
    30
    That's very a cool effect. As for the aspect ratio, image effects do not deal with them by "default" (since UVs are uniform from 0 to 1) but you can access the screen width and height from the Screen node, and divide to get aspect, and adjust the effect from there.

    I have not tried, but interested to see if anyone has!
     
  26. Blatticus

    Blatticus

    Joined:
    Apr 10, 2019
    Posts:
    1
    Building upon adamb70's example scene, I had attempted to create an image effect based entirely on Z-buffer values with relation to the camera. Scene Depth node provides said Z-buffer when directly hooked to an Unlit Master, as shown here:
    zbuffer_gradient_01.PNG
    Scene Depth merely outputs a uniform color [Black-White] which Image Effect Master reads to produce a uniformly white image. Unlit Master depicts the desired effect. I understand I may be asking prematurely, but I would like to know how I may properly map these unique pixel values to the Output. Thank you for your help!
     
  27. julaakko

    julaakko

    Joined:
    Feb 23, 2019
    Posts:
    1
    Is there any way to directly access the generated depth+normals buffer or does it require separate node (like you already have for motion and depth only)?

    Update:
    After fooling around i got Depth+Normals node working in legacy mode, however for some reason neither HDRP or LWRP work, not even in shader written directly without shadergraph.
     
    Last edited: Apr 17, 2019
  28. alexanderameye

    alexanderameye

    Joined:
    Nov 27, 2013
    Posts:
    923
    LWRP does not generate a DepthNormals texture however you can customize the rendering pipeline to generate it for you.