A proliferation

https://preview.p5js.org/s3491305/present/nAbLcGH2j

let x = 300;
let y = 300;
let extraCanvas;


function setup() {
  createCanvas(600, 600);
  extraCanvas = createGraphics(600, 600);
  extraCanvas.clear();
  background(255, 0, 0); 
  frameRate(20);
}


function draw() {
  
  
  background(255, 0, 0);
  x += random(-20, 20);
  y += random(-20, 20);
  
  
  
  // the dots that pop up random location
  extraCanvas.fill(80, 120, 255);
  extraCanvas.stroke(45, 220, 160);
  let dotX = random(width);
  let dotY = random(height);
  extraCanvas.ellipse(dotX, dotY, 50, 50);
  
  // trailing mouse ellipse
  extraCanvas.fill(255, 100, 100, 100);
  extraCanvas.stroke(100, 100, 255);
  extraCanvas.ellipse(mouseX, mouseY, 100, 60);
  
  image(extraCanvas, 0, 0);
  
  // the "vibrating" big spot (is in front of the extraCanvas)
  fill(230, 80, 100);
  stroke(160, 170, 200);
  strokeWeight(4);
  circle(x, y, 100, 100);
  
  // contrast to the "vibrating" big spot being in same layer as the other circles that build up and don't disappear 
  // extraCanvas.fill(230, 80, 100);
  // extraCanvas.stroke(160, 170, 200);
  // extraCanvas.strokeWeight(4);
  // extraCanvas.circle(x, y, 100, 100);
  
  
 
  
  
  
}

fast frame rate

https://preview.p5js.org/s3491305/present/WBNpk7v8K

{!!!!!! warning. fast flashing colours. maybe not good for photosenstivie epilepsy!!!!!!}

necessary ‘spo

Learning coding

Learning javascript via the javascript library p5.js for creative coding; an interactive visual medium.

P5.js is created by the processing foundation. It is open source and available to use with the online web editor.

Using The Coding Train p5.js tutorials on youtube.

https://preview.p5js.org/s3491305/present/APn2v74SL

let spot = {
  x: 100,
  y: 50
}

let col = {
  r: 255,
  g: 0,
  b: 0
}


function setup() {
  createCanvas(600, 400);
  background(0);
}

function draw() {
  spot.x = random(0, width);
  spot.y = random(0, height);
  fill(col.r, col.g, col.b);
  noStroke();
  ellipse(spot.x, spot.y, 24, 24);
}

p5.js is fun!

https://preview.p5js.org/s3491305/present/wz_vK49qI

let col = {
  r: 0,
  g: 0,
  b: 0
}


function setup() {
  createCanvas(600, 600);
  background(200, 50, 50);
  //change fps or "speed"
  frameRate();
}


function draw() {


  //smear paint tool 
  col.r = random(100, 255);
  col.g = random(100, 255);
  col.b = 0
  fill(col.r, col.g, col.b);
  noStroke();
  ellipse(mouseX, mouseY, 80, 50, );

  fill(255, 0, 0);
  noStroke();
  ellipse(mouseX, mouseY, 10, 10);
}

https://preview.p5js.org/s3491305/present/-hrtcWV56

function setup() {
  createCanvas(600, 600);
  background(200, 50, 50);

  fill(0, 100, 50);
  stroke(0, 50, 250);
  strokeWeight(10);
  ellipse(400, 500, 100);
}


function draw() {


  //smear paint tool
  //   fill(0, 150, 150);
  //   noStroke();
  //   ellipse(mouseX, mouseY, 17, 50, );

  //   fill(255, 0, 0);
  //   noStroke();
  //   ellipse(mouseX, mouseY, 10, 10);

  // fill(255, 255, 255, 50);
  // noStroke();
  // rect(mouseX, mouseY, 50, 50, 10, 10);

  fill(0, 100, 50);
  ellipse(260, 100, 30);
  ellipse(500, 175, 30);
  ellipse(80, 290, 30);
  ellipse(550, 550, 30);
  ellipse(70, 560, 30);
  ellipse(200, 400, 30);

}


function mousePressed() {

  //becomes a stamp tool
  fill(0, 150, 150);
  noStroke();
  ellipse(mouseX, mouseY, 17, 50, );

  fill(255, 0, 0);
  noStroke();
  ellipse(mouseX, mouseY, 10, 10);

}

Gif

a gif in red smart light

Change Hair Colour Filter

Another Spark AR Instagram filter. Created with reference to this tutorial: https://youtu.be/5P1vScGMsUY

Face deformation & stickers AR filter

• 

• 

Another go text in Illustrator [what i’m feelin’]

Learning to use Blender