top of page


week 1: Documentation


My interest in digital media art stems from the work of a generative artist Raven Guo, who usually applies mathematical functions to create complex and exquisite animation using processing, the program. His work is always extremely neat but full of change, which make me think of mathematical functions again. In fact, mathematical functions are the induction and derivation of the laws of nature, but usually the beauty of math is covered by the long functions and difficulty to understand it. As a matter of fact, I began to be amazed by those art of visualizing the codes of nature, which people can create on p5.js.



1.Finish a duplication of a drawing

  • I start this mission by totally dismaying it. I thought it would be extremely easy to measure the (x, y)values in Illustrator. Things went hard when I began to code the leaning bar.

  • The first challenge is to figure out the rotate(ANGLE) function. This function has actually a lot of details, such as the angle mode, which can be changed by the function angleMode (RADIANS/DEGREES); also the rotating center can be confusing; sometimes need the function translate(100,100) to adjust the location of objects.

  • Secondly, the following things can be confusing, cause after I use the function rotate(), it seems the xy axis rotate. The following things are also rotated except a rotate-back. The same on the function translate().

  • So, remember to rotate and translate back after leaning objects are done.

  • However, there should be other easier methods to draw the bar, such as using the function quad(a,b,c,d,e,f,g,h) directly draw the red bar.(quadrilateral四边形,parallelogra平行四边形). Or the beginShape()——vertex(0,0)...——endShape().


2. Produce a portrait

  • I don't really know how to define a portrait, so I draw a lady that I feel beautiful. Although she seems not very like me, I assume it will reflect myself in some aspects.Thinking of the limitation of tools— I am only able to use simple geometric figure with p5.js. So I use illustrator to draw by simply ellipse, square, arc.

  • Then we go to the real hard process to duplicate the drawings to p5.js.

  • I found that the angle radius can not be larger when it being set longer then half of the rectangular's width.maybe try other method later.

  • Finally the portrait comes out like this, and the time is enough for me to polish it a lot, cause I know I have a lot to learn in illustration, and always need a lot of time with it.

  • This portrait might not seem like me. Actually at first I spent a long time on thinking who I am, and what I am looked like. On the long struggle way to figure out an specific image of myself, I realized that I hate being defined or even being described, even by myself. Therefore, at last, I decided to freely picture someone I admire. I think it will reflect me, the person Lynn, in some aspects, which makes it being my portrait.

  • link:

bottom of page