Author: myoungsh@andrew.cmu.edu

myoungsh looking outwards 3

I came to CMU with a background in product design and I did most of my work by hand in a metal and wood shop never really being able to make the leap to bigger CNC or printer type tools. I found a  Project, while it is an interesting application of CNC tools and a beautiful project what interested me most about it was the guy’s thoughts on how he was using the tools. He talked about how his use of the CNC tools allowed the project to be shared, meaning him posting the plans (files) he created and used for the project. I thought that was an interesting side to CNC machining because I am not so sure I 9would be willing to replace working with regular power tools or even could with now automated technology. I understand robotics work great for mass production and have personally used 3D printing as a great prototyping tool but neither have replaced hand craftsmanship in metal or wood for custom projects as far as I can tell.

myoungsh-project03-dynamicdrawing

sketch

var topX = 320; //original triangle
var topY = 190;
var leftX = 260;
var leftY = 290 ;
var rightX = 380;
var rightY = 290;

function setup() {
    createCanvas(640, 480);
}

function draw() {
    background(256);
    noStroke()
    fill(0);
    triangle(topX, topY, leftX, leftY, rightX, rightY); //draw original triangle
    
    if(dist(mouseX, mouseY, topX, topY) > 25 || //return original triangle after transformations
    dist(mouseX, mouseY, rightX, rightY) > 25 || 
    dist(mouseX, mouseY, leftX, leftY) > 25) {
      topX = 320;
      topY = 190;
      leftX = 260;
      leftY = 290 ;
      rightX = 380;
      rightY = 290
    }
    
    if(dist(mouseX, mouseY, rightX, rightY) <= 25) { //build 1st itteration of large triangle
      rightX = 200;
      rightY = 190;
      fill(0, 256, 256);
      triangle(320, 190, 260, 290, 380, 290);
      fill(256, 256, 0);
      triangle(440, 190, 320, 190, 380, 290);
      fill(256, 0, 256);
      triangle(260, 290, 380, 290, 320, 390);
    }
    
    if(dist(mouseX, mouseY, topX, topY) <= 25) { //build 2nd itteration of large triangle
      topX = 320;
      topY = 390;
      fill(256, 0, 256);
      triangle(320, 190, 260, 290, 380, 290);
      fill(0 ,256, 256);
      triangle(440, 190, 320, 190, 380, 290);
      fill(256, 256, 0);
      triangle(200, 190, 320, 190, 260, 290);
    }
    
    if(dist(mouseX, mouseY, leftX, leftY) <= 25) { //build 3rd itteration of large triangle
      leftX = 440;
      leftY = 190;
      fill(256, 256, 0);
      triangle(320, 190, 260, 290, 380, 290);
      fill(256, 0, 256);
      triangle(200, 190, 320, 190, 260, 290);
      fill(0, 256, 256);
      triangle(260, 290, 380, 290, 320, 390);
    }
    
    if(dist(mouseX, mouseY, 320, 240) <= 25) { 
      triangle(320, 190, 260, 290, 380, 290);
      triangle(200, 190, 320, 190, 260, 290);
      triangle(260, 290, 380, 290, 320, 390);
      triangle(320, 190, 380, 290, 440, 190);
    }
}

For this project I kept it simple, after using them in the pong exercise I got very comfortable using if statement and they were the easy part of this project. Hardest part was finding coordinates, I assume I could have used some sort of relationships in place of numbers to save time in writing the code.

myoungsh looking outwards 2

After being wowed by some of the coding CW&T did in their counter project I searched thru their sight to see if I could find anything to talk about for this week and I did.

Grass

The Grass app. An app that attempts to recreate a small patch of grass right on your phone screen that in their words you can “pet, coddle, pat, touch, and caress” the grass to help you “think calm soothing thoughts”.

They don’t talk about the specific coding of the app but I believe they use some sort of algorithm to believably reproduce their grass graphic across the screen and have it react to your aforementioned interactions. From reviews and from my own use of the app I thunk the id an awesome job, even though the graphic is simple the interaction is done so well it does make it very relaxing to play with.

myoungsh-project02-variableface

sketch

function setup() {
    createCanvas(640, 480);
}

//legs
var standing = 10;

//arms
var armLength = 50;

//face
var faceWidth = 175;
var faceHeight = 125;
var faceX = 330;
var faceY = 250;
var corner1 = 10;
var corner2 = 20;
var corner3 = 30;
var corner4 = 40;

//eyes
var eyeSize = 20;
var eyeLX = 450;
var eyeRX = 400;

//mouth
var mouthX = 425;
var mouthY = 355;
var mouthWidth = 50;
var mouthHeight = 35;

//lips
var lips = 10;

//thing
var thingX = 200;
var thingY = 100;
var thingWidth = 20;
var thingHeight = 15;

//face color
var colorFg = 210;
var colorFb = 210;

//eye+mouth color
var colorE = 100;

//lips color
var colorLg = 70;
var colorLb = 70;

//thing color
var colorTHr = 210;
var colorTHg = 210;
var colorTHb = 240;

//background color
var colorBr = 225
var colorBg = 250

function draw() {
    background(colorBr, colorBg, 256);
    
    //legs
    strokeWeight(0)
    fill(0)
    rect(425+standing, 350, 5, 200);
    
    strokeWeight(0)
    fill(0)
    rect(405+standing, 350, 5, 200);
      
    //arms
    strokeWeight(0)
    fill(0)
    rect(230+armLength, 325, 350-(armLength*1.5), 5)
    
    //face
    strokeWeight(0)
    fill(245, colorFg, colorFb)
    rect(faceX, faceY, faceWidth, faceHeight, 
    corner1, corner2, corner3, corner4);
    
    //left eye
    strokeWeight(0)
    fill(colorE)
    ellipse(eyeLX, 320, eyeSize, eyeSize);
   
    //right eye
    strokeWeight(0)
    fill(colorE)
    ellipse(eyeRX, 320, eyeSize, eyeSize);
    
    //mouth
    strokeWeight(lips)
    stroke(256, colorLg, colorLb)
    fill(colorE-30)
    ellipse(mouthX, mouthY, mouthWidth, mouthHeight);
    
    //eyes
    eyeSize = random(10, 30);
    
    //thing
    strokeWeight(0)
    fill(colorTHr, colorTHg, colorTHb)
    rect(thingX, thingY, thingWidth, thingHeight, 
    corner1/2, corner2/2, corner3/2, corner4/2);    
    
    //thing
    thingX = random(100, 300)
    thingY = random(75, 125)
    thingWidth = random(10, 35)
    thingHeight = random(10, 35)
}
 
function mousePressed() {
    //legs
    standing = random(0, 25)
    
    //arms
    armLength = random(0, 100)
    
    //face
    faceWidth = random(150, 180);
    faceHeight = random(130, 150);
    faceX = random(320, 350);
    faceY = random(240, 270);
    corner1 = random(0, 50)
    corner2 = random(0, 50)
    corner3 = random(0, 50)
    corner4 = random(0, 50)

    //eyeX
    eyeLX = random(380, 420);
    eyeRX = random(430, 470);
    
    //mouth
    mouthX = random(420, 430);
    mouthY = random(350, 360);
    mouthWidth = random(40, 60);
    mouthHeight = random(30,40);

    //lips
    lips = random(5, 10);

    //face color
    colorFg = random(180, 220);
    colorFb = random(75, 150);
    
    //eye color
    colorE = random(50, 200);
    
    //lips color
    colorLg = random(75, 125);
    colorLb = random(75, 125);
    
    //thing color
    colorTHr = random(200, 220);
    colorTHg = random(200, 220);
    colorTHb = random(230, 250);
    
    //background color
    colorBr = random(215, 256);
    colorBg = random(245, 256);

}

 

myoungsh-Project01-face

I worked with a simple circle face and started my process suing only eclipses and rectangles initially as that was all I was able to execute day 1. Slowly I added features using more complex commands I learned in an attempt to add to the realism emotion and some aesthetic qualities of the illustration.

myoungshsketch

function setup() {
    createCanvas(600, 600);
    }

function draw() {
    background(195, 210, 245);
    
    strokeWeight(0)
    fill(240, 200, 160)
    rect(225, 300, 150, 300); //neck

    strokeWeight(0)
    fill(170, 70, 50)
    ellipse(300, 250, 360, 400); //top hair

    strokeWeight(0)
    fill(195, 210, 245)
    rect(0, 0, 200, 600); //haircut

    strokeWeight(0)
    fill(0, 0, 0)
    ellipse(300, 550, 400, 100); //shoulders

    strokeWeight(0)
    fill(0, 0 ,0)
    rect(100, 550, 400, 50) //torso
    
    strokeWeight(0)
    fill(240, 200, 160)
    ellipse(300, 500, 150, 25); //crew neck

    strokeWeight(0)
    fill(170, 70, 50)
    arc(300, 300, 350, 400, PI, 0, OPEN); //hair+beard
    
    strokeWeight(0)
    fill(170, 70, 50)
    arc(300, 300, 350, 350, 0, PI, OPEN); //hair+beard

    strokeWeight(0)
    fill(240, 200, 160)
    ellipse(300, 300, 330, 300); //face

    strokeWeight(0)
    fill(0, 170, 190)
    arc(225, 300, 20, 20, 0, PI, OPEN); //left eye

    strokeWeight(0)
    fill(0, 170, 190)
    arc(375, 300, 20, 20, 0, PI, OPEN); //right eye

    strokeWeight(0)
    fill(0, 150, 170)
    arc(225, 300, 10, 10, 0, PI, OPEN); //left eye inner

    strokeWeight(0)
    fill(0, 150, 170)
    arc(375, 300, 10, 10, 0, PI, OPEN); //right eye inner
    
    strokeWeight(0)
    fill(230, 190, 150)
    arc(225, 320, 50, 25, 0, PI, OPEN); //left eyebag shadow
    
    strokeWeight(0)
    fill(240, 200, 160)
    arc(225, 320, 40, 15, 0, PI, OPEN); //left eyebag 
    
    strokeWeight(0)
    fill(230, 190, 150)
    arc(375, 320, 50, 25, 0, PI, OPEN); //right eyebag shadow
    
    strokeWeight(0)
    fill(240, 200, 160)
    arc(375, 320, 40, 15, 0, PI, OPEN); //right eyebag 

    strokeWeight(0)
    fill(210, 130, 130)
    arc(300, 415, 80, 30, 0, PI, OPEN); // lower lip

    strokeWeight(0)
    fill(200, 120, 120)
    arc(300, 415, 45, 15, 0, PI, OPEN); //lower lip inner 
    
    strokeWeight(0)
    fill(200, 160, 120)
    arc(300, 365, 50, 25, 0, PI, OPEN); //nose shaddow

    strokeWeight(0)
    fill(240, 200, 160)
    arc(300, 365, 40, 15, 0 , PI, OPEN); //nose 

    strokeWeight(0)
    fill(220, 180, 140)
    rect(305, 300, 5, 50); //nose side shadow
    
    strokeWeight(0)
    fill(220, 180, 140)
    ellipse(mouseX+25, mouseY+15, 10, 10); //freckle
    
    strokeWeight(0)
    fill(220, 180, 140)
    ellipse(mouseX-20, mouseY, 10, 10); //freckle
    
    strokeWeight(0)
    fill(220, 180, 140)
    ellipse(mouseX+20, mouseY-5, 10, 10); //freckle
    
    strokeWeight(0)
    fill(220, 180, 140)
    ellipse(mouseX-10, mouseY+5, 10, 10); //freckle
    
    strokeWeight(0)
    fill(220, 180, 140)
    ellipse(mouseX, mouseY-15, 10, 10); //freckle
    }

myoungsh looking outwards 1

I fell in love with a company this summer called CW&T they caught my attention with a pen they designed that totally blew my mind with its precision machining and how visually stunning it was. After seeing this first product I looked at their other stuff and found a project they did with some coding as well as engineering involved. Simply it is a counter, a button and a display that records all the button presses up to 999,999 and then it stops. Each individual element of the construction is rated to last the perfect amount of time, as well as the code having a self destruct function set to run after 999,999 presses.

Nothing Lasts Forever