Alexandra Kaplan – Project 10 – Generative Landscape

sketch

/*
Alexandra Kaplan
Section C
aekaplan@andrew.cmu.edu
Project - 10
*/

var planets = [];
var stars = [];
var ex = 500;
var ey = 500;

function setup() {
    createCanvas(480, 480); 
    
    // create an initial collection of planets
    for (var i = 0; i < 10; i++){
        var rx = random(width);
        if (planets.length < 5){
            planets[i] = makePlanet(rx);
        }
    }
    for(var j = 0; j < 200; j++){
        var sx = random(width);
        stars[j] = makeStar(sx);
    }
    frameRate(20);
}

function draw() {
    background(10,30,120);

    updateAndDisplayStars();
    removestars();
    addNewstars();

    updateAndDisplayplanets();
    removeplanets();
    addNewplanets();
    
    drawShootingStar();
    var newShootingStarLikelihood = 0.01; 
    if (random(0, 1) < newShootingStarLikelihood){
    	if(ex > width || ey > height){
    	   createshootingStar();
    	}
    }	
}
function drawShootingStar(){
	fill('khaki');
	strokeWeight(0);
	var dx = 5;
	var dy = 10;
	ellipse(ex + dx, ey + dy, 10);
	ex += dx;
	ey += dy;
}

function createshootingStar(){
	ex = random(0, width);
	ey = 0;
 }

///////////PLANETS////////////////////////////////////////////////
function updateAndDisplayplanets(){
    // Update the Planet's positions, and display them.
    for (var i = 0; i < planets.length; i++){
        planets[i].move();
        planets[i].display();
    }
}

function removeplanets(){
    // If a Planet has dropped off the left edge,
    // remove it from the array
    var planetsToKeep = [];
    for (var i = 0; i < planets.length; i++){
        if (planets[i].x + 50 + planets[i].breadth > 0){
            planetsToKeep.push(planets[i]);
        }
    }
    planets = planetsToKeep; // remember the surviving planets
}

function addNewplanets() {
    // With a very tiny probability, add a new Planet to the end.
    var newPlanetLikelihood = 0.6; 
    if (random(0, 1) < newPlanetLikelihood){
        if (planets.length < 5){
            planets.push(makePlanet(width + 40));
        }
    }
}

// method to update position of Planet every frame
function PlanetMove() {
    this.x += this.speed;
}
   
// draw the Planet
function PlanetDisplay() {
    var pwidth = this.wid;
    fill(this.col); 
    strokeWeight(0); 
    ellipse(this.x, this.y, pwidth);
    stroke(this.strkCol);
    strokeWeight(this.strk);
    line(this.x - (this.wid / this.srtklength) , this.y, this.x + (this.wid / this.srtklength), this.y); 
}


function makePlanet(birthLocationX) {
    var plnt = {x: birthLocationX,
    	        y: random(0, height),
                breadth: 10,
                speed: random(-5,-1),
                wid: random(20, 75),
                move: PlanetMove,
                display: PlanetDisplay,
                col:color(random(50, 100), random(50, 150), random(100, 255)),
                strk: random(0, 5),
                strkCol: color(random(50, 100), random(50, 150), random(100, 255)),
                srtklength: random(1,2),
                }
    return plnt;
}

///////////STARS////////////////////////////////////////////////
function updateAndDisplayStars(){
    // Update the star's positions, and display them.
    for (var i = 0; i < stars.length; i++){
        stars[i].move();
        stars[i].display();
    }
}

function removestars(){
    // If a star has dropped off the left edge,
    // remove it from the array
    var starsToKeep = [];
    for (var i = 0; i < stars.length; i++){
        if (stars[i].x + stars[i].breadth > 0) {
            starsToKeep.push(stars[i]);
        }
    }
    stars = starsToKeep; // remember the surviving stars
}

function addNewstars() {
    // With a very tiny probability, add a new star to the end.
    var newStarsLikelihood = 0.5; 
    if (random(0,1) < newStarsLikelihood) {
        stars.push(makeStar(width + 40));
    }
}

// method to update position of stars every frame
function StarMove() {
    this.x += this.speed;
}
   
// draw the star
function StarsDisplay() {
    var swidth = this.wid;
    fill(this.col); 
    strokeWeight(0); 
    ellipse(this.x, this.y, swidth);  
}


function makeStar(birthLocationX) {
    var st = {x: birthLocationX,
    	        y: random(0, height),
                breadth: 10,
                speed: -.5,
                wid: random(1, 5),
                move: StarMove,
                display: StarsDisplay,
                col:color('palegoldenrod'),
            }
    return st;
}

When thinking about a generative landscape, my mind went straight to space, with planets and stars passing by.

                                                    Image of the original sketch

I started off by referring to the bulding base code and changing it to planets of various sizes. I then added strokes of different random weights and lengths to be the planet’s rings. The stars behind the planets were made in a similar way, but with more of them. I then added some shooting stars for fun. I think it turned out pretty well.

Leave a Reply