U0205 Gegensatzpaare - Leicht & Schwer

Aufgabenstellung:

Visualisieren Sie in zwei nebeneinander liegenden Quadraten jeweils die Eigenschaften leicht und schwer. Ordnen Sie dazu verschiedene Punktetypen an. Es geht darum, eine aufbauende Systematik zu entwickeln, so dass mehrere Gegensatzpaare entstehen. Nutzen Sie eine 4x3 Matrix für insgesamt 12 Varianten des Gegensatzpaares.

Mein Ergebnis:

ReflexionCode

Für diese Aufgabe habe ich eine Funktion programmiert, mit der man per Tastendruck die Größe der Punkte auswählen konnte (klein und groß). In der ersten Reihe habe ich sowohl kleine als auch große Punkte verwendet, um leichte und schwere Gefühle darzustellen. Ich habe dabei immer wieder gewechselt, ob die größeren Punkte links oder rechts platziert waren, einmal mit einem einzelnen Punkt und einmal mit zwei Punkten. Es fällt mir schwer zu sagen, was „schwer“ besser darstellt – die kleinen oder die großen Punkte. Einerseits wirken die kleinen Punkte „dichter“, wenn sie die gleiche Masse wie die großen Punkte hätten, nur auf kleinerem Raum. Andererseits, wenn sie dieselbe Masse haben, wirken die größeren Punkte definitiv „schwerer“.

Für die folgenden Reihen habe ich nur kleine Punkte und dann nur große Punkte verwendet. Die ungefähre Positionierung war immer dieselbe zwischen den beiden Reihen, und hier habe ich definitiv das Gefühl, dass die größeren Punkte in jeder Situation schwerer wirken.

int rows = 3;
int cols = 4;

float cellPadding = 20;
float squareSpacing = 10;

ArrayList<Dot> dots = new ArrayList<Dot>();
String currentSize = "medium"; // default size

Dot selectedDot = null;

void setup() {
size(1000, 400);
rectMode(CENTER);
}

void draw() {
background(255);
drawMatrix();
drawDots();
}

void drawMatrix() {
float cellWidth = (width - (cols + 1) * cellPadding) / cols;
float cellHeight = (height - (rows + 1) * cellPadding) / rows;
float squareSize = min(cellWidth / 2 - squareSpacing / 2, cellHeight * 0.8);

for (int row = 0; row < rows; row++) {
    for (int col = 0; col < cols; col++) {
    float cellX = cellPadding + col * (cellWidth + cellPadding);
    float cellY = cellPadding + row * (cellHeight + cellPadding);

    float centerX = cellX + cellWidth / 2;
    float centerY = cellY + cellHeight / 2;

    float leftX = centerX - squareSize / 2 - squareSpacing / 2;
    float rightX = centerX + squareSize / 2 + squareSpacing / 2;

    fill(180);
    stroke(50);
    rect(leftX, centerY, squareSize, squareSize);
    rect(rightX, centerY, squareSize, squareSize);
    }
}
}

void drawDots() {
for (Dot d : dots) {
    d.display();
}
}

void mousePressed() {
// clicked on existing dot
for (Dot d : dots) {
    if (d.isHovered(mouseX, mouseY)) {
    selectedDot = d;
    return;
    }
}

// new dot
float size = getSizeFromCurrent();
dots.add(new Dot(mouseX, mouseY, size));
}

void mouseDragged() {
if (selectedDot != null) {
    selectedDot.x = mouseX;
    selectedDot.y = mouseY;
}
}

void mouseReleased() {
selectedDot = null;
}

void keyPressed() {
if (key == 'u' || key == 'U') {
    currentSize = "small";
} else if (key == 'i' || key == 'I') {
    currentSize = "medium";
} else if (key == 'p' || key == 'P') {
    currentSize = "large";
}
}

// helpers
float getSizeFromCurrent() {
switch (currentSize) {
    case "small": return 8;
    case "large": return 28;
    default: return 20;
}
}

// dot
class Dot {
float x, y, size;

Dot(float x, float y, float size) {
    this.x = x;
    this.y = y;
    this.size = size;
}

void display() {
    fill(0);
    noStroke();
    ellipse(x, y, size, size);
}

boolean isHovered(float mx, float my) {
    return dist(mx, my, x, y) < size / 2 + 2;
}
}