QC equivalent: 

"GLSL Shader" patch


Notes from Team Vuo

Vuo Pro: 

No — available with both Vuo CE and Vuo Pro


●●●○ — A few months of work


●○○ — Appeals to current community

Implemented in Vuo version: 

Plan for how you'd create a GLSL shader node:

  • File > New Node > GLSL, with the options below. This will add a new node to the Node Library. The node is populated with some initial GLSL code, based on the option chosen.
    • Image Filter — write fragment shader, input VuoImage (and optionally other uniforms), output filtered VuoImage
    • Image Generator — write fragment shader, input width/height (and optionally uniforms), output VuoImage
    • 3D Object Renderer — write fragment shader (and optionally vertex and geometry shaders), optionally input uniforms, output VuoShader
    • 3D Object Filter — write vertex shader (and optionally geometry shader), input VuoSceneObject (and optionally uniforms), output VuoSceneObject
  • Right-click on the node in the Node Library and choose a menu option, or double-click on the node on the canvas, to edit the GLSL code. This opens a GLSL code editor within Vuo.
  • Write your shader code in the code editor. The code will be in Vuo's extended version of VIDVOX's Interactive Shader Format (ISF). You'll be able to add input ports and use them as uniforms in the GLSL code.
  • If the shader code has errors, the lines of code will be marked and the details will appear in a panel below the code editor.

The node implementation will consist of text files, so as an alternative to Vuo's built-in code editor, you could use the code editor of your choice. (You just wouldn't get the inline error reporting.)

As a bonus, the ability to turn shader files into nodes and edit them in Vuo Editor is a step toward Edit node C code in the Vuo Editor have it do all the QT wrangling for the node.


This request also great for

alexmitchellmus's picture
Submitted by

This request also great for prototyping glsl code. The last thing you want to do is work out the bugs with your glsl while coding a node.

So further to this- are there plans to expose the vertex- geometry - and fragment shaders?

Also how do you guys think this node would generate dynamic inputs? Like if someone wanted to use multiple images (texture + depth map for example). In the calculate node we simply add a "variable name" would that also happen with this? Would there be special variable names to denote different inputs, such as iChannel in shadertoy? (So different ports get generated for texture - real - integer and characters)?

I just updated the "Notes

jstrecker's picture
Submitted by

I just updated the "Notes from Team Vuo" section of this feature request with some details on how this will work.

alexmitchellmus, I think that answers all of your questions except for sharing variables between shaders. GLSL allows passing varying (in/out) values from a vertex to a fragment shader. That will still be possible in Vuo's GLSL code.

Wow @Jaymie, didn't notice

alexmitchellmus's picture
Submitted by

Wow @Jaymie, didn't notice that you updated the deployment info. Great!

One question: if we edit our code in another editor, (Text Wrangler) what sort of JSON header info is needed? (standard Vuo Node or something different?)

And can we make it from scratch in another text editor- or do we need to generate from within vuo first?

For those who dont know, this

scrat's picture
Submitted by

For those who dont know, this functionality already kind of is working with Karls Vuo Nodes. https://github.com/karl-/vuo-nodes

There is a node: Make Shader with GLSL and I am already trying it out. The way you pass uniform variables is pretty neat. But its such a pain to work with the text input field. And debugging is really not fun. Because there is no debugger. Any form of feedback would be nice - not just black screen and you pretty much guess where the error is.

My workflow right now is i try something out in Shadertoy and then copy paste, change some variables (for example fragCoord to gl_FragCoords), and so on.

Is there any information how the implementation of the native solution will work? I really hope there is some solution for the text input. Maybe something like a dynamic text load from a *.glsl file would be awesome. Because as already stated, the text input field is no fun. I would like to have shortcuts for commenting and so on. So working with an external text file would allow to use any plain text editor - like sublime.

Also some debug log for the errors is necesarry to work with GLSL code.

I am really looking forward to this feature and I hope it is good. The stuff you can do with just a Fragment shader is so mindblowing. Is this already in development (yes i can read, that it isn't) but what is the vuo team developing on atm? (don't want to sound rude - just being curious)

edit: For those who dont know (including myself): You can use the Console.app as glsl debugger. In the system.log you can find the Error.

@scrat, our plan is to

jstrecker's picture
Submitted by

scrat, our plan is to provide a GLSL editor within Vuo that would appear in place of the composition canvas. Similar to how you can drill down into a subcomposition node to view/edit its internal nodes and cables, you'd be able to drill down into a GLSL node to view/edit its source code. See the details at the top of this page under "Notes from Team Vuo".

We have not been diligent about updating feature request statuses to "Implementation in progress" when we are working on things. Most of the time they magically skip from "Chosen to be implemented" to "Released" :) The team is now concurrently working on some things for the 1.2.5 release and some for the 1.3 release. This includes various feature requests, bug fixes, usability improvements, and right now some prerequisites for this feature request. We plan to include the GLSL editing feature in Vuo 1.3.

I have been thinking about

George_Toledo's picture
Submitted by

I have been thinking about this more lately...

I saw this, which is pretty cool: https://github.com/patriciogonzalezvivo/glslEditor

It seems like some of the popup GUI element stuff could be really helpful. Not sure. I could see it possibly bogging down on slow shaders.

Having a way to do keep your helper functions in separate files/pages/nodes (however it works out), and then import them in other parts of the shader...will be REALLY helpful.

I don't know how possible it would be, but having a way to store code snippets in a library, like the node library, would be amazing.

Feature status

  • Submitted to vuo.org
  • Reviewed by Team Vuo
  • Community voted
  • Scheduled for implementation
  • Released in Vuo 2.0.0-beta1

When we (Team Vuo) plan each release, we try to implement as many of the community's top-voted feature requests as we have time for.

Read more about how Vuo feature requests work.

Who voted?

iaian7's picture
cat's picture
volkerku's picture
noiseismyart's picture
jvolker's picture
George_Toledo's picture
phasma's picture
MartinusMagneson's picture
root's picture
Jesse Edmond's picture