Self Portrait

https://editor.p5js.org/yj3612/sketches/KLGj0qxKC

截屏2026-09-06 11.33.15.png

function setup() {
  createCanvas(600, 600);
}

function draw() {
  background(210, 235, 245);

  //clouds
  noStroke();
  fill(255);
  circle(100, 100, 70);
  circle(130, 110, 70);
  circle(80, 140, 90);
  circle(130, 145, 80);
  ellipse(130, 130, 150, 95);

  circle(400, 200, 70);
  circle(430, 210, 70);
  circle(433, 240, 90);
  ellipse(430, 230, 150, 75);

  ellipse(600, 30, 140, 95);
  circle(600, 70, 50);

  ellipse(0, 330, 130, 40);
  circle(0, 310, 50);

  //hair
  noStroke();
  fill(20);
  ellipse(300, 350, 300, 450);
  fill(100, 70, 20);
  ellipse(300, 500, 300, 450);
  fill(200, 150, 80);
  ellipse(300, 550, 300, 450);

  //body
  fill(255, 240, 200);
  rect(150, 400, 350, 350, 20);

  //face
  noStroke();
  // stroke(250,100,100);
  // strokeWeight(5);
  fill(255, 250, 200);
  ellipse(300, 300, 200, 250);

  //mou
  stroke(250, 100, 100);
  strokeWeight(5);
  arc(300, 350, 20, 15, -PI / 2, PI / 2);
  arc(300, 365, 10, 10, -PI / 2, PI / 2);

  //eye left
  fill(255);
  ellipse(250, 250, 50, 20);
  fill(250, 100, 100);
  ellipse(250, 250, 20, 20);

  //eye right
  fill(255);
  ellipse(350, 250, 50, 20);
  fill(250, 100, 100);
  ellipse(350, 250, 20, 20);

  //glasses
  stroke(150, 100, 10);
  strokeWeight(2);
  noFill();
  arc(250, 240, 90, 90, 0, PI, CHORD);
  arc(350, 240, 90, 90, 0, PI, CHORD);

  //clothes
  stroke(250, 100, 100);
  strokeWeight(30);
  line(200, 410, 200, 500);
  noStroke();
  fill(255);
  quad(150, 500, 500, 400, 550, 600, 100, 600);

  //hair2 Bangs
  rotate(radians(-45));
  noStroke();
  fill(20);
  ellipse(30, 300, 150, 60);
  rotate(radians(50));
  ellipse(350, 150, 120, 60);
}

When I tried to draw bangs, I needed to rotate an ellipse. However, when I used “rotate() ”on lines 82 & 86, every shape in the face rotated as well. To solve this problem, I moved the code for the bangs to the end. Is there a more convenient way to rotate only one shape at a time?

💻 How computation applies to my interest


My undergrad major is illustration, almost most of my work are static. Once, I have got a part time job which require me to finish a series of illustrations about the history of dumplings. However, when I brought these illustrations to the food exhibition, I noticed that very few people stopped to look at them. In contrast, most of the crowd was drawn to the interactive new media displays nearby. At that moment, I realized that to let people truly engage and feel the meaning, the medium must move and allow interaction so that stories can be experienced.

In this semester, I would like to do a project about the relationship between food and media, similar to how a movie and popcorn can become part of the same experience. I want to explore whether interactive media can similarly enhance the experience of eating, rather than distract us from it. I want to combine my background in visual storytelling with coding to create interactive experiences around food.