Objekte 1 - Woche 5

Aufgaben

Farbschema

Farbsymbolik und Farbwirkung

Farben haben immer auch eine Wirkung auf uns Menschen. Diese Wirkung wurde von Künstlern, Psychologen und Wissenschaftlern untersucht und beschrieben, so dass viele – und sich teilweise widersprechende – Farbtheorien existieren.

Verallgemeinernd kann man sagen, dass die Wahrnehmung von Farben auf zweierlei Art psychologisch wirkt:

• assoziativ: Farben können Erinnerungen an Bekanntes hervorrufen. Wie etwa Feuer (rot), Himmel (blau), oder Baum (braun und grün)
• symbolisch: Farben können Gefühle hervorrufen. Diese symbolische Beziehungen sind von Kultur und Gesellschaft beeinflusst, und von Mensch zu Mensch verschieden. Es gibt jedoch viele im westlichen Kulturkreis ziemlich allgemein gültige. Bei einigen davon sind diese Bindungen so stark, dass sie als Redewendungen in die Sprache eingegangen sind: Schwarz ärgern, Gelb vor Neid werden, giftgrün.

Viele Farbwirkungen und -symboliken sind nicht klar einem der beiden Bereiche zuordenbar. So ist die Korrelation Wut-Rot vielleicht vom roten Kopf beeinflusst.

Diese sehr vereinfachte Darstellung soll zumindest daran erinnern, dass Farben auch Wirkungen besitzen, und dass diese mehr oder weniger gezielt eingesetzt werden können. (Wie immer gilt, dass diese Regel auch bewußt gebrochen werden kann, bzw. dass man vor allem seinen eigenem Gefühl vertrauen sollte.)

Farben einsetzen

Wenn nun in Processing-Sketches Farben angewendet werden, ist es eine Überlegung wert, ob und wie man diese Farben mit Hinblick auf die Wirkung einsetzt. Insbesondere wenn die Farben in generativen Grafiken vom Zufall beeinflusst werden, sollte beachtet werden, dass nicht einfach beliebige Farben verwendet werden und es nicht in einer Kakophonie der Farben ausartet.

Dazu gibt es verschiedenste Möglichkeiten, wovon nun zwei einfache vorgestellt werden.

Farbpaletten

Man definiert einige Farben, und wählt zufällig aus dieser Palette eine aus. Diese Methode entspricht im Muster wieder dem Grundsatz der generativen Grafik. Wie wir letzte Stunde gesehen haben, kann die Mischung aus vordefinierten, festen Regeln einerseits und Zufall andererseits oft zu spannenden Ergebnissen führen.

color colors[] = new color[3]; void setup() { size(400, 400); colors[0] = color(#9E89FF); colors[1] = color(#809FFF); colors[2] = color(#CEC4FF); } void draw() { int c = int(random(3)); fill(colors[c]); ellipse(random(width), random(height), 50, 50); }

In diesem Beispiel werden also in einem Array ausgewählte Farben gespeichert, von denen per Zufall jeweils eine ausgewählt wird, um einen farbigen Kreis zu zeichnen. (Die Funktion int() in Zeile 12 wandelt ein float- in einen int-Wert um.)

Als Inspirationsquelle zum Erstellen von Farbschemen kann z.B. auch eins der folgenden Tools genutzt werden:

• Color Scheme Generator Gutes Tool zum Erzeugen von Farbschemen.
• kuler Community (von Adobe) zum Bewerten und Besprechen von Farbschemen.
• Whats Its Color Automatische Farbschema-Erzeugung basierend auf Fotos

Sanfte Abweichung

Wie im letzten Semester bereits besprochen, kann man den "sanften Zufall" verwenden, um nur leichte zufällige Abweichungen zu erhalten. Wenn man etwa bei einem Grünton anfängt, und die Nachbarelemente etwas heller oder etwas dunkler werden können, aber keine komplett andere Farbe annehmen oder starke Sprünge vollziehen.

float g = 255; void setup() { size(400, 400); strokeWeight(5); } void draw() { stroke(0, g, 0); line(width/2, height/2, mouseX, mouseY); g = g + random(-10, 10); g = constrain(g, 0, 255); }

Zufallsbereich

Auch dies ist eine Wiederholung aus dem letzten Semester: Um nur in einem gewissen Rahmen Farben auszuwählen, kann die Zufallsfunktion mit Ober- und Untergrenze genutzt werden:

fill(random(255), 0, 0, random(127, 255)); rect(mouseX, mouseY, 20, 20);

Im obigen Beispiel werden also rote Töne mit einem Transparenz-Wert zwischen 50% und 100% genutzt.

Objektorientierte Programmierung

Objektorientiertes Programmieren (OOP) ist ein Programmierkonzept, dass von den meisten höheren Programmiersprachen wie Processing oder ActionScript unterstützt wird. Objektorientierte Programme sind nicht unbedingt schneller oder schlanker, sie sind aber oft besser zu verstehen. In diesem Sinne bedeutet OOP vor allem, anders über Programmierung nachzudenken. Im Mittelpunkt des OOP steht das Objekt. Statt mit einzelnen Funktionen und Variablen zu arbeiten, bietet OOP die Möglichkeit, eine Reihe von Eigenschaften und Methoden abzukapseln und sie als eine Einheit, bzw. als ein Objekt zu behandeln. Diese Objekte können dann ein hohes Maß an Komplexität bekommen. Jedem Objekt liegt eine Klasse zugrunde, in der schon die grundsätzliche Struktur aller Objekte angelegt ist.

Eigenschaften und Methoden

Jedes Objekt hat Eigenschaften und Methoden. Die Eigenschaften bestimmen wie ein Objekt ist, die Methoden, was das Objekt tun kann. Das Konzept der Objekte wurde aus der realen Welt entlehnt, daher ist es oft eingängiger und nachvollziehbarer als etwa mit vielen Arrays zu arbeiten.

So hat vielleicht der Strandball einen Durchmesser von 20cm, ist rot-weiß gestreift und aus Plastik (Eigenschaften). Und man kann den Ball nun werfen, treten oder auch die Luft herauslassen (Methoden).

Klassen und Objekte

Eine Klasse ist eine abstrakte, ordnende Struktur, der man eine Reihe von Eigenschaften und Methoden zuweisen kann. Ein Objekt nun ist eine konkrete Variante dieser Klasse, eine sogennante Instanz.
Um zum Beispiel zurück zu kommen: Es gibt natürlich unzählige verschiedene Bälle auf der Welt, aber alle haben ein paar Dinge gemein: Sie haben eine Größe, eine Farbe und ein Material.

Strukturiert sieht die Klasse dann so aus. Ein Ball hat allgemein folgende Eigenschaften:

• Größe
• Farbe
• Material

Und jeder einzelne Ball, jedes Objekt, hat eine ganz spezielle Größe und eine ganz spezielle Farbe.

Unser Strandball etwa hat folgende Eigenschaften:

• Größe: 20cm
• Farbe: rot-weiß gestreift
• Material: Plastik

OOP in Processing

Bei der objektorientierten Programmierung in Processing müssen ein Menge Dinge beachtet werden. Zum Verständnis zeige ich im Folgenden ein Programm, das ein Kreis zeichnet: Einmal im "klassischen" Verfahren und dem gegenüber gestellt das Programm in OOP.

void setup() { size(200, 200); } void draw() { drawShape(); } // Eigene Funktion void drawShape() { ellipse(20, 50, 10, 10); }

Das nächste Programm zeigt, wie dies nun mit einem Objekt umgesetzt werden kann:

void setup() { size(200, 200); } void draw() { Ball myBall = new Ball(); myBall.drawShape(); } class Ball { // Eigene Funktion innerhalb der Klasse void drawShape() { ellipse(20, 50, 10, 10); } }

Im Beispiel haben wir eine Klasse Ball definiert. Dies geschieht, indem man class und den Namen der Klasse und dann einen Programmblock (umfasst von geschweiften Klammern) hinschreibt. In diesen Block werden die Eigenschaften und Methoden der Klasse definiert.

class Ball { // ... }

Innerhalb der Klasse haben wir eine eigene Funktion definiert (drawShape). Interne Funktionen von Klassen werden in der OOP Methoden genannt.

Wir haben also die allgemeine Struktur definiert und möchten jetzt einen konkreten Ball erstellen. Um ein Objekt dieser Klasse zu erzeugen, verwendet man new:

Ball myBall = new Ball();

Es gibt danach ein neues Objekt mit dem Namen myBall. Über diese Variable kann danach die Methode aufgerufen werden:

myBall.drawShape();

Dies führt dazu, dass die Methode aufgerufen wird und das Rechteck gezeichnet wird. Diese Verwendung von Methoden nennt man aufgrund des Punktes zwischen Objekt-Variablennamen und Methodennamen die Punktnotation.

Ablauf der OOP

Um Objekte einsetzen zu können, muss man

1. Eine eigene Klasse definieren
2. Objekte mit Hilfe der Klasse erzeugen (sogenannte Instanzen)
3. Diese Objekte verwenden

Eigenschaften

Wie oben gesehen, kann eine Klasse nicht nur Methoden, sondern auch Eigenschaften haben. Diese werden direkt in die Klasse geschrieben.

class Ball { float x; float y; float size; color col; void drawShape() { ellipse(20, 50, 10, 10); } }

Von aussen können die Eigenschaften nun genutzt, d.h. aktuelle Werte ausgelesen oder neue Werte gespeichert werden.

Ball myBall = new Ball(); myBall.x = random(width); myBall.y = mouseY; myBall.size = 40; myBall.col = color(0, 0, random(255));

Und natürlich können die Eigenschaften auch und vor allem in der Klasse selbst verwendet werden. Innerhalb der eigenen Methoden muss nicht die Punktnotation genutzt werden:

class Ball { float x; float y; float size; color col; void drawShape() { // Verwendet die eigene Farbe fill(col); // Verwendet die eigene Position und Größe ellipse(x, y, size, size); } }