I spent some time playing around with the border function. I ended up with this gradient that slowly moves towards the bottom left of the screen. The colors mix in weird way with this one so I decided to leave it as is.

```// Author:Mark Herod
// Title: Shape/Pattern

#ifdef GL_ES
precision mediump float;
#endif

uniform vec2 u_resolution;
uniform vec2 u_mouse;
uniform float u_time;

float drawRect (vec2 st, vec2 size){
float result = 1.0;

vec2 border = (1.0-size)/2.;

result = step(border.x, st.x);
result *= step(border.x, 1.0-st.x);
result *= step(border.y, st.y);
result *= step(border.y, 1.0-st.y);

return result;
}

float drawCircle(vec2 st, float size){
float result = distance(st, vec2(0.5));
result = 1.072-step(size,result);

return result;
}

void main() {
vec2 st = gl_FragCoord.xy/u_resolution.xy;
st.x *= u_resolution.x/u_resolution.y;

vec3 color = vec3(0.);

float border = 0.178 + (cos(st.x * 98.008 + u_time * 2.112) *0.732 *0.5);

//applies border and movement to each shape.
// also give shader the squarish shape
border /= + (cos(st.y * 99. + u_time * 1.792) *2.444 *1.284);

vec2 size = vec2 (0.5,0.5);

//draws squares
color.g = drawRect( st, size );
color.g = (asin(drawRect( st, size - vec2(border))));

//draws circle.
color.r = drawCircle(st, border);
color.b += drawCircle(st,border/st.y);

gl_FragColor = vec4(color,1.0);
}
```

This was just an experimentation of shapes and seeing how things worked together. I used the square as more of a light source to shine in from the right.

```// Author: Mark Herod

#ifdef GL_ES
precision mediump float;
#endif

uniform vec2 u_resolution;
uniform vec2 u_mouse;
uniform float u_time;

float drawCircle(vec2 st, vec2 pos, float size){

float result = distance(st,pos);
result = 1.0-step(size,result);
return result;
}

float drawRect (vec2 st, vec2 size){
float result = 1.0;

vec2 border = (1.0-size)/2.;

result =(border.x, st.x);

return result;
}

void main() {
vec2 st = gl_FragCoord.xy/u_resolution.xy;
st.x *= u_resolution.x/u_resolution.y;

vec3 color = vec3(0.042,0.575,0.396);
//color = vec3(st.x,st.y,abs(sin(u_time)));

float c1 = drawCircle(st, vec2(0.320,0.470),0.4);
float c2 = drawCircle(st, vec2(0.360,0.270),0.560);
float c3 = drawCircle(st, vec2(0.320,0.470),4.);

float r1 = drawRect( st, vec2(2.0, 0.2) );

color = mix(color, vec3(0.0,1.1,3.0),c1*0.5 );
color = mix(color, vec3(2.499,3.000,0.306),c2*0.5 );
color = mix(color, vec3(0.209,0.405,0.036),c3*0.5 );
color = mix(color, vec3(3.000,1.086,2.930),r1/1.8);

gl_FragColor = vec4(color,1.0);
}
```