Project 08 – Computational Portrait

For this project I took inspiration from the photos taken by the Viking I orbiter in 1976.   The spacecraft captured images from the Cydonia region of Mars and showed what seemed to be “faces”.  Years later  higher quality photos revealed the face to be just an optical illusion.  However, the initial photos sparked a lot of speculation regarding life on Mars, a question that continues to this day with the findings of water on the surface.   Before I came to CMU, I worked at a science museum and we had this photo booth in the space exhibit where you could take a photo of yourself on the moon.  Basically a computer took a picture of you in front of a green screen and keyed it into a lunar landscape.  This project is a departure from this concept, in which your likeliness (based on a photo) could be computationally rendered into a face-like crater on the surface of Mars.

Below is one version of it:

``````//Jen Liu
//jenliu@cmu.edu
//Section Golan
//Project 08 - Computation Portrait

//Mars surface photo was taken from: http://www.uahirise.org/ESP_031036_1345
//From the HIRISE Project with NASA/JPL/University of Arizona

var underImg;
var marsGround;
var r = -20;

var underImgURL = "http://i.imgur.com/dWPhF10.jpg";
// var underImgURL = "https://i.imgur.com/3CGzDxI.jpg"; //other self portrait
var marsGroundURL = "http://i.imgur.com/zW61P6B.jpg";

}

function setup() {
createCanvas(600, 400);
noLoop();

ground();

//tint, place and blur mars surface photo
tint(255, 90);
image(marsGround, 0, 0);
filter(BLUR,2);

rocks();

underface();

}

function draw() {

}

function rocks(){
//draws black rocks on surface
noStroke();
fill(0, 100);

for(var i = 0; i < 300; i ++){
var x = random(width);
var y = random(height);
var d = random(8);

ellipse(x, y, d, d);
}
}

function underface(){
//draws dark spots on face

var imageW = underImg.width;
var imageH = underImg.height;

var diam = 25;

var skip = 5;
var bright = 120;
var dark = 20;

for(var i = 0; i < imageW; i+= skip){
for(var j = 0; j < imageH; j += skip){

//go through each color value of each pixel
var bX = i;
var bY = j;
var pixel = underImg.get(bX,bY);

//take the RGB values of each pixel
var rVal = red(pixel);
var gVal = green(pixel);
var bVal = blue(pixel);

//average of RGB values == brightness.
var avgVal = (rVal + gVal + bVal)/3;

noStroke();

push();
translate(250, 200);
scale(.3, .3);

if (avgVal < bright && avgVal > dark){
fill(0,20);
ellipse(bX, bY, diam, diam);
}else if(avgVal > bright){
fill(250, 20);
ellipse(bX, bY, diam,diam);
}
pop();

}
}

}

function ground() {
//draws a gradient overlay for the ground

var newWidth = width + 100;
push();
translate(-70, 0);

start = color(255);
stop = color(20);
strokeWeight(12);

for (var i = 0; i <= width; i++) {
var inter = map(i, 0, height, .3, 1);
var c = lerpColor(start, stop, inter);
stroke(c);
line(0, i, newWidth, i);
}
pop();
}
``````