Shadertoy – conversion of a GLSL example.

Today I will show you how to convert a GLSL source code to Shadertoy source code.
This tutorial will help you better understand the elements involved in shaders and the display interface.
Let’s see what the source code written in GLSL looks like:

To convert it into source code for Shadertoy online tool, we need to see what is already defined in this tool and what corresponds to the GLSL source code.
Here are some elements:
gl_FragCoord.xy and fragCoord.xy
resolution.yy and iResolution.yy (iResolution.xy )
time and iTime
The Shadertoy does not need special definitions and it is already implemented.
Let’s see the final code to see where there are changes and where not:

Let’s see the result of this source code on shadertoy:

Shadertoy – examples and circle .

In this tutorial I will deal with some examples.
The goal of this tutorial is to understand how shadertoy works and what are the requirements to be able to work properly with this tool.
You need an account then start with the New button to create a new shadertoy workspace.
The Shaderstoy (shaders theory) work on the principle of levels of light, darkness, and color within an input and output result.
The Shadertoy tool has input elements that you can use in source code and predefined input items.
The source code input elements can be found at Shader Inputs, see:

Other input elements are: keyboard, image, video, sound, buffers, etc.
This can be used into source code with iChannel (uniforms into shader theory).
Those who have taught at the university about: field theory or special mathematics will have greater chances to succeed in understanding these shaders theory.
The theory of shaders is applicable very well in complex scientific representations.
Look at my example and try to understand what vectors, functions and Shader Inputs I used.
Read the comments made in the source code and Shader Inputs.

This is the result of this source code:

Shadertoy – notepad paper .

The Shadertoy website is a great tool to test your skill in writing shaders.
This is my first try with this tool.
See the source code I write to make a notepad paper example:

Use fullscreen option to to see correctly the result of this shader.