The original idea I had for my shader was to code a pattern of shapes with the p5.js editor on the sketch.js file and then have the shader be projected on the shapes that had been coded on the sketch file. But, after many experiments and hours trying to clip the shader frag and vert files onto the javascript file I realized the way I coded the file would never work for what I wanted. Thus I decided to use the Animation file given to us from the mid-term templates to create a more simplistic shader that works with the ellipses and rectangles already.

As I originally wanted the shader to clip onto the sine and cosine lines I created, I later realized that I couldn’t have an animated curve and my shader as when I activated the shader in the code the animation would freeze. My original code is inspired by sound waves. More specifically the visual aspect of sound curves.

The final version of my shader is pretty bland as it was only made when I decided I had spent too much time on my original code which wouldn’t work with my planned shaders. In the end, my final shader uses basic shapes and some mix() functions to create the gradients within the shapes.

Original Shader 

Final Assignment Shader