Author: Heysu Oh

Looking Outwards 04: Sound Art

Reading this week’s topic about automated emulations of music style was very interesting. Considering the evolution and how far music has come and applying it to this week’s topics are thought provoking. After reading more articles about this topic I learned more about simple harmonic motions and how the sounds we hear are actually fluctuations in air pressure, tiny variations from normal atmospheric pressure, cause by vibrations. This reminded a lot of when I took AP physics in high school and went over the sound waves unit. The continuous rise and fall in pressure are what creates the waves of sound. Contemporary technology has evolved dramatically as now digital music technology is possible. Digital music is a method of representing sound in numerical values and is often synonymous with MP3 music as its a common file formate which digital music exists in.

Project-03: Dynamic Drawing

sketch
var angle = 0;
function setup() {
    createCanvas(600, 450);
    rectMode(CENTER);
}

function draw() {
    background(0);
    fill(255, 255, mouseY);
    // restrict mouseX to 0-400
    var m = max(min(mouseX, 400), 0);
    var size = m * 350.0 / 400.0;
    if (mouseX < width/2) {
        push(); 
        translate(150,200);
        rotate(radians(angle)); 
        rectMode(CENTER);
        rect(10 + m * 190.0 / 400.0, 200.0,
         size, size);
        pop();
        angle += 5;
} 

    else {
        rect(10 + m * 190.0 / 400.0, 200.0,
         size, size);
}

    fill(mouseX, 0, 255);
    size = 350 - size;
    rect(200 + m * 190.0 / 400.0, 200.0,
         size, size);


// } else if (mouseX > width/2) {background (0,0,200)}

}

Looking Outwards 03: Computational Fabrication

Looking through the information about digital fabrication was very interesting to visually see and comprehend. A lot of the pieces reminded me of the third lab assignment we had this week. The random circles and colors compiled together looked similar to the modules in all the photos. Since there are multiple pieces and artists, I chose one project in specific: “Wood Skin Material”. The use of modules and scoring allows wood to become like a “skin-like” material which moves as a malleable blanket would. The “Wood Skin” adapts to each shape while also being able to generate new ones with its flexibility: giving designers freedom of expression with material. I am curious as to what physical designs this can be used for, for my freshman year in design there was a project where the class had to create environmental spaces with the use of simple shaped modules. The result of the project was alike to that of the “Wood Skin”. With just one repeated shape can create more interesting structures by bending, adding, etc.

https://www.behance.net/gallery/14217091/Wood-Skin-Material

Project-02: Variable Faces; Face Variables

sketch
var eyeSize = 20;
var faceWidth = 100;
var faceHeight = 150;
var facecolorR = 30;
var facecolorG = 60;
var facecolorB = 120;
var noseA = 30;
var noseB= 20;
var mouth = 40;
var mouthWidth= 20
var mouthHeight= 60
var eyebrowWidth = 50
var eyebrowHeight = 30
var eyecolorR = 70
var eyecolorG = 90
var eyecolorB = 240
function setup() {
    createCanvas(300, 300);
}
 
function draw() {
    background(180);
    fill (facecolorR,facecolorG,facecolorB);
    ellipse(width / 2, height / 2, faceWidth,  faceHeight);
    fill (eyecolorR, eyecolorG, eyecolorB);
    var eyeLX = width / 2 - faceWidth * 0.25;
    var eyeRX = width / 2 + faceWidth * 0.25;
    ellipse(eyeLX, height / 2, eyeSize, eyeSize);
    ellipse(eyeRX, height / 2, eyeSize, eyeSize);
    triangle(width/2,height/2,140,170,160,170); 
    //i could not get the nose to change without making it pinocchio 
    ellipse(width/2,190,mouthWidth,mouthHeight);
    rect(115,120,eyebrowWidth, eyebrowHeight);
    rect(170,120,eyebrowWidth, eyebrowHeight);

}

 
function mousePressed() {
    faceWidth = random(75, 150);
    faceHeight = random(100, 200);
    eyeSize = random(10, 30);
    facecolorR = random(5,10,40);
    facecolorG = random(300,10,2);
    facecolorB = random(50,250,20);
    mouthWidth = random (12,20);
    mouthHeight = random (0,20);
    noseA = random(140,180);
    NoseB = random(140,170);
    eyebrowWidth = random(10,20);
    eyebrowHeight = random(2,8);
    eyecolorR= random(0,300);
    eyecolorG= random(20,300);
    eyecolorB= random(4,200);

}

Looking Outwards 02: Generative Art

https://www.dataisnature.com/

I have always found the idea of math and data present in nature and art very fascinating. In my previous design courses there was always a mention of how the forms of nature can be an inspiration to art. A specific example would be the classic Apple logo. The logo follows the golden ratio: a ratio of a line segment cut into two pieces of different lengths where the ratio of the whole segment to that of the longer is equal to the ratio of the longer to the shorter. The golden ratio is found in everyday applications/programs along with natural elements we see. Apart from the technological incidences, the golden ratio is present all around campus: leaves, flowers, ants, bees, cicadas, etc. After reading the article “Data is Nature” I found a more profound interest in finding these mathematical elements in daily life.

Project 1: My Self Portrait

sketch
function setup() {
    createCanvas(400,400);

}

function draw() {
    background(0,0,0);

    fill(92,83,75);
    ellipse(200,200,230,250)
    rect(90,200,220,160)

    fill(220,196,160);
    rect(185,300,30,60)
    ellipse(300,200,30,40);
    ellipse(100,200,30,40);
    ellipse(200,200,190,210)


    fill(0,0,0)
    rect(230,185,3,10)
    rect(239,185,3,10)
    rect(220,185,3,10)
    rect(160,185,3,10)
    rect(170,185,3,10)
    rect(179,185,3,10)

    fill(240,230,208)
    triangle(200,175,190,235,210,235)

    fill(255,255,255);
    ellipse(170,200,25,20);
    ellipse(230,200,25,20);

    fill(0,0,0)
    ellipse(230,200,10,10);
    ellipse(170,200,10,10);

    fill(92,83,75);
    rect(140,170,40,5)
    rect(210,170,40,5)
    rect(200,90,8,60) 
    rect(170,90,8,60)  
    rect(210,90,8,60) 
    rect(230,90,8,60) 
    rect(150,90,8,60) 
    rect(140,90,8,60) 

    fill(185,119,96)
    ellipse(200,260,50,5)


    fill(180,180,180)
    ellipse(200,420,200,200)

    fill(214,214,214)
    rect(95,215,5,20)
    rect(300,215,5,20)
   




}

LO: My Inspiration

App and Workflows- Microsoft Teams

My older sister, Heyin Oh, works at Microsoft as a senior UX designer. Admiring her work has become a large inspiration to me. The project I want to specifically write about is the application “Microsoft Teams”. Heyin was one of the original designers for the program: working with the windows, Mac, IOS, and android applications. The Design organization which consists of 120 individuals who collaborate together, developed this project and released during 2017. The authors utilized JavaScript through React. The first development of the content was angular and currently has migrated to react. Microsoft Teams integrates people to have instant and engaged collaboration. Further interest Heyin has is to bring the opportunities of AI Cortana API into experience and how it can aid those in need.