Month: November 2022

Recitation friday!This time,I’m about to design an interactive poster for the IMA Fall 22 End-Of-Semester Show.

Based on my original design in recitation 5,I made some adjustments and figured out the logic of coding during the recitation class with the help of Margaret.

And this is the final work and its code after finishing the three homework tasks:

(Everytime the mouse clicked,the size of the rotating circle would change.And the extent of change was based on when the mouse clicked.)

float a;
float c;
float d;
void setup() {
  size(768, 1024);
  c = 10;
  d = 0.5;
}

void draw() {
  background(0);
  otherCircles();  
  textSize(120);
  fill(#8AF5E7);
  text("IMA", 40, 100);
  fill(#8AF5E7);
  text("IMA", 40, 250);
  fill(#8AF5E7);
  text("IMA", 40, 400);
  textSize(60);
  text("Fall 22 ",330,100);
  text("End-Of-Semester",330,180);
  text("Show",330,260);
  textSize(45);
  text("8th floor",530,800);
  text("Dec.16th",530,850);
  text("6-8 pm",530,900);
  fill(255);
  a = 5+millis()/1000.*PI;
  c = c+d;
  circle(width/2+(width/3)*cos(a),20+height/2-100*(sin(a)),2*c);
   if (cos(a)<0){
    d = 0.5;}
   else{
     d = -0.5;}
 
  println(sin(a), d);
    
}

void otherCircles() {
  fill(255, 220);
  ellipse(380, 679, 240, 40);
  fill(255, 40);
  circle(190, 500, 377);
  circle(570, 500, 377);

  stroke(0);
  strokeWeight(1);
  fill(255, 220);
  ellipse(380, 320, 240, 40);
  fill(255, 180);
  ellipse(380, 355, 140, 23);
  fill(255, 160);
  ellipse(380, 375, 100, 17);
  fill(255, 140);
  ellipse(380, 395, 65, 13);
  fill(255, 120);
  ellipse(380, 410, 48, 10);
  fill(255, 100);
  ellipse(380, 423, 38, 8);

  fill(255);
  circle(random(340,418), random(480,515), 4);
  circle(random(340,418), random(480,515), 4);
  circle(random(340,418), random(480,515), 4);
  circle(random(340,418), random(480,515), 4);
  circle(random(340,418), random(480,515), 4);
  circle(random(340,418), random(480,515), 4);
  circle(random(340,418), random(480,515), 4);
  circle(random(340,418), random(480,515), 4);
  circle(random(340,418), random(480,515), 4);
 
}

void mouseClicked() {
  c=-c;
}

The most struggling as well as interesting part was the circle moving along an elliptical trajectory.I spent some time talking with Margaret and an Learning Assistant to find out the appropriate way. To make the movement more fluently, I chose millis() instead of framecount().Since the X of the circle was moving side to side and the Y of the circle was moving back and forth,the graph of sin and cos perfectly fitted.However,it did take me much time to calculate the relations between X,Y and Size.And it was important to multiply a PI inside the sin and cos so that it was easier to count and calculate.I was glad that I succeeded after lots of attempts and adjustments.

Recitation Friday!!Today,it’s my first time to draw an image in Processing based on a photograph that inspired me.

The day before recitation,I visited the Institude of Contemporary Art in NYUSH and there was an exhibition.When I was visiting the artwork of a video,I was deeply impressed by the beauty of shape and light.Therefore,I took this picture.Since the picture had an aesthetic quality and geomatric features,it perfectly matched the prompt of the recitation.

In the Processing,my general design was to use two ellipses on the top and the bottom and put two circles on left and right to create the curves.

Firstly, I roughly sketched on the paper to set the position and size of graphs.

Next, I coded two ellipses and two circles.

Oops…It seemed that something went wrong in the calculation.So I reset the position and size of the circles.To make the joint of the two shapes more fluent,I also set the strokeweight as 1.

In order to enhance the visual effects and to make it more three-dimensinal,I painted the background and circles in black.Based on the original work,I substituted small ellipses for the small white circular rings.What’s more,I only put the small ellipses on the top half while the bottom half remained black because asymmetry was also a helpful way to promote the aesthetic quality.

Lastly,I added several white points in the middle.At first,I used the code of point but it was too small to be seen.As a result,I chose circles with small sizes to meet my requirement.Here is the final work and its code.

void setup() {
  background(0);
  size(1000, 700);

  fill(255, 220);
  ellipse(480, 479, 240, 40);
  fill(255, 40);
  circle(290, 300, 377);
  circle(670, 300, 377);

  stroke(0);
  strokeWeight(1);
  fill(255, 220);
  ellipse(480, 120, 240, 40);
  fill(255, 180);
  ellipse(480, 155, 140, 23);
  fill(255, 160);
  ellipse(480, 175, 100, 17);
  fill(255, 140);
  ellipse(480, 195, 65, 13);
  fill(255, 120);
  ellipse(480, 210, 48, 10);
  fill(255, 100);
  ellipse(480, 223, 38, 8);

  fill(255);
  circle(500, 290, 4);
  circle(490, 295, 4);
  circle(480, 300, 4);
  circle(470, 305, 4);
  circle(460, 310, 4);
  circle(500, 298, 4);
  circle(490, 285, 4);
  circle(480, 289, 4);
  circle(475, 305, 4);
  circle(480, 290, 4);
  circle(492, 297, 4);
  circle(480, 305, 4);
  circle(470, 309, 4);
  circle(460, 312, 4);
  circle(470, 299, 4);
  circle(495, 289, 4);
  circle(485, 292, 4);
  circle(471, 300, 4);
  circle(510, 302, 4);
  circle(499, 290, 4);
  circle(514, 288, 4);
  circle(450, 303, 4);
  circle(508, 299, 4);
  circle(493, 294, 4);
  circle(455, 313, 4);
  circle(453, 316, 4);
  circle(480, 311, 4);
  circle(460, 305, 4);
}

Due to the restriction of time and skills, I didn’t go further to explore the step 4.But I supposed in the following practice or works,I would definitely have a try based on the ideas in the prompts.

Comparing to the original artwork,my works was more of a simplified version since I kept the main design while deleting the complex white circular rings .Meanwhile,I added more ellipses in the top half and used several small circles in the middle to create nebula-like graphs.I also made them tilt. From my point of view,using Processing to draw wasn’t the most ideal way to realize my design because the curves and circular rings were hard to draw with codes for a beginner like me.(Or it was because I lacked the skills in Processing) Still,it was a fun experience.