Final Project Report

For my final project, I tried visualizing space in a new way by applying image manipulation to photos of planets. In order to accomplish this, I used brightness tracking to enable users’ interaction with the images on the screen, and also the pixel array in Processing.

I used only code for my project. Initially, I planned to mount an LED on a box to replicate a flashlight. However, in the end, I was running out of time, so I resorted to using the flashlight on my phone. After seeing people interacting with my project, I wished I could have replicated a flashlight in some way, not necessarily any complicated model, but only something that can enable people to play with light in a different way, for example, Tayla’s box. Because I was experimenting how to visualize space in a different way, having something that emits light but does not look like a flashlight would have provided a more complete experience.

As my project is about image manipulation, rather than learning new code, I was mostly tinkering with the Pixel Array and Objects. Besides Daniel Shiffman’s Image Manipulation series, I also consulted his Purple Rain Challenge to create the rain effect in my project.

For my project, I use Processing to track brightness and manipulate images. The program tracks the brightest pixel and uses it control the pixels on the screen. I manipulate photos of 3 planets:

  1. Earth: When the user moves the flashlight from left to right, Earth will gradually explode, in other words, the z-coordinate of each pixel increases. And as Earth is exploding, the user can see themselves on screen because the background takes in data from the camera.
  2. Jupiter: As I found the colors of Jupiter make a very nice color scheme, I decided to let the user draw with those colors. As the user moves the flashlight from left to right, the “brush” will follow their motion horizontally. However, then the user moves the flashlight up and down, he is changing the z-coordinate of the brush, so that the brush stroke appears as if it was coming farther away or closer towards him.
  3. Venus: I make a particle rain using the colors of Venus. Each circle/particle takes the color of one pixel in the photo of Venus and moves from top to bottom of the screen and back again. With 10,000 circles moving at the same time, it looks as if the particles were raining onto Venus and painting Venus at the same time. When the user moves the mouse from left to right, he is also controlling the speed of the rain. Unfortunately, I could not use brightness tracking in this part of my program because my computer cannot handle the 10,000-object array and the pixel array at the same time. I did try adapting this part of my program so that it would also use brightness tracking. However, I could not retain the rain effect so I decided to resort to the mouse instead.

My code consists of 5 parts which I split into 5 tabs in Processing so that my code would look cleaner.

Main code:



Track brightest pixel


Note: the screen dimension needs to be 1024×640 for the program to run.

The three images that I used:

3 most difficult parts of my project: 

I struggled the most with the pixel array. The program we examined when we first learned about the pixel array runs through all of the pixels in the image. However, as I experimented with different kinds of image manipulation, I figured out that it was not always necessary to run through all of the pixels in the image, and doing this only slows the program down. Simple as it is, it took me a great deal of time to figure out because only when I experimented with different image manipulations to see which method works in each case.

Moreover, as I use multiple arrays in my project, the pixel array from the camera, the pixel array from the images, and some arrays for objects, I found debugging very difficult. Sometimes my code did not work only because the array was too large for it to process. However, there was no error message for this kind of error, so I often fixed random things in my code to make it work. Yet in the end, the code went more and more wrong. I had to start from scratch multiple times to identify which part was the problem.

Last but not least is the process of coming up with ideas for image manipulations and turning it into reality. At first, I had ideas for all 8 planets. However, after trying to put into code each of those ideas, I realized that they were not feasible for me in terms of time and also in terms of complexity. It took a great deal of time trying to put an idea into code because sometimes the idea was good but too complicated, so I also had to make modifications to simplify my ideas so that the program would run reliably. Some of my ideas involved moving pixels around, and although I had a very clear vision of my idea, I did not know how to translate it into calculations so that I could change the x and y positions of the pixels as I wanted.

After finishing my final project, I greatly regret that I did not create a system of physical interaction for my project. As we have been building a lot throughout the semester, this time I wanted to try focusing on coding more and thus to improve my coding skills. However, coding took up so much of my time that I did not have the chance to build anything. Therefore, my project does not achieve the interactive level that I had hoped for my final project. If I had the opportunity to redo my project, I would start from building something first, then begin incorporating technology into it. In that way, the focus of my project would be, instead of on the complexity of something they can only see, on how users can interact physically with the object, which is also my favorite gain from this course.

Leave a Reply

Your email address will not be published. Required fields are marked *