Author: hyt@andrew.cmu.edu

hyt-Looking-Outward-02: Deep Learning Drawing Machine

Shantell Martin and Sarah Schwettmann working on the “Mind the Machine” prototype. 2017
Template products of the “Mind the Machine”

For most people in the world, creative processes and ideas usually are associated with words such as “unique,” “special,” or  “innovative.” However, recently I have discovered a British artist who crafted something that might be contrary to people’s conventional connotations.

Shantell Martin, recently residing in New York, collaborated with computational cognitive neuroscientist Sarah Schwettmann to create a systematic “drawing machine” trained by deep neural leaning. What’s interesting about this algorithm-based drawing is that it completes its learning through Shantell Martin’s own three-hundred drawings, then extract common, recurring elements and tempts to rearrange the patterns for new creations. According to the artist herself, as she is more a improvised, “stream of conscious” kind of artist, this deep learning tool has enabled her to understand her “system of thought” and artistic style more.

Personally, I find the experimental art project intriguing since it’s almost like a prototype machine for the future world –dissembling the artists’ elements of style and ideologies and streamline-producing seemingly hand-drawn artworks to the audience. I think this project worth pondering and reflecting for all of us as we step into the creative industry in later days of our lives, to think about how we can utilize machines to a greater use and at the mean time maintain our own uniqueness and integrity.

hyt-Project-02: Minion Faces

hyt-02-Minions

// helen tsui
// 15-104 section d
// hyt@andrew.cmu.edu
// project-02-minions-variation

var eyeSize = 50;
var mouthSize = 30; 
var bodyWidth = 140;
var bodyHeight = 130;
var eyeballSize = 40; 
var mouthAngle = 100;
var x = 0; //rgb value randomization


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

function draw() {
    angleMode(DEGREES); // angle unit change
    background(x, 194, 239); // blue and pink-ish backgrounds randomizing
    
// body
    stroke(0);
    strokeWeight(4.5);
    fill(255, 221, 119); // yellow
    arc(width / 2, height / 2, bodyWidth, bodyHeight, 180, 360, OPEN); // bald head part
    rect(width / 2 - bodyWidth / 2, height / 2, bodyWidth, bodyHeight); // actual body

//pants?
    fill(68, 100, 133); // denim blue
    arc(width / 2, height / 2 + bodyHeight, bodyWidth, bodyHeight - 30, 0, 180, OPEN);

// eyes    
    var eyeLX = width / 2 - bodyWidth * 0.23; // Left eye's x position
    var eyeRX = width / 2 + bodyWidth * 0.23; // Right eye's x position
    fill(256); // white
    ellipse(eyeLX, height / 2, eyeSize, eyeSize); // 
    ellipse(eyeRX, height / 2, eyeSize, eyeSize);

// eyeballs
    fill(60, 40, 40); // brown
    noStroke();
    ellipse(eyeLX, height / 2, eyeballSize, eyeballSize);
    ellipse(eyeRX, height / 2, eyeballSize, eyeballSize);

// mouth
    fill(0);
    arc(width / 2, height / 2 + bodyHeight - 50, mouthSize, mouthSize, 0, mouthAngle);

// hands (referenced from p5.js angleMode)
    var a = atan2(mouseY - height / 2, mouseX - width / 2);
    fill(255, 221, 119); // yellow
    
// left hand rotate! 
    translate(width / 2 - bodyWidth / 2, height / 2 + bodyHeight);
    push();
    rotate(a);
    rect(0, - bodyHeight / 12, bodyHeight / 3, bodyHeight / 6); // arms
    fill(0); // black
    ellipse(bodyHeight / 3, 0, bodyHeight / 5, bodyHeight / 5); // black hands
    pop();

// right hand rotate! 
    translate(bodyWidth, 0);
    push();
    rotate(a);
    rect(0, - bodyHeight / 12, bodyHeight / 3, bodyHeight / 6); // arms
    fill(0); // black
    ellipse(bodyHeight / 3, 0, bodyHeight / 5, bodyHeight / 5); // black hands
    pop();

 }


// randomization when mouse clicks on the canvas
function mousePressed() {
    bodyWidth = random(100, 180);
    bodyHeight = random(90, 180);
    eyeSize = random(30, 50);
    eyeballSize = eyeSize - 12; 
    mouthSize = eyeSize; 
    mouthAngle = random(10, 220); 
    x = random(81, 225); // background rgb value change
}

Now that we have entered week 2, there are many more functions and attributes that I have began to explore in p5.js, and based on those I decided to make a minion with animation-like facial features for my program. I didn’t particularly plan out the sketches on Illustrator, but rather drew out primitive shapes like ellipses and rectangles through trial and error. One of the more difficult process was the moving hands when the mouse hovers over, but once I figured out the coordinates and center for rotation it became much easier. Overall, I really enjoyed creating the project!

Project Week 1 – Self-Portrait

hyt-01

// helen tsui
// 15-104 section d
// hyt@andrew.cmu.edu
// project-01

function setup() {
    createCanvas(400, 400);
    background(60, 105, 128); 
}

function draw() {

stroke(200, 197, 209);
strokeWeight(8);

    fill(250, 225, 223); 
    arc(400, 80, 700, 600, QUARTER_PI, PI);
    ellipse(120, 130, 150, 150); //glasses
    ellipse(320, 130, 150, 150); //glasses
    line(210, 160, 230, 280); 
    line(230, 280, 270, 270); 
    curve(290, 300, 320, 328, 335, 330, 340, 348);
    noFill();
    //curve(0 , 80, 0, 200, 80, 300, 80, 400);
        

noStroke();

    fill(10, 10, 10); 
    arc(130, 140, 100, 40, PI, PI); //eyelid left
    arc(330, 140, 100, 40, PI, PI); //eyelid right

    fill(84, 106, 123);
    ellipse(130, 150, 45, 45); //eyeball left
    ellipse(330, 150, 45, 45); //eyeball right

}

For this project, I assorted a color palette for my self-portrait and used functions including curve, arc, fill, rect, strokes, etc. The process was difficult as I have never coded before, but the trial-and-error method eventually worked out well.

hyt-Looking-Outward-01: Raven Kwok

 

“People walking on dreamy waves.”

Raven Kwok is a rising interdisciplinary programmer and artist originally based in Shanghai, China, and particularly specializes in computer-generative visuals. Even though he has many amazing works that I’d like to introduce, unfortunately he keeps a relatively low profile so that it was difficult to unravel upon his creative process. However, as shared by the artist, he usually uses processing for most generative art contents — some serious, and some less serious or even sarcastic. The example I found is an interactive piece that he essentially created using a grid of LED panels along with infrared sensors which detects the audience’s movement on the panel, and therefore forms waves of geometric shapes.