In my past code sketches, I have created patterns in various forms. Most of the time, the patterns were formed simply by repeating the same visual. In a recent class, Tega gave us a systematic overview of different approaches to make patterns. It was mind blowing to see how extensively people have studied patterns. In particular, I was very much drawn into Truchet tiles.

[ View Freshly-Synthsized Banner Ads ]

Banner Depot 2000 is an interactive archive of over 20,000 banner ads from the late 1990s and early 2000s. The authors of this project, Richard Lewei Huang and Yufeng Zhao, published a dataset of these banner ads. This project brings out so much nostalgia of my early memories of the Internet and I have been meaning to make a project using this dataset.

[ Try Bug Musicans ]

This series of experiments started with something completely unrelated to music. I remember seeing ragdoll characters commonly used in video games and artworks either to invoke a surreal feeling or for a comedic effect. I wanted to try implementing it in p5.js with the help of a physics library.

[ Try Mouth Synth | View source code on GitHub ]

In my previous experiments, I integrated hand pose detection in my sketch. Hand-driven interaction feels magical, but also somewhat conventional. For this new series, I wanted to try something less conventional—mouth-driven interaction.

For this series, I wanted to create a simple interface for “drawing” melodies on the screen. I started with a mouse interaction where clicking and dragging the mouse drew a sequence of linked nodes along the path of the cursor movement. It worked much like how you would expect any drawing app to work. The melody would start playing as soon as you release your mouse. The nodes were sequentially highlighted as their corresponding notes were played.

In this series of experiments, I started with very basic algorithmically-generated rhythms coupled with simple visual elements.

While we were exchanging ideas of what we could do with Tone.js and p5.js, Henry Chen came up with this idea of a node-based system for interacting with music in a virtual 3D environment, in which moving one node could simultaneously affect multiple other nodes that affect the music. We agreed that creating a 2D version first could serve as a very good starting point.

For the past two years, I have been doing lots of computational sketches that focused on visuals. This year, I am enrolled in a graduate course at ITP called the Code of Music, taught by Luisa Pereira. I finally ran out of excuses for not experimenting with sound.

For the graduate course, Introduction to Fabrication, that I took at Interactive Telecommunications Program (ITP), I spent a few weeks learning and experimenting with a variety of fabrication machines, tools, and materials. I embraced an iterative approach to fabrication and integrated computational techniques into my process. Here are all my experiments, each linked to its respective post:

I have always wanted to experiment with wood joinery and I finally decided that this is the week. During my research, I stumbled upon this interactive wood joint design system and wanted to create something similar in p5.js.

I was tasked to create an enclosure and I thought it would be fun to design an enclosure with an organic exterior. I wanted to continue exploring computational design approaches, so I started sketching in p5.js.

This week, I have been experimenting with laser engraving. I wanted to continue incorporating computational thinking into my process, so the first thing I thought of was to create a p5.js sketch for the laser engraver. Although raster files can be used for etching, I think it would be more interesting to generate a vector path for the laser engraver.

I have been making and posting daily creative coding experiments (on my Instagram) for almost 2 years now. One of the mathematical functions that keep coming back is a sine function (such as in the sketch below, which utilizes a combination of sine and cosine functions). As I have been studying fabrication techniques and mechanical movements recently, I had this idea of creating an automaton that visualizes a sine wave.