Casey Reas stands out not only for his artistic prowess but also for his extraordinary creativity. His work serves as a testament to his ability to push the boundaries of traditional artistic expressions and explore the intricate interplay between chance and order. From my perspective, machines are an ideal platform for unraveling the complex relationship between these two seemingly opposing forces.
Reas’ examples vividly illustrate how chance and order coexist harmoniously within the realm of code and machines. His artistry delves into the inner workings of algorithms, a domain often associated with rigid orderliness. Yet, within this structured framework, he manages to unleash the untamed power of randomness. Through the careful orchestration of algorithms, Reas reveals hidden patterns within chaos, offering a glimpse into the hidden harmony that underlies our seemingly chaotic world.
In conclusion, Casey Reas’ video presentations and artistic endeavors provide not only inspiring but also thought-provoking insights into the dynamic interplay of chance, order, and technology within the realm of art. His work encourages us to reconsider our preconceived notions about chaos and structure, inviting us to explore the fascinating territory where they converge. Through Reas’ pioneering work, we gain a deeper appreciation for the intricate dance between chance and order that shapes our world and enriches our understanding of art and creativity.
Casey Reas’s presentation provided a captivating exploration of the intricate relationship between randomness, computing, and art. His presentation invited us to question our fundamental assumptions about the inner workings of computing, the role of software, and how these concepts intertwine with diverse hardware platforms.
The heart of Reas’s talk in my perspective lay in his ongoing work over the past two and a half years, a collaborative project with esteemed authors. Through this project, Reas explored the 10-print algorithm outside the constraints of the Commodore 64’s hardware. This journey led him into the realm of Processing, where randomness took center stage.
One of the key takeaways was the revelation that in Processing, the entire image updates simultaneously, a stark contrast to the Commodore 64’s incremental character-based updates. This shift enabled Reas to manipulate randomness, adjust probabilities, control line thickness, and experiment with frame rates. These subtle alterations profoundly affected our perception of the generated art.
As the project progressed, Reas and his collaborators delved deeper into the creative potential of randomness. They introduced diverse color palettes, harnessed randomness to dictate the number of rows and line thickness, and unveiled a delicate balance between structure and serendipity driven by random values.
Reas’s talk culminated with a glimpse into his ambitious “Century” project. This ongoing endeavor aims to encapsulate a century of visual art by pixelating specific artists’ works and exposing the underlying algorithms. Users can interact with the piece, freezing frames and modifying parameters, providing a unique window into a century of artistic innovation.
What struck me most about Reas’s work was the juxtaposition of simplicity and complexity. His graphics, while minimalistic and seemingly primitive, encourage closer examination, revealing the intricate interplay of algorithms. “Century” serves as a testament to how random processes can yield profound insights and unique perspectives, all within the digital realm.
Casey Reas’s speech illuminated the potential of randomness in computing to generate art that defies conventions and provides new perspectives on creativity, technology, and the interplay between the two. His work stands as a testament to the limitless possibilities that arise when we explore the convergence of computing and randomness in the world of art.
Casey Reas’ video explores the evolution of serendipity and artistic expression from early 20th-century rebellious art movements to their current recognition in the art world. He delves into the complex relationship between serendipity and creative structure, emphasizing their impact on art.
Reas also discusses the significance of grid-like images in contrast to chaotic generative art, highlighting Rosalind Krauss’ critical perspective and emphasizing their importance both in aesthetics and metaphorically. He touches on how humans perceive order emerging from randomness and the concept of symmetry.
Additionally, Reas, a significant contributor to the development of Processing, explores the philosophy of art and technology. He argues that computers, although known to be organized, can surprisingly create random and chaotic art, linking these concepts to nature and science.
Personally, I share Reas’ perspective on machines being an ideal platform to explore the complex relationship between chance and order. His examples show how chance and order coexist within code and machines, even revealing patterns within chaos. In conclusion, Casey Reas’ video provides inspiring and thought-provoking insights into the interplay of chance, order, and technology in art.
Computer Art – Random Circle Poppers:
I was feeling confused and struggling to come up with a project idea. After some thought, I decided to create something simple yet visually captivating. The result was a colorful circle collage. It might seem unconventional, but it held a special significance for me. I used to have an inexplicable fear of multiple colored objects, and this project was my way of confronting that fear. Surprisingly, I found the combination of vibrant circles to be not only pleasing but also artistic. It reminded me that art can be found in the most unexpected places, even in something as seemingly mundane as a collection of colorful circles.
let circlesNumbers = 10; // Change this to the desired number of circles
function setup() {
createCanvas(400, 400);
background('white');
frameRate(5);
}
function draw() {
for (let i = 0; i < circlesNumbers; i++) {
r = random(0, 200);
g = 0;
b = random(300);
x = random(600);
y = random(400);
noStroke();
fill(r, g, b, 95);
circle(x, y, 35);
}
}
Reflection:
I tried to use the new “for” function we learned in class, but I had trouble understanding how to use it in my project. I did my best to learn it and include it my project somehow. I don’t consider myself an intermediate in coding yet, but I enjoy expressing my artistic ideas and learning more along the way.
I was inspired by old school computer graphics that you would see in movies like The Matrix. Because of this, I knew that I wanted to make some ASCII art in the signature green color that most retro graphics used. After some experimenting, I decided to make an ASCII representation of a Menger Sponge, which is a fractal geometry that I thought would be very interesting to look at.
Process
I began by creating a sample video that I could use to turn into ASCII art. To do this, I created a 3D cube in Processing, which is a predecessor of P5.js. I attempted to do this in P5.js, but found the saveFrame() function too limiting. I created a simple box using the 3D renderer in Processing, and added some lighting to give the sketch some dynamic range. This is important as I needed to use the difference in brightness later on when converting the video to ASCII, and the greater the dynamic range is the easier it is to perceive the ASCII video.
I incremented the rotation angle by a fraction of pi because I wanted to be able to count when the cube resets to its original position. This made it easier to create a video that could be looped seamlessly.
Once I had the output frames, I combined them together using Microsoft Movie Maker. The final result was this video:
Next, I wanted to work on converting this footage to ASCII art. I followed Daniel Schiffman’s coding challenge on creating ASCII text images. After experimenting with the video size and character density arrays, the following sketch was the result I got:
However, I wanted to create something a bit more complex. This is when I remembered an old project that I worked on by following another one of The Coding Train‘s challenges, which was the Menger Sponge coding challenge. After generating the frames and compiling them into a video, this was the result:
All I had to do then is to insert this video into the original code and play around with different parameters until I got the desired result.
Code Highlights
I’m really proud of the code that makes the animation look like its being built up slowly using ASCII characters. The way I achieved this is basically by filtering out the highlights on the Menger sponge. When I compiled the video, I saw that the lower right corner of the sponge had a bright highlight on it that was blocky.
//finding the right character based on brightness of pixel
let len = charArray.length;
let charIndex;
//playing with map values for the building up effect
charIndex = floor(map(apparentBrightness, 0, 100, len, 0));
When I filtered the brightest points of the sponge out, I essentially removed the lower left corner until it got a bit darker later in the animation, which created the building-up effect.
Reflection
Compared to the first assignment, I had a more solid idea of what I wanted to achieve. Because of this, I had planned out my workflow beforehand and that streamlined the entire creative process. I knew I had to create source animation and then convert it to ASCII characters. This made my code more readable, and I had better control of the sketch overall.
However, the building-up animation that I am most proud of is dependent on the source video. It looks the way it is because in the source animation the highlights are blocky as well. If I wanted to recreate this project, I want to work on some logic that allows the effect to be more generalizable. Maybe I could filter out sections of the object based on a distance function instead of the brightness levels. That way I can substitute different source videos and still get the cool effect.
Casey Reas’ video on chance operations provides insights into the role of chance and randomness in new media and art. While the emergence of chance in art was seen as a significant development through the dadaist, surrealist, and futurist movements of the early 20th century as a way of challenging the rational, ordered way of life, it is now a widely accepted and even popular form of art-making in today’s landscape.
I was fascinated by the distinction between randomness and order. Both, though completely opposite in my opinion, pave the way for modern art seen currently. Straying further away from the “naturalist” Renaissance paintings, both chaotic and mind-bending images, as well as grid-like ordered images, are the visuals of today. It was also very interesting when he brought Rosalind Krauss’ critique of the presence of such grid-like images in modern galleries. I personally feel that they are important both aesthetically and metaphorically, serving as a yin-yang to the chaos of generative art. The idea of duplication leading to order from randomness and the concept of symmetry is a very human-oriented perception of the world, and it feels like it has a much deeper rooted relation to us. As such, I don’t find such grid-like images to be devoid of humanity.
I found the video inspiring in multiple ways, particularly in how art can take different directions going forward. Upon further research, I discovered that Reas co-created Processing itself. His insights on the philosophy of generative art and chance operations kept me pondering the various ways nature can be represented in media.
The concept for my code was heavily inspired by the lighting and sound installation NOWISWHENWEARE by Andrew Schneider. After witnessing his installation multiple times over the last two weeks, I was inspired to create a floating grid that encapsulates the feeling of stars in the same way his installation did. While creating the animation, I was also reminded of and inspired by the early prototype computer graphics made by NASA and connected the imagery of a rotating space shuttle (I can’t remember which documentary I had watched it on) to the grid with sparkling stars.
After the rotating box was set, the sparkling stars were meant to represent the floating LED lights in Schneider’s installation. A constantly changing background hue was added to add dynamics, as well as a vintage, spacey color palette.
Highlight
for (let i = 0; i < numSpheres; i++) {
x = random(-boxSize, boxSize);
y = random(-boxSize, boxSize);
z = random(-boxSize, boxSize);
push();
translate(x, y, z);
sphere(boxSize / 500);
pop();
}
The highlight of the code, besides using the bouncing ball logic to change the background color, was creating the sparkling stars.
Using the aforementioned for loop in a WEBGL environment, I was able to instantiate a 3D grid of random sparkling stars.
Using push pop and translate functionality, I was able to save and restore values for each sphere on the grid. This allowed them to stay within the constraints of -boxSize to +boxSize, creating the illusion of being suspended in the box itself.
Reflection
I would love to add sounds to the animation, much like Andrew Schneider’s installation. Implementing a mouseX functionality that acts like the lanyard beeper present during guided tours would be a great next step to make dynamic changes in the 3D grid itself. Honestly, creating a 3D projection of this would be great as well, but I have no idea how to do that yet.
My objective of this self-portrait assignment was to create a dynamic and animated self-portrait, drawing inspiration from the style of cartoons. The core idea was to give the portrait an animated look by discarding outlines and instead focusing on bold strokes, vibrant colors, and animated elements. I wanted to add some personal character elements as well, such as my silver earrings and short lighter hair. I believe the eyeroll-like animation also matches my look, as I sometimes receive comments that I appeared as a traditionally mean and cold Eastern European when people would first see me, and that they would be proven wrong after a while. Since the overall look of the portrait is cartoonish, the mean eye-roll appears quite cute and ironic.
Here is the sketch:
That said, I was quite proud of the eyelash animation. I used iteration from -20 to 0 to create eyelashes above the eye, and by adding the lashSpacing I was able to separate them from each other. By using the map() function, I was able to calculate the position of one of the eyelashes. I used the cos() function to create a value that swings between -1 and 1 based on the angle (angle + i). I then mapped it to a range between -10 and 10 and created a centered motion around 0, giving the eyelashes a natural appearance. I then drew each eyelash separately using the lashX coordinates for the upper vertices of the lines.
// Adding eyelashes with animation and spacing
for (let i = -20; i <= 0; i += lashSpacing) {
// Calculate the x-coordinate for the first eyelash, centered around 0
let lashX1 = map(cos(angle + i), -1, 1, -10, 10);
//Separating by 10 pixels the other 2 eyelashes
let lashX2 = lashX1 + 10;
let lashX3 = lashX1 - 10;
stroke(0);
// Setting the thickness of the lines
strokeWeight(2);
// drawing the eyelashes
line(0, -16, lashX1, -25);
line(10, -14, lashX2, -25);
line(-10, -14, lashX3, -25);
}
pop();
I was also proud of the gradient code. I used a for loop again to blend the colors by calculating a color for every line of pixels on the canvas with the help of the lerpColor().
function draw() {
// Defining colors for the gradient
let color1 = color(0, 0, 139);
let color2 = color(100, 100, 255);
// Creating a gradient background. Iterating through each vertical line of pixels
for (let i = 0; i < height; i++) {
// mapping the current value of i from the range 0 to height to a new range from 0 to 1
let inter = map(i, 0, height, 0, 1);
// calculating a color for each line of pixels using the lerpColor function
let c = lerpColor(color1, color2, inter);
// setting the stroke color and drawing a line through full horizontal distance of the canvas
stroke(c);
line(0, i, width, i);
}
For future improvements, I would like to make the code cleaner and simpler, less repetitive. Exploring object-oriented programming techniques could be an intriguing strategy as well, which should help in making the code more organized.
In this assignment, I used loops and basic functions to show the hectic, vibrant, and bustling nightlife of New York City. I wanted to express how I felt when I saw the night sky view of NYC.
I was captured by NYC’s iconic skyline, which is illuminated by countless skyscrapers, billboards, and streetlights. The city’s streets and buildings are bathed in a sea of lights, creating a dazzling and energetic atmosphere. Times Square, in particular, is known for its vibrant, neon-lit signs and bustling nightlife.
Even the moon is vibrantly moving in NYC. The night view of NYC is indeed hectic, but it’s also a unique and exciting experience for visitors and residents alike. When I saw numerous buildings in the skyline, I felt that not only New Yorkers, but everything in NYC kept changing. The city’s energy and vibrancy come to life after dark, offering a wide range of activities and entertainment options to suit every taste.
The highlight of My Code
// Draw cityscape buildings
fill(100); // Building color
for (let x = 50; x < width; x += 100) {
let buildingHeight = random(100, 300);
rect(x, height - buildingHeight, 80, buildingHeight);
// Windows in buildings
for (let y = height - buildingHeight + 20; y < height - 20; y += 40) {
for (let i = x + 10; i < x + 80; i += 20) {
fill(random(0,200, 255), random(0,200, 255), 0); // Random yellowish lights
rect(i, y, 10, 10);
}
}
}
The code then enters a nested loop structure using two “for” loops:
The outer loop, for (let x = 50; x < width; x += 100), iterates horizontally across the canvas starting at x = 50 and continuing until it reaches the canvas width. This loop defines the x-coordinate of the buildings, with a gap of 100 pixels between each building.
Inside the outer loop, there’s an inner loop: for (let y = height - buildingHeight + 20; y < height - 20; y += 40). This inner loop iterates vertically within each building. It starts at a height just above the building’s base and ends just below the top edge of the building. It defines the y-coordinate for the windows, with a gap of 40 pixels between each row of windows.
Furthermore, fill(random(0,200, 255), random(0,200, 255), 0); this line sets the fill color for each window to a random yellowish color. The random() function is used to generate random values for the red (0-255), green (0-200), and blue (0) components of the color, creating a range of yellowish shades. The 0 in the fill() function is for the blue component, making the color closer to yellow.
The combination of these loops and drawing commands results in a cityscape with randomly sized buildings and rows of randomly colored windows, giving the appearance of city lights in the evening.
Reflection and Ideas for Future Work
There are several ways to enhance this artwork. For instance, I could add more complex building shapes, introduce different lighting effects, or simulate perspective to create a more three-dimensional look. Also, I will design a cityscape that can potentially convey a narrative or mood next time. I could add New Yorkers in these buildings, adjust the colors, or arrangement of windows to evoke specific emotions and tell a story about the city and its inhabitants.
p5.js assignment#1 was an entirely jarring, anxiety-inducing experience. I severely struggled with understanding javascript code and hence this assignment felt like the biggest milestone. Whilst I still feel that to some extent I don’t entirely understand p5.js coding, I tried to adapt the best I could, within limited time constraints, by using a mixture of simple shapes and what I consider some high level codes to conjure a self-portrait.
I had the hardest time with determining the correct coordinates and so there were lots of trial and error in placing shapes and curves, specifically with the bezier() function. The double eyelids were the hardest to recreate and therefore took considerable time perfecting them. Once I had established a desirable curve I used the translate() function to transfer it to my right eye. Any features that required the bezier()/ beziervertex() function I was proud of:
Through the fill()/ nostroke()/ translate() functions, I was able to discover and utilise the push() and pop() functions, which corrected many placement/ color errors that tended to occur. To compensate the lack of an interactive quality, I put substantial care into the aesthetics of the self-portrait. If I had a little more time, I would have loved to dabble in javascript coding for adding loops. Making the clouds move repeatedly would certainly make this assignment a more dynamic piece.
In this video, Casey Reas explains how to establish a set of rules that govern how shapes, colors, and patterns are generated, while also introducing an element of randomness or chance into the process. He believes that the tension between control and chaos can produce visually captivating compositions. His artwork series creates generative art using custom software that blends strict rules with randomness. It starts with clear guidelines for shapes, colors, and patterns but adds unpredictability through algorithms. Reas essentially acts as both an artist and a programmer, setting the stage for a unique creative process. What makes this series particularly intriguing is Reas’s intentional introduction of randomness and chance operations through algorithms. This deliberate juxtaposition of control and chaos allows for a dynamic interplay that results in a captivating array of visual outcomes.
After I watched this video, I could think of “No. 5, 1948”, an iconic abstract expressionist painting by American artist Jackson Pollock. Even this painting is pretty old and not painted by AI or software program, this painting could be one of the original paintings that explores the interplay between control and chaos, order and randomness. In this painting, it seems very messy and has no orders. However, his control over his movements and the flow of paint from his brushes or cans is evident in the deliberate calculated way he approached his paintings. His unique “drip painting” technique, in which he poured or dripped paint onto a canvas placed on the ground, allows gravity and chance to play a significant role in the creation of his artworks. I believe that this old artwork can inspire modern artworks using software programs.
