sketch
var terrainSpeed = 0.0005;
var terrainDetail = 0.005;
function setup() {
createCanvas(480, 480);
frameRate(10);
}
function draw() {
moon();
drawMountains1();
drawMountains2();
drawMountains3();
drawMountains4();
}
function drawMountains1(){
fill(118,54,38,20);
beginShape();
for (var x = 0; x < width; x++) {
var t = (x * terrainDetail) + (millis() * terrainSpeed*0.5);
var y = map(noise(t), 0,1, 0, height);
vertex(x, y-15);
}
vertex(width,height);
vertex(0,height);
endShape();
}
function drawMountains2(){
fill(225,54,38,30);
beginShape();
for (var x = 0; x < width; x++) {
var t = (x * terrainDetail) + (millis() * terrainSpeed*0.5);
var y = map(noise(t), 0,1, 0, height*1.2);
vertex(x, y-15);
}
vertex(width,height);
vertex(0,height);
endShape();
}
function drawMountains3(){
fill(245,54,38,30);
beginShape();
for (var x = 0; x < width; x++) {
var t = (x * terrainDetail) + (millis() * terrainSpeed*0.5);
var y = map(noise(t), 0,1, 0, height*1.35);
vertex(x, y-15);
}
vertex(width,height);
vertex(0,height);
endShape();
}
function drawMountains4(){
fill(255,54,38,30);
beginShape();
for (var x = 0; x < width; x++) {
var t = (x * terrainDetail) + (millis() * terrainSpeed*0.5);
var y = map(noise(t), 0,1, 0, height*1.6);
vertex(x, y-15);
}
vertex(width,height);
vertex(0,height);
endShape();
}
function moon(){
fill(105,105,105);
ellipse(width/2,height/3,200,200);
}
I wanted to create an abstract landscape that creates continuous landscape and the contour lines create this 3-dimensional space. In order to create this feel, I increased the opaqueness of each mountain ranges and It has a surreal feel to it.