JESSIE ZHAI
Digital artist
A documentation page of rambling and experimenting.
@jessiehaseyes
jessiejiranzhai@gmail.com 02 OPPOSITESICM WEEK2
For week 3’s creative assignment CHOICES, I chose to visualize the choices of Blue Pill or Red Pill from the Matrix. They represent a choice between learning an unsettling truth or remaining in a state of blissful ignorance. Tempting either way..
PROCESS
I settled on the idea of blue/red pill quite early on. For the buttons, I attempted with both the button elements and conditional statments because I wanted to see if the button element could make calling other functions easier later down the line. But unfortunately as this point, the two methods are somewhat the same to me even though I’m sure there’s so much more.
I didn’t do a great job documenting each step this time, but I spent too long imagining what would be the center graphic for this extremely difficult choice. I decided on the quote from the Matrix with classic typewriter font in neon green.
Compare to creating shapes and colors from scratch in p5, I’m definitely more interested in image distortion. So I wanted an universal regonizable image that looks like it belongs in the Matrix, and here we have it..
I looked through tons of tutorials and examples and found this update pixels function that was quote interesting. It was able to pick up my image and “redraw” a different size version of them? (please correct me).
Immediately I was faced with a problem that I would end up spending six hours to understand/figure out. I wanted the pixels to be animated but since I’m using it in the button element, it was only called once after I press the blue pill button. I could use the noLoop() and Loop() but since I have two choice outcomes and Loop() would loop the entire draw function, it was a no go. I sat there and wanted to figure out a way to make it work.
I started a completely different sketch, where conditional statements are used in stead of the button elements. It helped my mouse hover color changing design on the pills to show through since I don’t have to use noLoop() in setup. However, how to use the mousePressed() function as a start to the animation instead of it just playing once is still a question. I’m sure there must be a solution and I’m sooo eager to know.
After a couple hours of back and forth, I finally decided to go with the original sketch with buttons and move on to the red pill effect. I saw some great examples of the classic Matrix text animation, but unfornately they’re way too complicated for me so I decided to go with random poetry example. I also figured out how to upload a second image that can show up later. I made it darker so it looks like the button changed the brightness of the image.
And here we are...There were so many little details that I was not satisfied with, but I’m so happy that now I have a bunch of problems that can be explored.
SOLVED PROBLEMS
- tilt the pills graphics with translate() and how to use the correct coorindate for the positions after translate()
- how to add text to the sketch
- how to functionally use push() and pop()
- how to use noLoop() and Loop()
THINGS TO IMPROVE
- How to use the button element/conditional statments as a start for animation/repetitive elements when I have multiple choice outcomes that I do not want them both to show up with the loop() function?