Documentation Blog for IMA
Learning p5.js, data visualization, generative art, and interactive art. Fall 2020 course.
The final product is very different from my initial idea and project proposal. I actually kept on changing ideas throughout the process. Originally, I wanted to use PoseNet and have the user cut the tree. The idea kept evolving– from using music to grow the tree, to the ml5 library sound classifier.
I wanted to play around with the colors of the circle, so I tried using HSB instead of RGB to get all the colors. At first I wasn’t really sure how to get all the colors, so I only had a gradient of white to dark grey. I had to refer back to an old coding activity, which was when we worked with iteration. I realized that I needed to include saturation and brightness instead of just hue. I set colorMode(HSB, 17) and made the saturation and brightness 17. I decreased the saturation and brightness to make pastel colors, but decided to keep it at 17 because it pops out on the dark background.
For this project, I decided to do a color analysis of one of Vincent van Gogh’s paintings, A Wheatfield With Cypresses. This data visualization shows the percentage of how much a color is used in the painting.
I looked at various articles/essays that are relevant to the topic of data visualization, but decided to choose Welcome to the Cloud Zoo by RJ Andrews and Amber Thomas. The visuals of this was very calming and almost ethereal. The concept of “cloud zoo” is interesting and the way they put the live streamed videos on top of a rock that’s similar to the environment that the animals live in ties everything together nicely. The data they used are live streamed videos from different zoos around the world. If you click on the image, you can get additional information on the animals as well as a link to the zoo they got the video from. This allows viewers to enjoy the videos of animals without being distracted from long paragraphs of information. It’s a nice break from reading a lot of text.
I was inspired by the song “Blueberry Eyes” by Max (feat. SUGA of BTS). Originally, I wanted to have strawberries and blueberries raining down from the top of the sketch, but I decided to kept it simple.
This activity was slightly frustrating. In the beginning, I did play around with the webcam, and it was going pretty smoothly. However, I was still using get() instead of pixels array. When I changed to the array, that was when things started to break and freeze. So I switched from the webcam to an image, and after trying three different images it still wasn’t working.
The final outcome was a completely different vision than what we originally planned. However, we knew that we wanted to create a game, so it was a debate between “A Stroll With Totoro” and “Flying With Kiki.” Our initial idea was “A Stroll With Totoro” similar to the Chrome dinosaur game. While this plan was a lot simpler than Flying With Kiki, we didn’t want to clash with another group who was also inspired by the character Totoro. So, in the end we went for Flying With Kiki.
Continue reading “Project II – Interactive Experience: Flying With Kiki”
I was inspired by the mobile game “Monument Valley” by ustwo games. I tried replicating the aesthetic visuals of the game and even added the character into my project. However this is a lot simpler than the designs of “Monument Valley” and it definitely does not do justice the the beautiful visuals.
I wanted to do something with circles or rectangles. I remember messing around with the iteration part in the last activity and I thought it looked interesting, so I implemented that “mistake” into this poster.
This is my imaginary creature, AKA R-boto the dancing robot.