genuary12 - we see what we see

let n = 4;//play with this
let nS = 15;//play with this
let sA = [];
let t=0
function setup(){
  cnv = createCanvas(500,500)
  for(let i = 0;i<nS;i++){
    sA.push(new Tess(floor(random(0,4.99))))
  }
  noFill();
  noStroke()
}
function draw(){
  background(200)
translate(width/2,height/2)
  t=frameCount/100
  rotate(-t/10)
  for(let i=0;i<nS;i++){
    for(let j = -n-5;j<n+5;j++){
      for(let k=-n-5;k<n+5;k++){
        push()
          d = width/n
          translate(d*j,d*k)
          sA[i].display()
        pop()
      }
    }
  }
  
}

class Tess{
  constructor(m){
    this.x = width/n*random(0.5,3)
    this.y = width/n*random(0.5,3)
    this.r = random(0,360);
    this.p = random(1,20)
    this.type = m
    this.tStep = random(-1,1)
  }
  display(){

    if (this.type ===0){
      push()
      fill(20,20,20,100)
      
      translate(this.x,this.y)
      rotate(this.r+this.tStep*t)
      rect(0,0,this.p*20/n,this.p*20/n)
      pop()
    }
    if (this.type ===1){
      push()
      fill(20,20,20,100)
      translate(this.x,this.y)
      rotate(this.r+this.tStep*t)
      circle(0,0,this.p*3)
      pop()
    }
     if (this.type ===2){
      push()
      fill(20,20,20,100)
      translate(this.x,this.y)
      rotate(this.r+this.tStep*t)
      triangle(0,0,0,this.p*3,this.p*2,this.p*3)
      pop()
    }
    if (this.type ===3){
      push()
      fill(200,200,200,100)
      translate(this.x,this.y)
      rotate(this.r+this.tStep*t)
      arc(0,0,this.p*2,this.p*4,this.r,this.y)
      pop()
    }
     if (this.type ===4){
      push()
      fill(200,200,200,100)
       noStroke()
      translate(this.x,this.y)
      rotate(this.r+t*this.tStep)
      rect(0,0,this.p*5,this.p*5,this.r/4,this.r/4,4,4)
      pop()
    }
  }
}

function mousePressed(){
  sA = []
  setup()
  draw()
}

function keyPressed(){
  if(n<15){
    n+=1
  }else{
    n=1
  }
}