Q1: Write no more than 5 sentences about how computation applies to your interests:

  1. Something you studied, a job, a hobby, or a cause you care about.

My major is Communication Design. My work involves illustration and graphic design. I really enjoy looking at outstanding brand designs and website designs, especially the interesting motion graphics and interactive effects. I believe that computation can help me better understand the principles and code behind some of these interesting motion effects.

Q2: Point to one thing in your code that you'd like us to talk about in class.

Is there a way to add rounded corners to a shape? Like in Figma, where you can freely adjust the corner radius? I really want to make some smooth transitions but I don’t know what code should I use.

  //ears
  fill("#305FD7");
  //Bézier curve looks great, but I don't know how to use it.
  triangle(80,135,70,25,170,80);
  triangle(180,80,260,15,270,125);
  

image.png

Process of portrait

I want to draw a mod design for the Felyne Cat from Monster Hunter: Rise. It’s really cute and fun, and can be drawn using just a few simple geometric shapes. I’ve roughly envisioned a Felyne holding two strings of rice balls. First, I put together the basic shape using shapes in Figma. This step was to determine the order of the code, the colors, and the categories. After noting down the color codes, I used some basic functions in p5js—such as “ellipse,” “triangle,” “arc,” and “quad”—to complete the illustration.

image.png

(screenshot from Figma)

image.png

(screenshot from Fp5js)