Liana Geonjyan WiSe 2024/2025 Digitale Kommunikation

Perspektiven

Unsere Aufgabe war, in p5.js Bilder zu programmieren, die jeweils eine Perspektive darstellen.

Extreme Close Up

close up von einer taube

function setup() { createCanvas(600, 400); } function draw() { background(97, 103, 105); fill("brown"); stroke("darkgrey"); strokeWeight(70); ellipse(450,200,300); strokeWeight(30) fill("grey"); triangle(40, 550, 30, 310, 96, 300); circle(30, 280, 45); circle(90, 280, 45); strokeWeight(10) line(120, 30, 95, 105); strokeWeight(10); line(140,40,135,135); }

Lineare Perspektive

ein flur mit 3 türen

function setup() { createCanvas(600, 400); } function draw() { background(220); line(450, 200, 0, 400); line(450,200,15,0); line(450,200,800,600); line(450,200,620,20); line(100,140,100,355); line(200,180,200,310); line(100,140,200,180); line(350,200,300,190); line(350,200,350,245); line(300,190,300,265); line(490,200,490,245); line(490,200,490,245); line(530,180,530,290); line(490,200,530,180); }

Side View

side view von einer taube

function setup() { createCanvas(600, 400); } function draw() { background("lightblue"); stroke("darkgrey") circle(500, 180, 290); triangle(300, 215, 358, 190, 406, 295); fill("white"); triangle(605, 285, 178, 510, 596, 750); circle(470, 180, 25); stroke('green'); strokeWeight(5); line(430, 350, 235, 145); circle(280, 180, 5); circle(240, 160, 5); circle(310, 230, 5); circle(370, 280, 5); }

Silhouette

silhouette von einer katze

function setup() { createCanvas(600, 400); } function draw() { background(220); circle(295, 190, 235); fill("black") triangle(110, 115, 230, 90, 226, 205); triangle(170, 95, 490, 125, 374, 245); triangle(300, 150, 458, 450, 86, 450); }

Was habe ich durch das "zeichnen" in p5.js gelernt?

In p5.js wurden die Bilder “gezeichnet” mit den Funktionen der line, triangle, square, circles und anderen Formen. Zuerst war ich sehr verwirrt, da ich den Aufbau und Herangehensweise nicht verstehen konnte. Aber nachdem ich herausgefunden habe, dass man die Koordinaten und die Länge der Formen mit den Zahlen angibt, was ja eigentlich ganz simpel ist, erging es mir schon leichter mit dem Verständnis. Die Aufgabe hat mir geholfen, die Funktion der Koordinaten mir einzuprägen und hat als eine leichte Einführung in Javascript gedient. Würde ich die Aufgabe aber neu machen, würde ich weg von den Tierfiguren gehen und mich wirklich auf die Perspektive durch die bestimmte Anreihung von Linien und Formen fokussieren.