![[OLD SEMESTER] 15-104 • Introduction to Computing for Creative Practice](../../../../wp-content/uploads/2023/09/stop-banner.png)
I looked into the FORMS String Quartet. As someone who is very much inspired by and interested in music, I’ve always looked for ways to combine visual art with music, beyond just the performative nature of music. Their website states that they make use of a spectral synthesis algorithm; to my understanding, the algorithm models speech, music, and other sounds by combining multiple sine wave harmonics. I believe Playmodes and the FORMS String Quartet create a perfect fusion between music and visual art, as well as digital and acoustic media, and in a way, it reminds me of the condition synesthesia, in which affected individuals associate sounds, visuals, and other input with colours.
Author: Lumi
Project-03-Dynamic-Drawing
sketch
//Nami Numoto
//Section A
function setup() {
createCanvas(600, 450);
background(0);
}
function draw() {
background(0); // initialize background
fill(255, 255, 0); // yellow
var m = max(min(mouseX, 600), 0); //restrict x to the canvas (600)
var size = m * 350.0 / 400.0; // manipulate sizes of the circles
ellipse(mouseX, mouseY, size, size); //yellow dot that follows mouse
fill(0, 0, 255); // blue
size = 400 - size;
ellipse((width - mouseX), (height - mouseY), size, size); //blue dot that follows mouse inversely sort of
}
// everything the mouse 'draws' or hovers (yellow dot) should be mirrored about the y axis by the blue dot
// make them change size contrarilyI wanted to go off of the example while keeping it original. I’ve always been intrigued by mirror images and reflections, so I decided to reflect the user’s mouse trails about the y-axis and practice using contrary sizing.
I’ve noticed that the blue ellipse is not showing up, although it works in my index.html file… trying to work that out still
LookingOutwards-03
I really appreciate the depth and negative space of this piece, and it reminds me of the example work from Prof. Levin’s article, PolyMorph.
Instead of a simply amorphous shape, however, this artist decided to arrange a face using the 3D interconnected units.
My favorite aspect is the use of spaces – despite there being so many small cavities, little distracts the viewer from the facial features.
While I’m not entirely sure the face is human and the uncertainty feels somewhat unsettling, there is also a dichotomous fullness and liveliness to the piece that brings me a sense of wonder, which is what I believe the artist was going for.
There’s a certain mix between realism and abstraction that makes this piece stand out.
LookingOutwards-02
https://www.drwoohoo.com/portfolio/semi-autonomous-brushstrokes
While the concept seems simple enough, the thing I admire most about Dr. Woohoo’s work is the dynamic nature of his generations.
There seems to be a level of randomness to his work, but there is also a sense of intentionality in the strokes, almost as if they did it by hand.
Perhaps the most impressive to me is his choice of colour palette, as they are mostly non-standard yet visually appealing.
They use a combination of vibrant and neutral colors that somehow don’t clash.
While I’m not sure exactly how the brushes work – I imagine they work somewhat similarly to Sketchbook custom brushes – I think there is a component creating an illusion both of direction and depth of movement.
Generative art seems to be the best way for Dr. Woohoo to express their vision – they seem to want to combine the ideas of DNA/RNA with art and vivid colours, and the generative art medium seems perfect.
Project-02-Face-Variables
sketch
//Nami Numoto
//15104 1A
// Simple beginning template for variable face.
var eyeSize = 20;
var faceWidth = 100;
var faceHeight = 150;
var noseWidth = 20;
var noseDirection = 0;
var noseHeight = 30;
var mouthPosition = 200;
var mouthHeight = 20;
function setup() {
createCanvas(300, 300);
}
function draw() {
strokeWeight(2);
background(180);
fill(156, 132, 104);
ellipse(width / 2, height / 2, faceWidth, faceHeight);
var eyeLX = width / 2 - faceWidth * 0.25;
var eyeRX = width / 2 + faceWidth * 0.25;
fill(255)
ellipse(eyeLX, height / 2, eyeSize, eyeSize); // eye 1
ellipse(eyeRX, height / 2, eyeSize, eyeSize); // eye 2
fill(0)
ellipse(eyeLX, height / 2, eyeSize / 2, eyeSize / 2); // iris 1
ellipse(eyeRX, height / 2, eyeSize / 2, eyeSize / 2); // iris 2
line(width / 2, height / 2, noseWidth + width / 2, noseHeight + height / 2); // directional nose line
line(width / 2, height / 2 + noseHeight, noseWidth + width / 2, height / 2 + noseHeight); // bottom nose line
noFill();
beginShape(); //creative rendition of a mouth, testing out curveVertex() :)
curveVertex(width / 2 - faceWidth / 3, mouthPosition + mouthHeight);
curveVertex(width / 2 - faceWidth / 3, mouthPosition + mouthHeight);
curveVertex(width / 2, mouthPosition);
curveVertex(width / 2 + faceWidth / 3, mouthPosition + mouthHeight);
curveVertex(width / 2 + faceWidth / 3, mouthPosition + mouthHeight);
endShape(); //sometimes the mouth goes off the face. call it art
}
function mousePressed() {
// when the user clicks, these variables are reassigned
// to random values within specified ranges. For example,
// 'faceWidth' gets a random value between 75 and 150.
faceWidth = random(75, 150);
faceHeight = random(100, 200);
eyeSize = random(10, 30);
noseWidth = random(10, 30);
noseDirection = random(0, 2);
if (noseDirection > 1) {
noseWidth = -1 * noseWidth;
}
mouthHeight = random(-10, 10);
}Project 1: My portrait :)
mnumoto-01-project
function setup() {
createCanvas(500, 400);
background(255, 189, 233);
text("p5.js vers 0.9.0 test.", 10, 15);
}
function draw() {
stroke(0); //initialize stroke colour
strokeWeight(3); //initialize stroke weight
//think in layers, like on sketchbook/photoshop. neck is base, shoulders/chest and head above that... so neck first.
fill(240, 201, 146); //skin colour
rect(225, 250, 50, 60); //neck rectangle
ellipse(250, 200, 100, 120); //face ellipse
fill(148, 148, 148); //shirt colour
rect(150, 303, 200, 100); //shoulders/chest rectangle
fill(20, 13, 6); //hair colour
rect(180, 180, 45, 180); //hair left
rect(270, 180, 45, 180); //hair right
triangle(183, 180, 250, 125, 225, 180); // top hair left
triangle(315, 180, 250, 125, 220, 190); // top hair right
fill(255); //colour for inside of glasses
ellipse(275, 220, 40, 40); //glasses left
ellipse(225, 220, 40, 40); // glasses right
line(240, 220, 260, 220); //connector
noLoop;
}
LO: my inspiration <3
My favourite video game is League of Legends, which I would consider to be a form of interactive and computational art. While it is mostly developer-driven,
one of the main reasons I came to love the game so much was Riot Games’ founding philosophy: to let the game be player-influenced and free to play. To my knowledge, Riot Games made the game entirely on their own, and the idea came from two bright minds fresh from developing a popular Warframe 3 mod, DOTA. It took four years to develop, and it was finally released in 2009. Having kept their loyal fanbase from DOTA excited for a new game, League of Legends was an instant success. Riot went from a small indie game company to a well-known studio, boasting a sizeable team of just under 3,000 employees.
League wasn’t the first game of its kind in any way. However, its incredible staying power has transformed the realm of possibilities for video games.
https://www.leagueoflegends.com/en-us/
Riot Games
