​

​

let rad;

let res;

let angle;

let delta;

​

let blobs;

let bgColors;

​

let currentPalette = 0;

function setup() {

  createCanvas(500, 500);

  rad = 100;

  res = 10;

  angle = 360 / res;

  delta = 50;

  angleMode(DEGREES);

  frameRate(1);

  blobs = [{

  x: 334,

  y: 170,

  minRad: 130,

  maxRad: 180,

  colors: [

    color(134, 112, 112),

    color(167, 114, 125),

    color(206, 222, 189),

    color(223, 166, 123),

    color(242, 190, 209)

  ]

},{

  x: 277,

  y: 400,

  minRad: 50,

  maxRad: 80,

  colors: [

  color(213, 180, 180),

  color(237, 219, 199),

  color(158, 179, 132),

  color(244, 177, 131),

  color(253, 206, 223)

  ]

}, {

  x: 77,

  y: 350,

  minRad: 30,

  maxRad: 70,

  colors: [

    color(228, 208, 208),

    color(248, 234, 216),

    color(67, 83, 52),

    color(255, 217, 102),

    color(248, 232, 238)

  ]

}]

  bgColors = [

    color(245, 235, 235),

    color(249, 245, 231),

    color(250, 241, 228),

    color(255, 242, 204),

    color(249, 245, 246)

  ]

}

​

function draw() {

  background(bgColors[currentPalette]);

  //code to identify points

  // for (let p = 0; p < points.length; p++){

  //   strokeWeight(5);

  //   point(points[p][0], points[p][1]);

  //   // console.log(points[p][0], points[p][1]);

  //   text("(" + points[p][0] + ", " + points[p][1] + ")", points[p][0], points[p][1]);

  // }

  //iterate through the list of blobs

    for (let k = 0; k < blobs.length; k++) { 

      let blobPoints = []

      push();

      noStroke();

      fill(blobs[k].colors[currentPalette])

      beginShape();

      translate(blobs[k].x, blobs[k].y); 

      for(let i = 0; i < res; i++) {

        //make sure circle isn'getting too big or too small

        rad += random(-20,20);

        rad = constrain(rad, blobs[k].minRad, blobs[k].maxRad); 

        let x = rad * cos(angle * i);

        let y = rad * sin(angle * i);

        blobPoints.push([x, y])

        curveVertex(x,y);

     }

      for (let j = 0; j < 3; j++) {

        curveVertex(blobPoints[j][0], blobPoints[j][1])

      }

      endShape();

      pop();

  }

  noFill();

  // face

  strokeWeight(1)

  beginShape();

  curveVertex(219, 76);

  curveVertex(125, 132);

  curveVertex(126, 199);

  curveVertex(144, 268);

  curveVertex(222, 315);

  curveVertex(293, 255);

  curveVertex(319, 185);

  endShape();

  //neck (left)

  beginShape();

  curveVertex(252, 301);

  curveVertex(267, 285);

  curveVertex(270, 327);

  curveVertex(337, 345);

  curveVertex(400, 358);

  curveVertex(439, 404);

  endShape();

  //neck (right)

  beginShape();

  curveVertex(199, 311);

  curveVertex(189, 304);

  curveVertex(187, 332);

  curveVertex(164, 358);

  curveVertex(119, 368);

  curveVertex(85, 386);

  curveVertex(74, 409);

  endShape();

  //bangs (right)

  strokeWeight(1);

  beginShape();

  curveVertex(301, 264);

  curveVertex(310, 268);

  curveVertex(295, 254);

  curveVertex(277, 222);

  curveVertex(273, 171);

  curveVertex(227, 131);

  curveVertex(187, 76);

  curveVertex(163, 101);

  endShape();

  // bangs (left)

  strokeWeight(1)

  beginShape();

  curveVertex(188, 72);

  curveVertex(180, 83);

  curveVertex(167, 96);

  curveVertex(161, 102);

  curveVertex(186, 67);

  curveVertex(160, 102);

  curveVertex(142, 117);

  curveVertex(123, 132);

  curveVertex(110, 186);

  curveVertex(116, 217);

  endShape();

  //earring 

  strokeWeight(1)

  beginShape();

  curveVertex(289, 284);

  curveVertex(292, 284);

  curveVertex(301, 276);

  curveVertex(301, 294);

  curveVertex(295, 310);

  curveVertex(275, 298);

  curveVertex(276, 284);

  curveVertex(292, 284);

  curveVertex(289, 284);

  endShape();

  line(292, 252, 292, 283);

  // line art for hair (left)

  strokeWeight(1)

  beginShape();

  curveVertex(119, 369);

  curveVertex(106, 371);

  curveVertex(101, 290);

  curveVertex(102, 200);

  curveVertex(91, 142);

  curveVertex(126, 63);

  curveVertex(180, 35);

  curveVertex(147, 49);

  curveVertex(183, 45);

  endShape();

  //line art for hair (right)

  strokeWeight(1)

  beginShape();

  curveVertex(181, 35);

  curveVertex(181, 35);

  curveVertex(221, 27);

  curveVertex(284, 64);

  curveVertex(331, 111);

  curveVertex(355, 182);

  curveVertex(355, 208);

  curveVertex(353, 266);

  curveVertex(369, 309);

  curveVertex(351, 343);

  endShape();

  //shirt

  strokeWeight(1)

  beginShape();

  curveVertex(150, 363);

  curveVertex(114, 372);

  curveVertex(218, 407);

  curveVertex(289, 408);

  curveVertex(316, 395);

  curveVertex(343, 363);

  curveVertex(350, 349);

  curveVertex(351, 348);

  endShape();

  //glasses

  strokeWeight(1)

  rect(206, 154, 70, 60, 20);

  rect(124, 154, 60, 60, 20);

  line(184, 186, 205, 186);

  //mole

  strokeWeight(3);

  point(164, 376);

}

​

function mousePressed(){

  // console.log(mouseX, mouseY)

  // points.push([mouseX, mouseY]);

  currentPalette = (currentPalette + 1) % 5

}