Creating random shapes within the limits

p5.js Coding Questions
2

Hello, @callenk, and welcome to the Processing Foundation Forum!

With randomization, would you like to vary the positions of the facial features, the forms of the facial features, or a combination of both?

EDIT (February 25, 2022):

Since each type of facial feature has its own nuances, it might be best to write a separate function for drawing each one. This would enable you to use different strategies for introducing randomness, based on those nuances. Below is an example of a function for drawing the mouth. It obviously needs refinement.

function drawMouth(color) {
  let mouth = [
    {
      _x: 387.6577683742578,
      _y: 369.0331888192228,
    },
    {
      _x: 407.00089302625776,
      _y: 365.85590373064906,
    },
    {
      _x: 434.7384985549439,
      _y: 366.171463258642,
    },
    {
      _x: 449.27931827961254,
      _y: 369.2639073617315,
    },
    {
      _x: 464.0487483311093,
      _y: 368.01369229132035,
    },
    {
      _x: 495.8288616632999,
      _y: 374.3113342729382,
    },
    {
      _x: 521.1731921017742,
      _y: 381.34289533674905,
    },
    {
      _x: 490.3371981073987,
      _y: 398.9959073598651,
    },
    {
      _x: 466.94158625804715,
      _y: 405.7705438797759,
    },
    {
      _x: 443.9603429832458,
      _y: 406.68249762387074,
    },
    {
      _x: 424.86575622764354,
      _y: 402.63111022606483,
    },
    {
      _x: 405.62077095350855,
      _y: 392.2080545568318,
    },
    {
      _x: 390.69194115753766,
      _y: 370.0178396726528,
    },
    {
      _x: 428.2131300495174,
      _y: 373.0973695790913,
    },
    {
      _x: 448.9742443594697,
      _y: 375.4678421199305,
    },
    {
      _x: 469.8304490771126,
      _y: 377.6905037503284,
    },
    {
      _x: 516.0693200903028,
      _y: 380.80110325034724,
    },
    {
      _x: 467.582837756528,
      _y: 393.76089985426137,
    },
    {
      _x: 446.66764118933406,
      _y: 394.052458612104,
    },
    {
      _x: 427.4513557777959,
      _y: 391.0020196328584,
    },
  ];
  fill(color);
  beginShape();
  for (var d of mouth) {
    // randomize vertices
    vertex(d._x + randomGaussian() * 10, d._y + randomGaussian() * 4);
  }
  endShape(CLOSE);
} // end function drawMouth

lips

Note, here, that a different degree of variability is being used for the x and y coordinates of the vertices:

    vertex(d._x + randomGaussian() * 10, d._y + randomGaussian() * 4);

You could also use different functions to implement the randomness for the different features. See the following:

2 Likes