Project – 11 – Landscape

sketch
//Dreami Chambers; Section C; dreamic@andrew.cmu.edu; Assignment-11-Project

var stars = []
var planets = []
var moon = []
var noiseParam = 0
var noiseStep = 0.1
var sky
var astronaut
var planet
var meteor 
var mx = 300
var my = 0
var mdx
var mdy
var ax = 0
var ay = 100
var ady = 1
var frameCount = 0

function preload() { 
	sky=loadImage("https://i.imgur.com/zfE0rbY.jpg")
	astronaut=loadImage("https://i.imgur.com/0GaKn9k.png")
	planet=loadImage("https://i.imgur.com/UCrpkmB.png")
	meteor=loadImage("https://i.imgur.com/gcfvaqR.png")
} 

function setup() {
    createCanvas(400, 300)
    //meteor velocity
	mdx = random(-10,-15)
	mdy = random(10,15)
    //stars setup
    for (var i = 0; i < 100; i++) {
    	var rx = random(width)
    	var ry = random(height)
    	var rdx = random(4)
        stars[i] = makeStars(rx, ry, 2, rdx)
    }
    //planets setup
    for (var j = 0; j < 2; j++) {
    	var rx = random(width)
    	var ry = random(150)
        planets[j] = makePlanets(rx, ry)
    }
    //moon surface setup
    for (var k = 0; k < width; k++){
		var n = noise(noiseParam)
		var value = map(n, 0, 1, 10, 50)
		moon.push(value)
		noiseParam += noiseStep
	}
    frameRate(10)
}

function draw() {
	image(sky, 0, 0, 400, 400)

	//draws stars
	starUpdate()
	starsRemove()
	starsAdd()

	//draws planets
	planetUpdate()
	planetsRemove()
	planetsAdd()
	
	//draws moving meteor
	drawMeteor(mx, my, mdx, mdy)

	//draws moon surface
	drawMoon()

	//draws astronaut
	drawAstronaut(ax, ay)

	//moves meteors across screen
	mx+=mdx
	my+=mdy

	//moves astronaut up and down
	ay+=ady
	if (ay > 110){
		ady*=-1
	}
	if (ay < 90){
		ady*=-1
	}
	frameCount++
}

function drawAstronaut(x, y){
	image(astronaut, x, y, 55, 60)
}

function drawMoon(){
	stroke(200, 180, 200)
	strokeWeight(200)
	moon.shift()
	var n = noise(noiseParam)
	var value = map(n, 0, 1, 10, 50)
	moon.push(value)
	noiseParam += noiseStep
	for (var i=0; i < width; i++){
		line(i*15, 300+moon[i], (i+1)*15, 300+moon[i+1])
	}
}

function drawMeteor(x, y, dx, dy){
	image(meteor, x, y, 50, 45)
}

//star functions
function starUpdate(){
	for (var i = 0; i < stars.length; i++){
        stars[i].stepFunction()
        stars[i].drawFunction()
	}
}

function starsRemove(){
	starsToKeep = []
	for (var i = 0; i < stars.length; i++){
        if (stars[i].x + stars[i].size > 0){
        	starsToKeep.push(stars[i])
        }
	}
	stars = starsToKeep
}

function starsAdd(){
	var starProb = 0.5
	if (random(1) < starProb){
		stars.push(makeStars(random(width, 410), random(200), 2, random(4)))
	}
}

function starStep() {
    this.x -= this.dx
}

function starDraw() {
	stroke(this.c)
	strokeWeight(this.size)
	point(this.x, this.y)
}

function makeStars(px, py, pdx, ps) {
	var s = {x: px, y: py, dx: pdx, 
		size: ps, c: color(random(150, 230),random(100, 140),random(200, 255)),
		drawFunction: starDraw, stepFunction: starStep
	}
	return s
}

//planet functions
function planetUpdate(){
	for (var i = 0; i < 2; i++){
        planets[i].stepFunction()
        planets[i].drawFunction()
	}
}

function planetsRemove(){
	planetsToKeep = []
	for (var i = 0; i < planets.length; i++){
        if (planets[i].x + planets[i].size > 0){
        	planetsToKeep.push(planets[i])
        }
	}
	planets = planetsToKeep
}

function planetsAdd(){
	var planetsProb = 0.3
	if (random(0, 1) < planetsProb){
		planets.push(makePlanets(random(width, 450), random(150)))
	}
}

function planetStep() {
    this.x -= this.dx
}

function planetDraw() {
	image(planet, this.x, this.y, this.size, this.size)
}

function makePlanets(px, py) {
	var p = {x: px, y: py, dx: 2, 
		size: random(10,60), c: color(random(200,200),random(140,170),random(140,170)),
		drawFunction: planetDraw, stepFunction: planetStep
	}
	return p
}

For this project, I wanted to create a landscape capturing space. I used clip art for a few of the objects here. The meteor moves past the screen at the beginning of the animation. The objects that move with the camera are the stars, the planets, and the moon surface. The stars are created by randomly placing points with different sizes and slightly different colors. The planets have random sizes and locations as well. For the moon surface, I referred to the stock market example that we did in lab previously. I had originally planned to add craters to the moon, but decided not to for the sake of time. Here is my sketch for this project:

Leave a Reply