Link to p5js:

Inspiration from one of the earliest sci-fi film A Trip To The Moon(1902). The idea started with me accidentally found out how to create scratchy film effect, so I decided to do something that feels like stop-motion film. I initially used the distance from upper lip to lower lip to detect the mouth opening, and it can become less accurate as I move farther from the screen. Therefore, for detecting eye blinking, I compare the current eye height and eye height of the previous frame to get a more accurate blinking result. I also try to figure out the math in creating concentric circles with the rotation of the head, but the face sometimes goes out of the circles. If more time is given, I will scale the size of the facial features according to my distance from the camera, and add rotation to the face to make it more realistic. It will also be nice if i can create a projectile motion for the spaceship to land on the right eye of the moon:)

(A fun little music video I made for The Distance To The Moon by L CON)



Pareidolium by Rafael Lozano-Hemmer is an interactive mirror made out of clouds of vapor that ascend from the water basin. The fountain uses computer-controlled ultrasonic atomizers, placed under the reflecting water pool, which produce the plumes of cold vapor. As a visitor looks into the water, a facial-detection system extracts their image and creates an ephemeral likeness. The portrait becomes tangible, almost breathable, only briefly, then disappears in turbulence.

There are many other interactive artists creating similar interactive mirror in different medium, such as wood block or wool. However, I am particularly drawn into this one because of its transient quality and the way it merge and disappear is very soothing and elegant. Fog creates a sense of mystery that really draws audiences in to look at the installation and gives it a more self-reflective characteristic.


Link to p5js:

The dandelion clock is an expressive clock that serves more as a decorative purpose than functional purpose. The number of dandelion represents the current hour, the length of the stem grows as minutes go by until the next hour comes, and every second a seed falls off and refresh as the next minute starts.

Inspired by Dan Shiffman's coding challenge on flocking I created this expressive clock, I am glad that I was able to pick up the use of object-oriented programming after this practice and learn a bit more about using vector in js. However, there are still several places that I am not very satisfied with the result. When refreshing the seeds every second, the floating seeds also get erased too. If I have more time I can fix it by putting seeds into two arrays (isFloating[] and stationary[]). I would also love to have all the dandelion grow from the bottom to imitate the actual growth. Also the code can definitely be optimized for better frame rate.

(every second one seed falls off)

(when a minute finishes, the stem grows longer and seeds restart)

(every hour the stem goes back to its original length and one more dandelion appears on the screen)

(the clock is not going to be used as an actual clock but can be an large art piece hanging in the room as decoration)


Link to p5js:

I was inspired by the those trippy illusion patterns initially and decided to make some interesting variation based on those images. I used sine wave and SinIn ease-in function to control the individual radius for each arc and use and offset to make sure it the each radius varies. Then I used an array to store the traces to create a lagging with colors gradient. The motion blur is done by giving the background some transparency (big shoutout to Izzy's smart idea). Overall, I enjoyed the visual complexity of the loop i created but I hope that the motion can be more dynamic instead of just one shape rotating at the same place.


I agree with the essay that a lot of art actually lie between first word art and last word art and the boundary between the two should not be clearly defined. Art are always built upon the ideas of each other, directly or indirectly, while originality still exists, so I tend to not define myself in the spectrum. Similarly, the development of technology should not be classified into first word art or last word art. Therefore,to respond to the idea that technologically novel works don't always age well, I believe that even though the work itself might fall out of trend very soon due to its experimental nature, it still provides valuable experience to the successors to learn from, which actually extends its lifespan into the culture/trend rather than shortens it. Culture is not created by one single pioneer work but anyone who are influenced by the precedents in the field and passes down the influence to others through their own works.


1A. Japanese ceramics could be seen as a great example of effective complexity. Just as other ceramics, basic rules such as what clay to use and what general shape to follow need to be followed to successfully create the ceramics. However, unlike other ceramics, Japanese ceramics shows a much greater tolerance to defects and more appreciation to the unpredictability in the glazing process. It strikes a great balance on the scale between total order and total randomness because it has to conform to certain rules to survive but its beauty actually comes from the unexpected.


1B. The Problem of Meaning has been a long-time struggle for me not only when I am producing generative art but also other digital art. The biggest drive for me to learn coding art is for very practical reason without much meaning, and I only assign meanings to the pieces as work progresses. My works also tend to have a more improvisational nature and I like to find out the final answer through experimentations. In the end I tend to believe that even though I use generative system for a very practical reason, the meaning of the works should be determined by the creator not the tool through which art is created.



Zauberflöte(2018) is Michael Hansmeyer's set design for Mozart's Magic Flute, directed by Romoeo Castellucci. Michael Hansmeyer is a computational architect who seeks generative computation as a creative tool for installations and architecture. His work creates a successful bridge between digital and physical world. The transformation from amazingly rich digital artwork to large-scale physical installations makes the visceral impact on audiences even stronger. The grotto's geometry uses a generative subdivision algorithm that create endless permutations and infinite scales to create lavish details. Along with the perfect symmetry gives the stage more depth and solemnity than normal pillars can achieve and perfectly reflect the nature of Mozart's works. While symmetry gives it order, the infinite amount of details grows like uncontrollable weeds on the installation that gives the piece a sense of disorder and unpredictability.


meh – Interruptions

Link to p5js:


  1. The artwork is square.
  2. The artwork consists of many short black lines, on a white background.
  3. The lines all have the same length.
  4. The lines are arranged in a closely packed grid.
  5. The lines have a range of random rotations.
  6. The lines rotate around their own centers.
  7. The rotations of lines tend to be close to 90 degrees.
  8. The positions and sizes of the blank areas are random.
  9. The blank areas tend to cluster.


I approached to the problem first by creating a grid of short lines, and then rotate them in random angles in certain range. I then used noise to create a range to identify the area where to leave empty, and looped through the lines to find out the lines that are within the range. If the line is not within the range, draw the line in its rotation. Finally, make the image clickable to change frame.

During the process I found that it was really helpful to use translate(), push() and pop() for line rotation around its center and to use noise(x, y, z) (especially using z for change to different noise).

Compared to the original image, my images can be improved by increasing the amount of detail by making var inc a larger number.