Big collection of free Shader Graph nodes

Hey Unity people.

I've been working on some shader graph node libraries in the past week or so. I'd be very happy to get some feedback on these and would love to hear if you've used any of them for any of your projects.

https://github.com/gilescoope/shader-graph-nodes

Complex



Do complex arithmetic in shader graph.

Composite



Complete set of Porter Duff transparency operations.

Halftone



Halftone rendering, monochrome or color.

Lab Color



Manipulate colors in the perception-based color spaces.

Pattern



Procedural geometric patterns.

Pixel Perfect



Pixel-wide primitives, no matter what the surface.

Quaternion



Quaternion algebra for rotation calculations in the graph.

SDF



Signed distance functions for amazing procedural effects.

Truchet



Truchet tiling nodes to make beautiful irregular patterns.

 

Thanks so much for these! Been playing around with them for a couple of days now, and particularly the SDF and truchet nodes offer a ton of possibilities.

So far this pretty garden-variety alpha-blended SDF-based cartoon water is the best example I've got, but will post more graphs when I come up with something more exciting

Edit: Wow, embedding images by link or upload is tremendously broken

 

That looks great, looking forward to seeing more stuff, let me know if there was something that wasn't clear or any functionality you felt should have been there but wasn't.

 

Any chance for a Blur or Distort node?

 

Shader calculations are done per pixel without accessing other pixel information (aside from DDX, DDY, fwidth) so a blur node doesn't make too much sense.

Distortions are possible, what distortions would be interesting?

 

The best example I can give is the noise texture node from Blender but for Unity I'm not sure how the distortion would work for different types of input as a separate node. Here it's embedded in the Noise node

No distortion


With Distortion

 

Thanks for this!

 

How would I go about installing these?

 

Hey there, from the GitHub page here

https://github.com/gilescoope/shader-graph-nodes

you can just click "Clone or Download" then "Download .zip"
If you extract your zip somewhere into your Project > Assets folder you should be able to use all the nodes from Shader Graph as you would use any other nodes.

 

Thanks for getting back to me! That doesn't work, however (it was the first thing I did). Nodes simply don't appear in the graph editor.
Could this be a version thing? I'm running 2018.2.14f1

 

I'm not sure, do you get compilation errors? Do you have the correct packages installed?

I just tried with 2018.3.0f2.
- start a new project with the Lightweight RP (Preview) template
- copy the "Nodes" folder from the repository into the project assets folder
- create a shader graph

Now when I right click and select "Create Node" I can see all the nodes.

 

I think there was something vestigal in my current project that was stopping the nodes from compiling properly or just working at all. All newly created projects (LWRP and HDRP) seem to pick them up just fine. Thanks for your help, I really appreciate it

 

That's good to hear. I hope you can get the nodes in your project. If you get to the bottom of why it wasn't working I'd be interested to hear.

 

Unity broke nodes by making function node class internal, my project depends on those, what should i do?

 

Ouch, thanks for letting me know about this. I'll take a look as soon as I have some time. Which version of Unity is this?

 

19a14
sg 5.2.3

 

Thanks, I managed to reproduce this. I guess it's someone in the Unity team setting the class to internal without thinking. It wouldn't be the first time I've seen this.

I saw that you posted this already in the megathread so will wait to see what the response is there. I believe there's very little I can do. In the meantime I'd suggest working in the last version of shadergraph that doesn't have this restriction.

 

From what I've heard, they did this intentionally. It is because they are working on redoing the API, so any custom nodes will need to be updated to work with the new API. I guess they made it private so less people will try to use it in the interim, and thus less people will need to redo their custom nodes..? My understanding is the new API is supposed to be available by the time 2019.1 is released.

 

If you want custom nodes basically need to stick sg 4.6 (and therefore unity 18.3) until they release their new api.

 

there is now a new way to make custom nodes in unity 2019. there is a "custom node" node in which you can copy paste the hlsl code. its pretty easy to use. you will also have to update the lwrp or hdrp to a newer version when creating a new project.

 

Thanks for this info! I didn't know about this feature yet. I just installed 5.16 preview into a test project and found that the custom node feature is present. I'll need time to get my code into some of these (breaking my custom shader's unusual features into function nodes), but at least this gives me a maintainable way to merge my custom functionality into the broader SRP context.

I'm glad this is now in the Package Manager and doesn't require me to install directly from the GitHub version. I would do that if necessary, but it's nice not to have to.

 

I know it might seem simple (or additional) to do, but do you have any plans on redoing these cs classes into HLSL/customFunction nodes (or as they suggest for sharing purposes 'just wrap them into a subgraph node' approach) as its what the new api requires? I would love to compare them back and forth with what you wrote before, to learn more about the new structure and HLSL in general (im just beginning to learn shader language)

 

No plans at the moment. It's very disappointing not to be able to create custom nodes like this any more to be honest. The subgraph approach is super clunky, and the custom code node is bad for sharing/readability etc.

 

I agree and many people in unity's post relating to the update expressed the same feeling. What came to me as to 'why was it done/changed' was that there were additional reasons, where the old approach was unable to perform in certain use-cases, where the new one would, but those were not specified in the thread, so i can't comment on it. But as you've said, shareability, github repo's copy pasta and get instant feedback in shadergraph. FeelsBadMan. Anyways thanks for replying!

PS u can attach HLSL shader files into the custom node, dont have to paste function body code manually anymore (this was not possible initially), so at least there is some type of codesharing possible now.

 

I wanted to follow up and again thank you for letting me know this was available. I was able to use it to solve my requirement. I got my custom node working. Eventually I migrated to a full custom source file, but the Shader Graph version was valuable for prototyping the separate elements of my shader before I integrated them into one source module.

 

Damn I just found this library and it looks super usefull! Still no plans to port them to URP?

 

Took me 5min to convert seemless voronoi to URP SG. Shouldnt be so hard!

 

I'm pretty new to shaders in general, mind giving some direction of how to do that? thanks!

 

Allright, i will give you some TLDR on what i did, but note that this was a year ago and i dont remember details.

-------------------------------------------------------
EDIT: I originally wanted to link here the actual converted shader, so you can see the original code, and compare it to the new CustomFunction implementation so you know exactly what to copy where (once you get the hang of it, its the same for every old shader) - BUT - i didnt use the SeamlessVoronoi on mobile due to even Voronoi (on which it is based) being too expensive (CPU vise), and for the love of God i cant find the shader anymore in any of my old test projects! I searched for an hour! Aaargh! If worst comes to worse, ill recreate it, just for you, again, but lets hope my following instructions will be enough for you to do it on your own (and learn something in the process).
-------------------------------------------------------

I just realized that SeamlessVoronoi is not from this thread, it was a different github page, but the exact same problem - shaders created in old shader graph with the old API. Actually the SeamlessVoronoi that i used for conversion was from here.

So to have an exact idea of what needs to be converted and how, you need to understand the old API and then the new API, and then you will have a pretty good idea on how to convert and what to put where. I don't remember the exact details, but then the conversion was really just copy pasting the old code into the new API, and it all worked (that's the 5mins i mentioned).

To understand both old and new API might take you longer. I was also a complete beginner, so no worries there. Let me give you some hints as i dag up the APIs for you:
the old API - CodeFunctionNode
the new API - CustomFunctionNode

So first understand the above, how it works and how those differ. Its not that much to learn, honestly. To put it simply, the old API used a class to paste the shader code into, the new API uses a custom Node directly within the Shader Graph. In the new API you can paste your shader code, or use a HLSL file reference (which i use).

Next i will use as an example my converted SeamlessVoronoi shader, so you can compare what i copied from where and then where i pasted it to:
the old API SeamlessVoronoi
the new API SeamlessVoronoi (my conversion)
EDIT: cant find it (FeelsBadMan)

So for now just study the APIs and maybe check out some examples, it should be easy to understand what to copy paste. If you're struggling badly, let me know and ill re-convert SeamlessVoronoi again when i get the time (i cant seem to be using it though, its too expensive for my purposes. Actually any Noises are too expensive on mobile. Blast it!)

 

D

Damn dude, you're awesome for telling me all this. Seems pretty straight forward, I'll give it shot and will let you know how it went. Thank you very very much!

 

Hey, i felt a bit sad as it ultimately looked like a lot of text for nothing (just the two links), as i originally wanted to post both shader code comparisons.. alas lost the new one. Glad you liked it and good luck with the conversion!

 

Hey guys, there actually IS a way to access custom nodes API again, in Unity 2019.4 or higher.
I just had to create AsmRef with definition to Unity.ShaderGraph.Editor, and then change nodes to be internal.

I've made a fork with the updated version:
https://github.com/neon-age/shader-graph-nodes

The API hasn't changed a bit since Unity 2018.2 and works in newer versions up to 2021.2.

 

Much appreciation for converting these over. I'm just now learning ShaderGraph and its super helpful to have some examples like this. That being said, I'm having trouble using them in 2020.3 URP pipeline.

I put in a Custom Function shader and under Node Settings I select one of these as the Source but instantly get a little red warning symbol on the node, hovering over it reads:

Validation: Source file is not a valid file type. Valid file extensions are .hlsl and .cginc

Am I doing it wrong?

 

Just found this. Thanks, @Giles-Coope and also @Neonage for updating. The Truchen example PSD files' import meta doesn't set them to be Texture 2D Array types, that can be applied manually and things start working. I don't know how to make a 2-tile Texture2DArray for the square example from the two separate PSD files. The square mode seems to have an edge sampling problem if just given one plain PSD tile as an array, regardless of wrap/clamp/sampling options. Also, the editor script in Truchen needs to be pushed into an Editor folder, but it doesn't seem to be necessary to use it.