Sofia Syjuco – Project-02

sketch

// Sofia Miren Syjuco
// Section A
// smsyjuco@andrew.cmu.edu
// Assignment-02-C

// 5 pixels / inch

// Simple beginning template for variable face.
var eyeSize = 20;
var faceWidth = 100;
var faceHeight = 150;
var mouthWidth = 50;
var mouthHeight = 20;
var pupilSize = 10;
var cheekSize = 10;
var noseWidth =5;
var noseHeight = 20;
var browHeight = 2;
 
function setup() {
    createCanvas(640, 480);
}
 
function draw() {
    background(244,147,144);
    noStroke (0);

    //Ears. On either side of the middle of the face.
    fill (217,115,77);
    ellipse(width/2 - faceWidth/2, height / 2, eyeSize, eyeSize);
    ellipse(width/2 + faceWidth/2, height / 2, eyeSize, eyeSize);

    //Face: Center of canvas
    fill (217,115,77);
    ellipse(width / 2, height / 2, faceWidth,  faceHeight);


    //Cheeks (blush). Positioned just under the eyes, but same idea.
    fill (255,104,77);
    var cheekLX = width / 2 - faceWidth * 0.25;
    var cheekRX = width / 2 + faceWidth * 0.25;
    ellipse(cheekLX, height/2 + faceHeight/8, cheekSize, cheekSize);
    ellipse(cheekRX, height/2 + faceHeight/8, cheekSize, cheekSize);

    //Eyes.
    fill (250);
    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);

    //Eyebrows, just above the eyes
    fill (0);
    ellipse(eyeLX, height / 2 - eyeSize/2, eyeSize, browHeight);
    ellipse(eyeRX, height / 2 - eyeSize/2, eyeSize, browHeight);

    //Pupils, in center of the eyes
    fill (0);
    ellipse (eyeLX, height/2, pupilSize, pupilSize);
    ellipse (eyeRX, height/2, pupilSize, pupilSize);

    //Mouth
    fill (246,30,74);
    ellipse (width/2, height/2 + faceHeight/4, mouthWidth, mouthHeight);

    //Nose
    fill (179,66,34);
    ellipse (width/2, height/2 + faceHeight/15, noseWidth, noseHeight);

}
 
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(16, 30);
    mouthWidth = random(20, 50);
    mouthHeight = random(10, 15);
    pupilSize = random(2, 15);
    cheekSize = random(10, 25);
    noseWidth = random(5, 15);
    noseHeight = random(10, 30);
    browHeight = random(2, 5);
}

My process involved a lot of experimentation. Being a visual learner, it’s hard to try and understand things purely in terms of numbers. This project allowed me greater freedom with which to practice my programming, but set it within the bounds of facial proportions – which is something I am more familiar with. I am trying to stay away from using “magic numbers,” and instead work through how I can represent values through arithmetic and variables.

Sofia Syjuco – Looking Outwards-02


MicroImage B Prints
Casey Reas

Casey Reas’s MicroImage series encompasses a very interesting set of prints (and some videos) of generative art. Reas himself developed the software used to create these pieces of art (pictured above, prints from the “B” group within this series). I very much admire the formal qualities of these non-representational pieces that he programmed, because they speak to a high level of understanding both art and technology – Reas is so skilled as to be able to naturally channel one medium into another, and create a work that is stunning in both forms.

Reas used the MicroImage software to develop this project, using Processing – an open-source language that he and Ben Fry created together with the intention of opening up programming to artists. The creator’s artistic sensibilities manifest in the aesthetic of all works produced through this software, a strange mid-ground between fractal and organic.

Sofia Syjuco Looking Outwards-01

Do Not Touch
Studio Moniker
do not touch

Do Not Touch is an interactive, crowd-sourced music video that is constantly re-created and regenerated every hour. Studio Moniker, a team of ten people, created this video as the backdrop for the song Light Light by Kilo. Although the team that created it is quite small, the number of participants who make its continuous evolution possible is over four million. It took, on-and-off, one year to make this project, which was coded in javascript.

A work that served as the primary inspiration for Do Not Touch was a video recording of the game “Nemesis.” The video had many recordings of the same level overlaid atop one another, with more and more recordings stacking until one recording showed the player finally beating the level.

This project points to a future in videos (not only just music videos, but perhaps movies as well) that depend on viewer interaction to tell a story. A story that can change with every telling, as each new participant brings something new, but always holds true to some constants – because those who are interacting and changing the story in minute ways share common human experience and instincts.

Project01-Face Sofia Syjuco

sketch

// Sofia Syjuco
// Section A, 9:30-10:20AM
// smsyjuco@andrew.cmu.edu
// Project01-Face

function setup() {
    createCanvas(600, 600);
    background (237,239,228);
}

function draw() {

    noStroke ();

    // hair back
    fill (46,29,6);
    ellipse (300, 340, 200, 300);

	// face
    fill (210,180,140);
    ellipse (300, 300, 160, 200);

    // hair front
    fill (46,29,6);
    ellipse (300, 248, 180, 100);

    // eyes
    fill (255,255,255);
    ellipse (260, 320, 40, 20);
    ellipse (340, 320, 40, 20);
    fill (46,29,6);
    ellipse (260, 320, 10, 10);
    ellipse (340, 320, 10, 10);

    // nose
    fill (231,133,111);
    ellipse (300, 340, 15, 20);

    //mouth
    fill (179,73,55);
    ellipse (300, 370, 27, 12);

    //neck
    fill (210,180,140);
    rect (285, 390, 30, 40);

    // shirt
    fill (0,0,0);
    rect (200, 430, 200, 100);


	}

I learned a lot about using different shapes in this project, and especially about placing them in the canvas. I ran into some difficulties embedding it, but I figured out that any fill colors that used strings ignored the strings, and used the color values of whatever was color filled before. I’m overall very pleased with the outcome, as it taught me a lot, and I think gave me a solid foundation for further works.