week 8 – color rain

Co-created with Bosung Kim

When Bosung and I first met we quickly converged on the idea of trying to convey the feeling of water through pixel manipulation. We sought to recreate the visual of water ripples from a drop and got inspired by a YouTube video that used an equation to visualize the z-axis of a circular wave pattern as a function of time and space (unfortunately, I lost the link to the video):

equation used for the simulation

Once we figured out the mechanics of the equation we were mesmerized by the pattern. But the question remained: what in the image to do we actually have to change to create a color ripple effect? After some experimentation we ended up remapping the z-values from the equation onto the color range (0-255) and assigning the few values within the raindrop radius to either R, G, or B values of the pixels (randomly chosen). We also varied the radius of the waves for each drop.

Ultimately, our work uses the color rain to give new life to an existing image: a desaturated desert, void of water and color.

After several minutes of color rain, the desert takes on a new life:

The full experience can be found here [link].

The three words that we think describe the image are: contrast, tranquility, and mesmerizing.

Attribution: The desert image was taken by Santiago Manuel De la Colina, and accessed on pexels.com. The music is from …

week 5 – functions as units of labour

This week I really wanted to experiment with recursive functions to make snow flakes. I quickly discovered that while snowflakes have a pattern, the patterns do not have a recursive relationship. Here are a few examples of my attempts to make a recursive snowflake [link to code]:

Eventually, I decided to pivot and make a recursive plant that grows when there is more sunshine :). The sun comes out as the user moves the mouse in the vertical direction [link to code]:

week 4 – patterns

This week I worked with creating patterns, sometimes with unexpected results. After some playing around I arrived at two evolving patterns:

1) Childhood reimagined

When I was a child I loved drawing a specific pattern using grid paper. It was very soothing and took alot of effort, patience and time.

I wanted to recreate this pattern using computing, which surprisingly also took a lot of effort. While I was coding, I made several mistakes which resulted in unexpected and interesting patterns. Here are some of the ‘mistake’ results:

Finally I arrived at the right pattern:

When I made mistakes in the code, I quite liked some of the patterns, so I decided to randomize several parameters and see what happens. Here is the result [link to code]:

2) Mars and Jupiter’s solar rave

I got inspired by an animation of Mars and Jupiter orbits around the sun that I saw on someone twitter

I found it very hypnotic and beautiful, reminding me of a stellar dance. I wondered what different orbits and speeds would look like. Voila, welcome to the solar rave! [link to code]

week 3

Coded in collaboration with Lisa Jeong

Inspired by the classical Monty Hall problem the player must choose a door to open. Only instead of a car, they win a CAT!

Sometimes you win, sometimes you lose, and sometimes the consequences are unpredictable. Refresh to play again and see if you get a different outcome.

Link to p5.js code

week 2

The second iteration of my self-portrait plays with the idea of the many human emotions and character traits, including ones that people often try to hide like anger and vindictiveness. As time passes, I change the coordinates of the key portraits elements (wings, eyebrows, and the flame) and the face color to transform my original self-depiction into an evil looking creature. The mouse cursor also controls the hair shape, letting the viewer add to the character’s maleficent aura. I also used a cyclic sine function to create the oscillating eyebrows, which add a feeling of uneasiness to the transformation. The p5.js code can be found here [link].

week 1

Self-portrait

I wanted to attempt to incorporate some elements of a phoenix in my self-portrait as it symbolizes the cyclical nature of demise and rebirth – something I seem to identify with lately. So I made a quick sketch and started coding:

sketch of a self-portrait

Using p5.js editor I first decided to create an outline of the portrait. I played around with shape of the flame, mirroring the side parts and creating the middle on top. The variables for the x and y position were extremely helpful in moving the entire image around without changing the curveVertex(). I followed a similar process for the wings although the sharp corners and change of direction was harder to achieve. For hair I used a combination of arc(), rect(), and quad(). For the face I used curveVertex() and quad() functions. The curve definition was easier this time due to experience and symmetry. For face features I experimented with line(), ellipse(), circle(), and triangle(). This is the intermediate result:

this image shows the outline of the self portrait without the color

Then I added colors and rearranged the shape (I didn’t like having a crown on my head!). I wanted to keep a simple color palette, accentuating the fire aspect of the phoenix. Here is the final version [code can be found here]:

final version of the self-portrait in ps5.js

Reflections: one of the trickiest parts was to figure out how to create more complex curves like the claim and wings. While we didn’t learn this in class yet, I could work without using variables because I am too used to defining things parametrically and rapidly iterating (especially the positioning). I also really wanted to play around with curves so I ended up using curveVertex() function instead of curve(). I also realized that I cannot seem to get away from symmetry — something that I want to change in my next iterations.

Computation and me

There are way too many things I want to use computation for — it is hard to pick . Previously, I mostly used programming for data analysis, simulations, and calculations but finally I have a chance and space to go beyond that. I want to dive into the world of creative visualization, multi-sensory immersion, and human-digital interactivity. I also absolutely MUST try using machine learning and computer vision in creating interactive installations. This is something I always wanted do but never had the bandwidth nor a community to.

A recent memorable experience I had was attending an immersive night walk in a forest close to Whistler, Canada. Vallea Lumina took visitors on a 1km snowy night trail following the footsteps of two long-lost hikers into an enchanted forest. The multi-media night walk did a beautiful job in bringing a sense of magic into the forest, which made me feel like a child full of awe and wonder again. The light and sound installations throughout the walk really created a feeling of enchantment. I would love to create a similar immersive experience that supplements natural environment or day-to-day spaces with augmented elements (such as light, sound, projections, etc.) to create a new reality.