Project – 09

sketch
var img;

function preload () {
	img = loadImage("https://i.imgur.com/iVbKAY2.png");    //preloading image
}

function setup() {
    
    background(220);

    img.loadPixels();

    img.resize(img.width/6, img.height/6);
	
	createCanvas(300, 300);

    
}

function draw() {   //the program draws a line between two random points in the color that is the average of the two points
	var dist = map(mouseY, 0, height, 0, 250);
	


	var point1X = random(-50,350); //making the boundaries slightly larger than the canvas so the edges are filled in evenly
	var point1Y = random(-50, 350);

	var point2X = random(point1X-dist, point1X+dist);
	var point2Y = random(point1Y-dist, point1Y+dist);




	var point1col = img.get(point1X, point1Y);  //retrieving color from both points
	var point2col = img.get(point2X, point2Y);

	var linecol = img.get((point1X+point2X)/2, (point1Y+point2Y)/2); //getting the line color by using the point between the ends

	stroke(linecol);

	strokeWeight(3);

	line(point1X, point1Y, point2X, point2Y);

}

My program uses lines varying in length to draw my face. The length of the line drawn is semi-randomize, getting larger as mouseY increases. I wanted to use lines because I thought it would be a little more visually interesting then a simple pixel. I like the fact that the image can be more or less abstract depending on what you want.

Leave a Reply