A Flower, Examined

// composition: a flower taken apart along a gentle diagonal — the bloom, three loosened petals, a
// stamen, a stem cross-section — a short graphite rule beneath each specimen; the top third stays
// empty board. layering: rose washes two passes each, olive details, graphite rules and veins last.
const PALETTE = [
  "#efe9dc", // ground: pale board
  "#c98d8d", // faded rose
  "#a96868", // deep rose (rationed)
  "#7a7d54", // olive
  "#55524b", // graphite
];

const GRAPHITE = "#55524b";

function petalSpec(cx, cy, rot, len, wide, deep) {
  push();
  translate(cx, cy);
  rotate(rot);
  brush.noStroke();
  brush.fillBleed(0.42, "out");
  brush.fillTexture(0.5, 0.55);
  brush.fill("#c98d8d", 135);
  brush.beginShape(0.7);
  brush.vertex(0, 0);
  brush.vertex(len * 0.3, -wide * (0.52 + random(-0.06, 0.06)));
  brush.vertex(len * 0.85, -wide * 0.4);
  brush.vertex(len * (1 + random(-0.04, 0.06)), random(-3, 3));
  brush.vertex(len * 0.8, wide * (0.42 + random(-0.06, 0.06)));
  brush.vertex(len * 0.32, wide * 0.5);
  brush.endShape(true);
  if (deep) {
    brush.fill("#a96868", 110);
    brush.beginShape(0.7);
    brush.vertex(len * 0.12, 0);
    brush.vertex(len * 0.4, -wide * 0.3);
    brush.vertex(len * 0.82, -wide * 0.18);
    brush.vertex(len * 0.9, wide * 0.05);
    brush.vertex(len * 0.45, wide * 0.3);
    brush.endShape(true);
  }
  brush.set("2H", "#6f675c", 0.85);
  brush.line(len * 0.1, 0, len * 0.88, random(-4, 4));
  pop();
}

function rule(cx, y, half) {
  brush.set("2H", "#5f5a52", 1.2);
  brush.line(cx - half, y, cx + half + random(-4, 6), y + random(-2.5, 2.5));
}

function setup() {
  createCanvas(800, 800, WEBGL);
  angleMode(DEGREES);
  brush.scaleBrushes(2.4);
  noLoop();
}

function draw() {
  translate(-width / 2, -height / 2);
  background("#efe9dc");

  // a faint warm board tint so the specimens sit on a surface, not bare paper
  brush.noStroke();
  brush.fillBleed(0.4, "out");
  brush.fillTexture(0.5, 0.4);
  brush.fill("#e6dcc5", 60);
  brush.rect(-20, -20, 840, 840);
  brush.fill("#e0d4b9", 35);
  brush.rect(30, 120, 740, 640);

  // 1. the bloom, still whole
  const bx = 178;
  const by = 262;
  for (let k = 0; k < 5; k++) {
    const rot = -90 + k * 72 + random(-9, 9);
    petalSpec(bx, by, rot, random(56, 70), random(34, 44), k % 2 === 0);
  }
  brush.noStroke();
  brush.fillBleed(0.5, "out");
  brush.fillTexture(0.6, 0.6);
  brush.fill("#a96868", 165);
  brush.circle(bx, by, 13, true);
  brush.fill("#7a7d54", 160);
  for (let k = 0; k < 6; k++) {
    const a = k * 60 + random(-10, 10);
    brush.circle(bx + cos(a) * 17, by + sin(a) * 17, 2.6, true);
  }
  rule(bx, by + 110, 44);

  // 2. three petals, loosened
  petalSpec(306, 328, 14, 74, 44, true);
  rule(342, 398, 30);
  petalSpec(402, 362, -21, 62, 38, false);
  rule(432, 424, 26);
  petalSpec(494, 398, 38, 82, 46, true);
  rule(534, 472, 34);

  // 3. the stamen
  brush.set("2B", "#7a7d54", 1.3);
  brush.beginShape(0.5);
  brush.vertex(596, 486);
  brush.vertex(602, 440);
  brush.vertex(612, 402);
  brush.endShape(false);
  brush.set("2B", "#7a7d54", 0.9);
  brush.line(600, 486, 618, 412);
  brush.noStroke();
  brush.fillBleed(0.4, "out");
  brush.fill("#a96868", 180);
  brush.circle(613, 396, 4, true);
  brush.circle(620, 405, 3.4, true);
  brush.circle(606, 392, 2.8, true);
  rule(606, 514, 28);

  // 4. the stem, sectioned
  const sx = 682;
  const sy = 520;
  brush.fillBleed(0.45, "out");
  brush.fillTexture(0.5, 0.55);
  brush.fill("#7a7d54", 125);
  brush.circle(sx, sy, 25, true);
  brush.fill("#8f9165", 100);
  brush.circle(sx + 2, sy - 2, 17, true);
  brush.noFill();
  brush.set("pen", GRAPHITE, 1.0);
  brush.circle(sx, sy, 26, true);
  brush.set("2H", "#6f675c", 0.85);
  brush.circle(sx + 1, sy, 15, true);
  brush.noStroke();
  brush.fill(GRAPHITE, 145);
  for (let k = 0; k < 7; k++) {
    const a = k * 51 + random(-8, 8);
    brush.circle(sx + cos(a) * 10, sy + sin(a) * 10, 1.6, true);
  }
  rule(sx, sy + 62, 26);

  // a faint trace of the diagonal the parts were laid along
  brush.set("2H", "#948c7c", 0.7);
  brush.line(128, 208, 254, 258);
  brush.line(722, 588, 760, 604);
}