just my lil German boy
// Sowang Kundeling Section C Project 11
var backgroundX = 355;
var foregroundX = 250;
function preload() {
germanboy = loadImage("https://i.imgur.com/8g7kXHX.png");
neighborhood = loadImage("https://i.imgur.com/ueqfD0Q.png");
house = loadImage("https://i.imgur.com/VeVnWaO.png");
montain = loadImage("https://i.imgur.com/xImWYKs.png");
long = loadImage("https://i.imgur.com/6kAoEti.png");
short = loadImage("https://i.imgur.com/hGhArWq.png");
}
function setup() {
createCanvas(480, 240);
}
function draw() {
// sky
noStroke();
fill(180, 227, 242);
rect(0, 0, 480, 25); // x7
fill(163, 194, 207);
rect(0, 25, 480, 25);
fill(137, 165, 176);
rect(0, 50, 480, 25);
fill(121, 146, 156);
rect(0, 75, 480, 25);
fill(98, 119, 128);
rect(0, 100, 480, 25);
fill(79, 95, 102);
rect(0, 125, 480, 25);
fill(60, 74, 79);
rect(0, 150, 480, 25);
imageMode(CENTER);
// background elements
for (var i = 0; i < 2; i ++) {
image(short, backgroundX - (i * 150), 159, short.width/2, short.height/2);
image(long, (backgroundX + 90) - (i * 200), 145, long.width/2, long.height/2);
}
// land
fill(107, 96, 81);
rect(0, 175, 480, 65); // land
// foreground elements
image(montain, foregroundX-120, 115, 265, montain.width/4, montain.height/4);
image(neighborhood, foregroundX - 140, 137, neighborhood.width/2, neighborhood.height/2);
image(house, foregroundX + 250, 140, house.width/4, house.height/4);
image(germanboy, 100, 200, germanboy.width/2, germanboy.height/2);
backgroundX -= 1;
foregroundX -= 1;
// reset
if (backgroundX <= -300) {
backgroundX = 900;
}
if (foregroundX <= -300) {
foregroundX = 825
}
}NFTs have created vast spaces in which artists can get well deserved and long overdue compensation for their labor. Historically, digital art and media has been free for use on the Internet because of the high shareability and the ability to just copy and paste. NFTs encourage artists to be more creative as there is a space for reward and the Internet is limitless. However, NFTs do have a lot of societal and environmental downsides. Some works get plagiarized and sold, and copyright laws are blurred in the new space. NFTs also require a lot of compusing power and server farms are powered by fossil fuels. While there may be an assumption that online art is more environmentally friendly, it is actually quite the opposite.
]]>Under the sea! My 5 characters are the ocean, jellyfish, fish, big whale, and small whale.
// Sowang Kundeling Project 10 Section C
var count = 0;
x = 50
var count = 0
function preload() {
ocean = loadSound("http://localhost:8887/ocean.wav");
low = loadSound("http://localhost:8887/low.wav");
bubble = loadSound("http://localhost:8887/bubble.wav");
high = loadSound("http://localhost:8887/high.wav");
splash = loadSound("http://localhost:8887/splash.wav");
sea = loadImage("https://i.imgur.com/cDVwxGl.jpg");
big = loadImage("https://i.imgur.com/3j8OG8S.png");
little = loadImage("https://i.imgur.com/eBmN7hL.png");
jellyfish = loadImage("https://i.imgur.com/LbEcOSU.png");
fish = loadImage("https://i.imgur.com/FSQzu31.png")
}
function soundSetup() {
ocean.setVolume(.1);
low.setVolume(.3);
bubble.setVolume(.1);
high.setVolume(.3);
splash.setVolume(.1);
}
function setup() {
createCanvas(sea.width, sea.height);
frameRate(1);
useSound();
}
function draw() {
image(sea, 0, 0, sea.width, sea.height);
ocean.play();
if(count == 2 || count == 16) {
low.play();
} else if(count == 4 || count == 18) {
bubble.play();
} else if (count == 10 || count == 25) {
high.play();
} else if (count == 1 || count == 30 || count == 15) {
splash.play();
}
if(count >= 5) {
image(big, 20, 50, big.width/4, big.height/4);
} if(count >= 10) {
image(little, 400, 200, little.width/2, little.height/2);
} if(count >= 4) {
image(jellyfish, x, 300, jellyfish.width/4, jellyfish.height/4);
} if (count >= 15) {
image(fish, mouseX, mouseY, fish.width/6, fish.height/6);
}
count++
x += 2
print(count);
}Heather Kelley is one of the five most powerful women in gaming and the most influential women in technology. She holds an MA from the University of Texas at Austin and is an Associate Teaching Professor at Carnegie Mellon University’s Entertainment Technology Center. Her works as Perfect Plum focus on under-explored aesthetic experiences and sensory interactions.
In particular, I admire her creative expression and how she creates interactive pieces that relate to society and individuals. Specifically, I admire these aspects because they enhance the person’s experience and interaction with the work. To elaborate, I want to highlight her work in interaction design. Specifically, the “Tre Pas (Version Musicale),” creates an interactive piece where it can be described as an extremely long hopscotch as each series triggers an interactive musical composition. This is one of the many examples of her work where she cleverly creates a piece that is not only intriguing but also captures the individual’s attention by having them interact with it.
Overall, Heather Kelley has an impressive background and I would highly recommend taking a look into the work she has done as it’s something work interacting with and experiencing.
I wanted to create a portrait with my fav words and cute text faces! When the mouse is pressed, the pixel colors are in black and white.
Here is how it looks after some time.
// Sowang Kundeling Project 09 Section C
var img;
var imgbw;
var texts = ["( ͡° ͜ʖ ͡°)", "(づ｡◕‿‿◕｡)づ", "(◕‿◕✿)", "(ᵔᴥᵔ)", "♥‿♥", "~(˘▾˘~)", "ᕦ(ò_óˇ)ᕤ", "(｡◕‿◕｡)", "ʕ•ᴥ•ʔ", "corn", "taco", "cat"];
function preload(){
//load image
img = loadImage("https://i.imgur.com/1V17iyS.png");
imgbw = loadImage("https://i.imgur.com/qedFJ3f.jpg")
frameRate(10000);
}
function setup() {
createCanvas(350, 350);
//img.resize(450, 450);
//imageMode(CENTER);
//textMode(CENTER);
}
function draw() {
//image(img, 0, 0, 400, 400);
var x = random(img.width); // random coordinate for the pixel
var y = random(img.height);
var pixelColor = img.get(x*5, y*5); // pixel color
var pixelColorbw = imgbw.get(x*5, y*5) // black and white pixel color
if(mouseIsPressed) { // creates black and white pixels when mouse is pressed
fill(pixelColorbw);
}else {
fill(pixelColor);
}
strokeWeight(random(5,20));
textSize(random(5, 20));
text(random(texts), x, y);
}The speaker that I chose is Sasha Constanza-Chock on Design Justice. They are an associate professor at MIT and a non-binary trans-identifying person. Sasha is currently the Head of Research & Sensemaking at OneProject.org and an associate professor at Northeastern for Arts, Media, & Design. Sasha starts off by recounting a story about going through airport security, already apprehensive of what is to come. The TSA scan operator was prompted to choose either “male” or “female” on the UI. While Sasha presents as a woman, the millimeter scan labeled Sasha otherwise. Either way, Sasha is read by the technology as “risky” and is immediately flagged. Sasha’s story leads to design justice and dismantling oppressive design structures. Sasha is an effective communicator for their sincerity and detailed breakdown of topics. They wrote a book called Design Justice, breaking down community-led practices and how they can be reformed to be more inclusive. Sasha’s personal story was very digestible so that the audience can empathize and understand the issue at hand.
logarithmic spirals!
// Sowang Kundeling skundeli Section C Project 07
var theta; // angle from x-axis
var r; // dist from the origin
var nPoints = 700;
function setup() {
createCanvas(480, 480);
angleMode(DEGREES);
}
function draw() {
background(28+mouseY, 74, 55+mouseX); // green
strokeWeight(2);
startAngle = constrain(mouseY, 100, 100);
// spirals
stroke(110, 53, 140); // dark purple
logSpiral(mouseY, startAngle);
stroke(199, 129, 227) // light purple
logSpiral(mouseY, startAngle+20);
stroke(76, 63, 152) // dark blue
logSpiral(mouseX+25, startAngle+40);
stroke(136, 128, 224) // light blue
logSpiral(mouseX+50, startAngle+60);
stroke(176, 69, 149) // pink
logSpiral(mouseX+75, startAngle+85);
stroke(224, 110, 196) // pink
logSpiral(mouseX, startAngle+95);
}
function logSpiral(r, theta, color) { // logarithmic spiral
noFill(); // use noFill or else only one line is shown
var a; // arbitrary constant
var b; // arbitrary constant
beginShape();
for (i=0; i < nPoints; i++) { // apply nPoints onto spirals
a = (width/2) + (r+i) * cos(theta+3*i);
b = (height/2) + (r+i) * sin(theta+3*i);
vertex(a, b);
}
endShape();
}Stefanie Posavec is a designer, artist, and author. Her mission is to push different ways in which data can be communicated to a diverse range of ages and audiences. What especially intrigued me about her is that her projects are “wearable or danceable, be found in hospitals, museums, or on television.”
An example of the wearable aspect of her work is “Air Transformed: Better with Data Society Commission”. This series is a collection of wearable air quality data, initiating a conversation about air pollution. My favorite piece is “Seeing Air”. The projects consists of 3 pairs of glasses, each pair demonstrating the levels of air pollution on a different day in Sheffield in 2014. Each pair of sunglasses also signifies a different type of pollutant: nitrogen dioxide, small particulates, and large particulates.
sleeping earth, suns, moons, and stars!
// Sowang Kundeling skundeli Section C Project 05
var angle = 0;
var x = 480/2;
var y = 480;
var z = 60; // size
function setup() {
createCanvas(480, 480);
}
function draw() {
background('black');
push();
frameRate(1);
translate(240, 480);
rotate(radians(7) * second());
galaxy();
pop();
noStroke();
fill('black')
var eyeLX = x + 60
var eyeRX = x - 60
ellipse(eyeLX, y-60, z+10, z); // left eye
ellipse(eyeRX, y-60, z+10, z); // right eye
fill(9, 130, 13);
ellipse(eyeLX, y-75, z+15, z); // cut out left eye
ellipse(eyeRX, y-75, z+15, z) // cut out right eye
push();
frameRate(1);
translate(x-120, y-350);
rotate(radians(5) * second());
star(0+minute(), 0+minute(), 10, 30, 5); // left star
pop();
push();
frameRate(1);
translate(x+120, y-380);
rotate(-radians(5) * second());
star(0+minute(), 0+minute(), 5, 20, 5); // right star
pop();
}
function galaxy() {
// earth
translate(-240, -480);
fill(9, 130, 13); // green
noStroke();
circle(x, y, z*5);
// yellow
noStroke();
fill(245, 206, 51); // yellow
circle(x, y-200, z);
fill(242, 221, 136); // inner yellow
circle(x, y-200, z/2)
// orange
fill(245, 145, 51); // orange
circle(x+200, y, z);
fill(242, 188, 138); // inner orange
circle(x+200, y, z/2);
// dark blue
fill(74, 51, 245); // dark blue
circle(x, y+200, z);
fill(167, 156, 247); // inner dark blue
circle(x, y+200, z/2);
// light blue
fill(150, 198, 250); // light blue
circle(x-200, y, z);
fill(211, 227, 245); // inner light blue
circle(x-200, y, z/2)
}
function star(x, y, radius1, radius2, npoints) { // reference star https://editor.p5js.org/p5/sketches/Form:_Star
fill(241, 242, 153)
let angle = TWO_PI / npoints;
let halfAngle = angle / 2.0;
beginShape();
for (let a = 0; a < TWO_PI; a += angle) {
let sx = x + cos(a) * radius2;
let sy = y + sin(a) * radius2;
vertex(sx, sy);
sx = x + cos(a + halfAngle) * radius1;
sy = y + sin(a + halfAngle) * radius1;
vertex(sx, sy);
}
endShape(CLOSE);
}Manolo Gamboa Naon is a creative coder from Argentina with a focus on generative visual aesthetics. Through the combination of image and video, he strives to discover the line between chaos and order. In his piece Manoloide, Last Flowers, he displays selections of different variations of black, red, yellow, white, and blue. The pieces look like acrylic paint lathered onto a canvas, giving the illusion of texture. The shapes are also flower-like and fragmented, with no shape repeating. Naon certainly achieves an organized chaos in his work, with the feeling of a pattern but no exactly repeating imagery. You can also see where the colors ever so slightly blend together to create fine lines.
