These articles talk about how the shuffle mode in the music streaming app such as Spotify seems to be random when it is not actually so random. Despite the fact that people use shuffle mode to discover new music, they often realize same musicians appearing over and over and abruptly conclude that there is a certain pattern in algorithm. Soon, many complaints were made by Spotify users and various conspiracies arose that the company was advocating certain musicians only. However interestingly, the playlist the Spotify provided were actually random. It was just that the people didn’t find it random enough. The article focuses that there is a clear difference between the true randomness vs randomness that people conceive. This may be similar to other media that deals with randomness. For example, although Jackson Pollock’s painting may seem random at first glance, there still are many biases and certainties actively decided by the vision of the painter. Therefore, the same logic applies to the music streaming apps. The developers carefully articulate the randomness of shuffle mode so that the people can feel the right randomness.
var circlecenter = 0;
function setup() {
createCanvas(480, 480);
}
function draw() {
// variables for time, hour, minute, second
var h = hour();
var m = minute();
var s = second();
// variables for color mapping
var colorR = map(h, 0, 23, 0, 255);
var colorG = map(m, 0, 59, 0, 255);
var colorB = map(s, 0, 59, 0, 255);
// variables for lighter color mapping
var lightcolorR = map(h, 0,23, 180, 255);
var lightcolorG = map (m, 0, 59, 180, 255);
var lightcolorB = map (s, 0, 59, 180, 255);
// time keeping seconds
var exactSecond = (h*60)+(m*60)+s;
// background to change color as day progresses
background(colorR, colorG, colorB);
// interlapping pattern of circles that change color with the time
for (var y = 0; y < height+50; y += width/2) {
for (var x = 0; x < width+50; x += width/3) {
fill(255-colorG,255-colorB, 255-colorR,30);
ellipse(x, y, width/2, width/2);
noStroke();
}
}
// tiny little dots
for (var y = 0; y < height+10; y += 2) {
for (var x = 0; x < width+50; x += 2) {
fill(lightcolorR,lightcolorG,lightcolorB);
ellipse(x, y, 1, 1);
noStroke();
}
}
// mapping for exact second along the x axis
var secondMapX = (exactSecond, 0, 86400, 0, width);
// mapping for exact second along the y axis
var secondMapY = (exactSecond, 0, 86400, 0, height);
// circle for current second
ellipse(secondMapX,secondMapY,2,2);
fill(255, 255, 255);
}
I wanted to create a clock that emphasized how time is a fluid progression of movement, difficult to conceptualize at times. I decided to do this through a slow gradient of color, that shifts with the time. I wanted to create something that would emphasis both the fluidity of time, as well as how it can be broken into the tiniest of chucks. I did this through overlaying the smallest of dots on top of the work.
Ideally, I would like to make a clock that was rooted to the moon cycles of Lithuania, where my family is from. I think it would be interesting to show how our ancestry, what we adopt from those before us roots us especially in the way it affects our unconscious and when we sleep. I had some trouble figuring out how to embed API data into processing, but I would love to learn this sometime.
Mark Wilson is a digital artist that self learned programming to create computer-generated works. He wrote his own software after buying his own microcomputer. His work combines human and machine decisions by having a combination of intricate design and random generation.
e4708
His project e4708 is very geometric. It consists of overlapping circles and rectangles in many neon colors. There are patterns, but there are also random inconsistencies. He created this image by running and rerunning random generating computer software. After selecting successful images, he weaved them together to create patterns.
/* Charmaine Qiu
charmaiq@andrew.cmu.edu
section E
project 06, Abstract Clock */
function setup() {
createCanvas(300, 300);
}
function draw() {
background(255,200,200);
// Fetch the current time
var H = hour();
var M = minute();
var S = second();
//variables that fits the time into certain coundaries
var poolW = map(M, 0, 59, 70, width);
var eyesH = map(H, 0, 23, 30, 1);
noStroke();
//creating the elements of the girl that does not change over time
//body
fill(252, 73, 3);
ellipse(width / 2, height, 130, 200);
//face
fill(255, 238, 227);
ellipse(width / 2 - 40, height / 2 + 20, 30, 30);
ellipse(width / 2 + 40, height / 2 + 20, 30, 30);
ellipse(width / 2, height / 2, 100, 120);
angleMode(DEGREES);
//hair
fill(245, 108, 66);
arc(width / 2, height / 2, 110, 140, -180, 360);
ellipse(100, 90, 50, 50);
ellipse(200, 90, 50, 50);
//mouth
arc(width / 2, height / 2 + 50, 40, 50, -180, 360);
//table
fill(201, 150, 113);
rect(0, 250, width, 70);
//HANGRY
fill(255, 238, 227);
//("HANGRY", width / 2 - 23, 140);
text("When is my FOOD coming?", width / 2 - 70, 40);
//when it is midnight, "HANGRY" appears on the head
if (H == 59){
text("HANGRY", width / 2 - 23, 140);
}
//drooling drops that falls down every second
push();
translate(160, 200);
m = floor(millis()) % 1000;
m = map(m, 0, 1000, 0, 200);
fill(147, 206, 237);
ellipse(0, m, 7, 7 + m * 7 / 200);
pop();
//the pool gets gets larger as a minute goes by
fill(147, 206, 237);
ellipse(width / 2, height, poolW, 50);
//the eyes becomes smaller as hours in a day pass by
fill(80);
ellipse(width / 2 - 20, height / 2 + 15, 10, eyesH);
ellipse(width / 2 + 20, height / 2 + 15, 10, eyesH);
}
This project is very interesting since I was able to design and compute a graphic that evolves around time. I took the idea of creating a literal clock further by creating a narrative to my work.
I have always wanted to try living without knowing what the time is. How can I make a clock that doesn’t tell me the time? The way I started brainstorming for this was quite simple. Time would be represented through a greyscale spectrum. I wanted to go as abstract and clean as possible, which was at first, just three squares.
First iteration: three squares.
Through this, I wanted to represent time in color, simply by changing the shade of the squares every second minute and hour.
I liked this solution because it was as clean, modern, and abstract as possible. You can’t actually know what second it is in any way; it is only dictated by a spectrum.
I began to further develop this solution by adding the factor of length so that the rectangle grows as time passes.
Finally, I added the concept of “time is a social construct”. “Time is” is always there in black, but the answer changes as time passes. In the beginning of the hour and minute, the shades of the second and minute are the darkest, and as time passes, they fade away. Inversely, the answer “a social construct” becomes darker as time passes.
//alcai@andrew.cmu.edu
//project6 abstract clock
//section E week 6
function setup(){
createCanvas(500,500);
}
function draw() {
strokeWeight(0);
background('white');
//variables for time
var s = second();
var m = minute();
var h = hour();
//second rectangle grows per second and gets lighter, at 60 seconds it is white
fill(255/60 * s);
rect(width/4, height/2 - 50, 40,40 + 3 * s);
//minute rectangle grows per minute and gets lighter at the pace of the second rectangle
fill(255/60 * s);
rect(width/2, height/2 - 50, 40, 40 + 3 * m);
//hour rectangle grows per hour and gets lighter at the pace of the minute rectangle
fill(255/60 * m);
rect(width/4 * 3, height/2 - 50,40,40 + 3 *h);
//time is... is always black, but "a social construct" gets darker by the second, inverse to the actual time rectangles.
textSize(32);
fill(0);
text('TIME IS...', width/4, height/2 - 100);
fill(255 - 255 / 60 * s);
text('A SOCIAL CONSTRUCT', width/4, height/2 - 75);
}
//Stefanie Suk
//15-104 D
//ssuk@andrew.cmu.edu
//Project - 06 - Abstract Clock
function setup() {
createCanvas(480, 480);
}
function draw() {
background(5, 0, 50); //background color
fill(50); //color of buildings
noStroke();
rect(10, 350, 120, 150);
rect(30, 280, 30, 150);
rect(80, 260, 60, 220);
rect(80, 240, 20, 20);
rect(360, 380, 110, 130);
rect(385, 300, 60, 220);
rect(405, 220, 20, 220); // buildings in background
fill(238, 232, 37);
ellipse(400, 60, 70, 70); //moon
fill(218, 214, 85);
ellipse(300, 50, 5, 5);
ellipse(270, 74, 5, 5);
ellipse(130, 50, 5, 5);
ellipse(20, 80, 5, 5);
ellipse(360, 100, 5, 5);
ellipse(70, 160, 5, 5);
ellipse(230, 140, 5, 5);
ellipse(443, 170, 5, 5); //stars
var H = hour();
var M = minute();
var S = second();
var buildingH = map(H, 23, 0, 280, 0);
var buildingM = map(M, 59, 0, 280, 0);
var buildingS = map(S, 59, 0, 280, 0);
var change = 150/3;
fill(230);
rect(155, 200, change, buildingH);
fill(230);
rect(175+change, 200, change, buildingM);
fill(250);
rect(195+2*change, 200, change, buildingS); //ticking building that represents time, referenced code given in the instructions
}
I thought a lot about how I can represent time without making the clock too literal. I personally think the hardest part about this project was to think of how I can represent my clock than actually creating it. As I was thinking about what to create late at night, I looked outside the window and saw buildings across from my dorm. This struck me hard as I realized how much time I spend working at night. Every time I work at night, I tend to look outside the window once in awhile because I get tired as time passes by. I feel like I’m more aware of ‘time’ during the night than the day, which is why I decided to create a visual of a night cityscape I see outside the window and use the tall buildings as an indicator of time (building is forming as time goes).
Natalie Stopka is an artist who focuses on the creative process from the materials and forces of the natural world. One of the art techniques she likes to use in her work is marbling, which is a method of creating “random” pattern designs using color and water. This method is the result of floating color onto the surface of the water, then transferring the pattern to an absorbent surface, like paper or fabric. Marbling is a perfect definition of randomness because the artist never has full control over the design. Although the artist may be able to create designs using a sharp utensil to form patterns on the color, every single drop of color the artist puts on the water spreads differently throughout the surface. The direction, size, and color changes every time the color is dropped onto the surface of the water, and I think this marbling method effectively uses randomness to create unique patterns. Natalie Stopka’s marbling artwork shows a perfect example of the use of random movements from the natural force of color.
The lime represents the hour, and a slice is eaten every hour. The watermelon represents the minute, and a slice is taken every minute. Similarly, the orange represents the seconds and a slice is taken every second. The fruit resets every minute/hour/day.
This was a very fun project to do, both in drawing the actual fruits and figuring out how to take a slice from each every second/minute/hour. It was interesting to learn about the time functions and how to creatively implement them into the project. Finally, I was really happy with the way it turned out.
This week, I found the work of Holger Lippmann. Lippmann uses a rework of an ongoing script to slowly morph lines and curves into landscape paintings.
Most of the technical aspects are pretty simple, adding a mix of ellipses, noise, and color arrays. He also notes that these numbers are randomly generated, and he creates these drawings by sorting the values and allowing the randomness to blossom.
I always find computational designs so interesting, as changing just one aspect of the control can play a discernible role in changing the project completely.
35 years ago, Ken Perlin won an academic award for discovering a technique now called “Perlin Noise.” It is defined as a type of gradient noise that interpolates random values to create smooth transitions through the noise function. While it is readily controllable, Perlin Noise can also be embedded flexibly into other mathematical expressions to create a wide range of textures that imitate the controlled random appearance of textures in nature.
Thus, this technique is a powerful algorithm that is used in methodical content generation, particularly popular in visual media from games to movies for adding realistic randomness to CG renderings of smoke, fire, and water. Likewise, the bottom artworks “Perlin Noise Patterns” by the artist Martin Tinram really inspired me, especially with how delicate and sophisticated the texture are rendered. It was astonishing how they were computer generated, as they looked so detailed and realistic, almost like photographs. The effects are mostly present in the 2nd and 3rd dimension, although it could be extended into the 4th dimension as well. With this, I learned how significant randomness can be in computation and design, as it could be both readily controlled for specific aesthetic results, yet unprecedented at the same time.
![[OLD FALL 2019] 15-104 • Introduction to Computing for Creative Practice](../../../../wp-content/uploads/2020/08/stop-banner.png)
