ISF for Motion

Converting and Rendering Shaders As Movies

How to use the ISF Editor to automatically translate shaders from other formats and export as a movie file in Motion

Install the ISF Editor 0:00

If you haven't already done so, start by downloading and installing the free ISF Editor. This installer also includes the standard set of ISF shaders.

Import a shader 0:38

From the “File” menu, choose the “Import from GLSLSandbox” or “Import from Shadertoy” option and enter the URL to the shader to convert. In this example we will use The ISF Editor will automatically download and attempt to translate the code to the ISF specification, but you may need to make additional modifications for some shaders. Note: Though not needed for this example, in some cases you may need to change the rendering mode to OpenGL 4 mode the ISF Editor in the preferences for imported shaders to compile and render properly.

Optionally add published parameters 1:00

Once imported we can further customize the shader to take advantage of ISF functionality. The “Inputs“ section of the ISF Editor interface can be used to add, remove and modify the published parameters for the shader.

Locate the shader file 5:10

The ISF Editor downloads shaders to the “~/Library/Graphics/ISF” folder on your Mac. In most cases this allows it be accessed by all applications that support ISF, including ISF for Motion, on your computer. If needed you can locate these shaders in the Finder to move, share, rename or delete them.

Use ISF for Motion to render the shader as a movie 5:35

Another common thing we may want to do with an ISF shader is export it as a flattened movie file that can be played on media servers or uploaded to the web using the ISF for Motion add-on. In this demonstration we first create a new project, then add the shader, animate a published parameter using keyframes, and finally export as a movie file. For more information see the tutorials on Using ISF in Motion and Using ISF in FCP X.

Manually converting shaders to the ISF specification

For more information on manually converting code from other specifications see the Adapting Existing GLSL Code to the ISF Specification and Tips for Converting Non-ISF GLSL shaders to ISF sections of the ISF documentation.

Other Tutorials