U0201 Grundelemente - DerPunkt

Programmieren Sie in Processing einen Punkt in auf einer Vollbild Grundfläche. A) Der Punkt soll so positioniert sein, dass er Ruhe ausstrahlt. B) Der Punkt soll so positioniert sein, dass er Spannung ausstrahlt.

Dokumentieren sie ihr Ergebnis in MKDocs. Welche neuen Fragen ergeben sich Ihnen?

Ruhe

Spannung

Reflexion

Der Ruhepunkt wirkt ruhig. Er ist mittig angebracht. Aber der Spannungspunkt wirkt auf mich nicht gespannt. Ich werde in ihn genau so hineingezogen, wie in den Ruhepunkt. Er wirkt ein wenig weniger statisch, aber große Punkte wirken auf mich anscheinend beruhigend, unabhängig von der Position im Raum.

Code:

// --- Einstellungen ---

int cols = 1;

int rows =1;

int mousefactor = 2;

float padding = 10;

float pointSize = 10;




float cellSize;

float startX, startY;



ArrayList<Dot> dots;



void setup() {

  size(1000, 700);

  dots = new ArrayList<Dot>();



  // Quadratgröße richtet sich nach Höhe

  cellSize = (height - padding * (rows + 1)) / rows;

  float totalWidth = cols * cellSize + (cols + 1) * padding;

  startX = (width - totalWidth) / 2 + padding;

  startY = padding;

}



void draw() {

  background(200); // Hintergrund leicht grau für Kontrast



  // Raster zeichnen

  for (int i = 0; i < cols; i++) {

    for (int j = 0; j < rows; j++) {

      float x = startX + i * (cellSize + padding);

      float y = startY + j * (cellSize + padding);

      fill(255);

      stroke(0);

      rect(x, y, cellSize, cellSize);

    }

  }



  // Punkte zeichnen

  for (Dot d : dots) {

    d.display();

  }



  // Punktgröße anzeigen

  fill(0);

  text("Punktgröße: " + pointSize, 10, height - 10);

}



void mousePressed() {

  // Punkt an Klickposition hinzufügen

  dots.add(new Dot(mouseX, mouseY, pointSize));
 // mousefactor ++; // Schnipsel für U0209 (vergrößert Punkt nach jedem Klick)
 // pointSize = pointSize + 0.75 * mousefactor;
}



void keyPressed() {

  if (key == '+' || key == '=') {

    pointSize += 10;

    if (pointSize > 1000) pointSize = 1000;

  }

  if (key == '\t') { // Lifeimprovement -> löscht alle Punkte nach TAB
   dots.clear();
   //mousefactor = 2; // Schnipsel für U0209
   //pointSize = 10; // Schnipsel für U0209
  }
  if (key == 'z') { // Lifeimprovement -> löscht letzten Punkt nach z
    if (dots.size() - 1 >= 0) {
     dots.remove(dots.size() - 1);
    }
  }

  if (key == '-' || key == '_') { // Punktgröße

    pointSize -= 10;

    if (pointSize < 2) pointSize = 2;

  }

}



// Punktklasse

class Dot {

  PVector pos;

  float size;



  Dot(float x, float y, float s) {

    pos = new PVector(x, y);

    size = s;

  }



  void display() {

    fill(0);

    noStroke();

    circle(pos.x, pos.y,  size);

  }

}