Upload New File

Blue Pyramid Sequence/sketch.js

+//blue pyramid sequence
+function setup() {
+  createCanvas(720, 720);
+  
+  let resolution;
+  let movingPoint;
+  
+  frameRate(60);
+}
+
+function draw() {
+//constant and subtling moving center point creates an organic and unforced analog feel to this sketch and gives the impression of a 'powerful' light eminating from behind this blue pyramid  
+  let xCenter = random(359,361);
+  let yCenter = random(359,361);
+  colorMode(HSB);
+   
+//using pixeldensity to show the sketch coming into focus, also forces the program to lag creating desirable glitches  
+  resolution = 0.01 + (frameCount / 2500);
+  pixelDensity(resolution);
+  background(200, 100, 750);
+ 
+//this controls the number of radial lines around the pyramid, creates a denser and denser moire pattern until the sketches is drowned out in white light 
+  let whiteOut = 10+(sin(frameCount/250)*9);
+  
+// creates the blue pyramid by using randomly colored lines to give the illusion of a shape in the foreground.
+  // for(let xBottom=0; xBottom <= 720; xBottom+= 3+(sin(frameCount/10)*1)){  
+  //   //stroke(random(255), random(121,255), random(255));
+  //   stroke(215, random(80,100), 100);
+  //     line(xCenter, yCenter,0+xBottom,720);
+  // }
+  
+//renders the white light that eminates from behind the blue pyramid.
+  // for(let xTop=0; xTop <= 720; xTop+=whiteOut){
+  //   stroke(100); 
+  //   line(xCenter, yCenter,720-xTop,0);
+  //   line(xCenter, yCenter,0,0+xTop);
+  //   line(xCenter, yCenter,720,720-xTop);
+  // }
+  
+//after 30 seconds, new radial lines emerge that overlay a rhythm to the sketch, allows for a pulse that can be matched or unsynced to different scenes in editing  
+  if(frameCount >= 1800){
+    translate(width/2,height/2);
+//this controls the speed of the lines contractions  
+  movingPoint = (frameCount*2)%100;
+//stroke color is set to blend in and out of the radial lines in the background, giving the sense that sketch is going in and out of the field of depth, can be set to black as a shape for refrence.
+  stroke((frameCount*3)%100);
+  //stroke(0);
+  line(0-movingPoint,0+movingPoint*1,-360,360);
+     line(0-movingPoint,0+movingPoint*0.8,-360,288);
+     line(0-movingPoint,0+movingPoint*0.6,-360,216);
+     line(0-movingPoint,0+movingPoint*0.4,-360,144);
+     line(0-movingPoint,0+movingPoint*0.2,-360,72);
+  line(0-movingPoint, 0, -360,0);
+     line(0-movingPoint,0-movingPoint*0.2,-360,-72);
+     line(0-movingPoint,0-movingPoint*0.4,-360,-144);
+     line(0-movingPoint,0-movingPoint*0.6,-360,-216);
+     line(0-movingPoint,0-movingPoint*0.8,-360,-288);
+  line(0-movingPoint,0-movingPoint*1,-360,-360);
+     line(0-movingPoint*0.8,0-movingPoint,-288,-360);
+     line(0-movingPoint*0.6,0-movingPoint,-216,-360);
+     line(0-movingPoint*0.4,0-movingPoint,-144,-360);
+     line(0-movingPoint*0.2,0-movingPoint,-72,-360);
+  line(0,0-movingPoint,0,-360);
+     line(0+movingPoint*0.2,0-movingPoint,72,-360);
+     line(0+movingPoint*0.4,0-movingPoint,144,-360);
+     line(0+movingPoint*0.6,0-movingPoint,216,-360);
+     line(0+movingPoint*0.8,0-movingPoint,288,-360);
+  line(0+movingPoint,0-movingPoint,360,-360);
+     line(0+movingPoint,0-movingPoint*0.8,360,-288);
+     line(0+movingPoint,0-movingPoint*0.6,360,-216);
+     line(0+movingPoint,0-movingPoint*0.4,360,-144);
+     line(0+movingPoint,0-movingPoint*0.2,360,-72);
+  line(0+movingPoint, 0, 360,0);
+     line(0+movingPoint,0+movingPoint*0.2,360,72);
+     line(0+movingPoint,0+movingPoint*0.4,360,144);
+     line(0+movingPoint,0+movingPoint*0.6,360,216);
+     line(0+movingPoint,0+movingPoint*0.8,360,288);
+  line(0+movingPoint,0+movingPoint*1,360,360);
+    
+  }
+
+//keeps track of density of white line moire so as not to crash program.
+  console.log(whiteOut);
+  
+}
\ No newline at end of file