Background, Interests, and Creations – ICM – Week 1

Rows and columns of rectangles in different sizes to create a gradient look from top left corner to bottom right corner. The background is teal while the rectangles are white. The left top corner is dimmest while the bottom right corner is the brightest.

The Importance of Computation

Through my undergraduate study, I mainly focused on marketing and communication arts (video production). However, I had the opportunity to play with coding in terms of Processing and Arduino to accomplish several projects with sensors. I have worked on a 2-week project where my breathing pattern is shown through the streaming movement of the LED stripe on my coat. I have also worked with my friend Julia in the class, Intro to Wearable Technology, to create a pair of fairy wings that respond to light and sound. I fell in love with the idea of creating things out of imagination. I also enjoy the process of trial and error on the process and I appreciate the critique in the community to make my project better.

The back of the fairy wings composed with circuit playground express, soldered wires, 3d-printing fiber holders, conductive thread, cardboard panel, and elastic strap.
Example of the back of fairy wings created by Yiting Liu and Julia Kosier in 2019 for the course, Intro to Wearable Technology in the University of Wisconsin-Madison.

For me, computation is a means to help me create. The journey is what I enjoyed the most since there is always the uncertainty lingering around in the project. I love constantly challenging myself and pushing myself to create more, fail more, and learn from my lessons. I have tasted the joy by combining computation with art and I want to explore more here in ITP.

As I learned more about computation, I really want to accomplish is to create generative and interactive art with the assistance of images. My idea is to allow users to upload an image and the program can help to create another painting with the accumulated images it has. I am intrigued by the project EmobodiSuit by Rachel Freire and Sophia Brueckner. The fact that it does not have any sensors but haptic actuators is interesting to me. I love the idea that they offered a different perspective on the industry. They used the universality of human feelings and adapted the actuators to generate warmth, coldness, vibration and more.

EmobodiSuit by Sophia Brueckner and Rachel Freire. A top covered with wires and actuators that transmit senses such as warmth, coldness, and vibration through data collected to the wearer.
EmobodiSuit by Sophia Brueckner and Rachel Freire

Sketch Creating Process 

Assignment

Create your own screen drawing: self-portrait, alien, monster, etc. Use 2D primitive shapes – arc()curve()ellipse()line()point()quad()rect()triangle() – and basic color functions – background()colorMode()fill()noFill()noStroke()stroke(). Remember to use createCanvas() to specify the dimensions of your window and wrap all of your code inside a setup() function. Here are some sample examples: ZoogMondrian

I had several ideas using geometry in my homework. I originated wanted to create an image filled with ellipses. Yet, I don’t want to do the repeated way of manually putting each value for ellipses.

Sketches of geometry drawings. There are repeated triangles, ellipses, and rectangles respectively.
Sketches of geometry drawings
White ellipses in different sizes placed on a light blue background
My first try of ellipses

I wasn’t too happy with this painting since it is not as interesting as I would like. Therefore, I moved to use rectangles and started thinking using for loops according to my prior knowledge in programming. Originally, I want to make sure each rectangle has 10 pixels apart from each other as well as to the border. However, with various sizes of rectangles, the math becomes a bit unnecessarily troublesome for me. Therefore, I started to make them into columns and rows and let the for loop run for itself. Playing around the code and through several trial and error since I have two variables and was confused at first which to use for the value of the rectangle. But I finally made a painting that I am happy with in the end.

Rows and columns of rectangles in different sizes to create a gradient look from top left corner to bottom right corner. The background is teal while the rectangles are white. The left top corner is dimmest while the bottom right corner is the brightest.
I love this effect of gradient through using of various rectangles through for loops in p5.js.

Published by Yiting Liu

NYU ITP '21

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

Create your website with WordPress.com
Get started
<span>%d</span> bloggers like this: