creative coding

Matthias Kappeler

technologieGrundlagen 1

Max Rheiner

17. - 31.Okt. 2011

ZHdK, VIAD, 1. Semester

2—

—Matthias Kappeler | Product Design Basics | HS2011

Der Titel dieses Moduls liess böses erahnen: Technologie – Grundlagen – und

im Untertitel versteckt sich sogar noch ein – Programmieren. Diese Begriffe

werden nicht mit Farbigem, Aufregendem, Schönem und Ästhetischem assozi-

iert, sondern mit Listen, Ziffern, und Kopfzerbrechen. Zwar ist zweitgenanntes

auch in diesem Modul sehr wohl vorhanden, der Fokus lag aber wo anders.

Auf den folgenden Seiten werde ich versuchen zu überzeugen, dass Pro-

grammierung – Creative Coding – nicht nur langweilige Listen und graue

Programme erzeugen kann, sondern auch Farbiges – Aufregendes – Schö-

nes – und Ästhetisches. Das verwendete Tool dazu ist Processing eine Java

Entwicklungsumgebung, die für Gestalter entwickelt wurde.

Da es sich bei diesem Modul um eine zweiwöchige Einführung in das Pro-

grammieren handelte, waren die ersten Schritte klein.

In der ersten erwähnenswerten Übung wurde die Funktion keyPressed einge-

führt, verbunden mit einer case-Fallüberprüfung die das Erkennen einzelner

Tasten ermöglicht. Als Ergebnis konnten folgende Emotionen über die Tasten

1-7 gesteuert/gewählt werden.

3—

—Matthias Kappeler | Product Design Basics | HS2011

Die erste Übung mit optisch überzeugendem Ergebnis (im vorgestellten Fall

ist das „überzeugendem“ mit Vorbehalt zu verstehen) behandelte die Ur-

sprungskoordinatenkontrollfunktionen pushMatrix() und popMatrix(). Was das

folgende Bild nicht zeigt, ist das nervöse, bei längerem Betrachten zu Delirium

ähnlichen Zuständen führende, Flackern der Farbe.

4—

—Matthias Kappeler | Product Design Basics | HS2011

Aus einer Kombination des Prinzips aus bei der vorherigen Übung, kombiniert

mit ersten for-Schlaufen sollten anschliessend unendlich fortlaufende Muster

erzeugt werden. Nach erstem ziellosem Experimentieren mit den neuen Werk-

zeugen habe ich mich der Optimierung der gefundenen Form gewidmet. Die

entstandenen Formen erzeugen durch feine Grauabstufungen eine Tiefen-

wirkung und entwickeln eine eigensinnige Plastizität. Die Ergebnisse sind in

chronologischer Abfolge vorgestellt.

5—

—Matthias Kappeler | Product Design Basics | HS2011

6—

—Matthias Kappeler | Product Design Basics | HS2011

7—

—Matthias Kappeler | Product Design Basics | HS2011

8—

—Matthias Kappeler | Product Design Basics | HS2011

9—

—Matthias Kappeler | Product Design Basics | HS2011

10—

—Matthias Kappeler | Product Design Basics | HS2011

In dieser Aufgabe ging es um das Erstellen von Fraktalen mit Hilfe einer

rekursiven Funktion. Die Ursprungsfunktion generierte einen Baum mit roten

Ellipsen als Blätter. Da ich das „von-unten-nach-oben-wachsen“ des Baumes

als eine starke Einschränkung empfand, versuchte ich als erstes die Wachs-

tumsrichtung zu beeinflussen. Bis ich den erstrebten, sternförmigen Aufbau

erreichte, sind ein paar interessante Zwischenergebnisse entstanden.

11—

—Matthias Kappeler | Product Design Basics | HS2011

12—

—Matthias Kappeler | Product Design Basics | HS2011

13—

—Matthias Kappeler | Product Design Basics | HS2011

14—

—Matthias Kappeler | Product Design Basics | HS2011

Nach weiteren Versuchen konnte ich die Richtungseinschränkung erfolgreich

umsetzen und habe anschliessend begonnen mit verschiedenen Variationen

zu experimentieren. Nachfolgend eine Auswahl der Ergebnisse.

15—

—Matthias Kappeler | Product Design Basics | HS2011

16—

—Matthias Kappeler | Product Design Basics | HS2011

Um noch weiter von dem gleichmässigen, uniformen weg zu kommen,

entschloss ich mich das Programm auszuweiten zu einem kleinen Mal- oder

Zeichnungsprogramm.

17—

—Matthias Kappeler | Product Design Basics | HS2011

18—

—Matthias Kappeler | Product Design Basics | HS2011

19—

—Matthias Kappeler | Product Design Basics | HS2011

20—

—Matthias Kappeler | Product Design Basics | HS2011

21—

—Matthias Kappeler | Product Design Basics | HS2011

22—

—Matthias Kappeler | Product Design Basics | HS2011

23—

—Matthias Kappeler | Product Design Basics | HS2011

24—

—Matthias Kappeler | Product Design Basics | HS2011

Die weitern Übungen wie GUI-Elemente und Kinect-Steuerung habe ich direkt

in das oben vorgestellte Malprogramm miteingearbeitet. Ein einfaches UI

ermöglicht das Ein/Ausstellen der Farbe, die Pinsel können über Buttons ge-

wechselt werden und auch der Alphawert des Pinsels kann per Slider justiert

werden.

25—

—Matthias Kappeler | Product Design Basics | HS2011

26—

—Matthias Kappeler | Product Design Basics | HS2011

Sanduhren, Sonnenuhren, Uhren mit Federzug, Uhren mit Quarzschwinger,

Digitaluhren, Uhren mit Erdrotationsbeschleunigungszeitmesspiezozylinder-

system und viele andere Methodern hat der Mensch gefunden um Zeit zu

messen und wiederzugeben (ok, ja, das Erdding gibt es nicht). Processing

verfügt über einfache Methoden, die ein Auslesen der Systemzeit ermöglichen.

Die unten gezeigten Screenshots zeigen fünf verschiedene Variationen, wie

die Zeit digital dargestellt werden kann. Dabei lag mein Fokus (offensichtlich)

nicht bei optimierter Leserlichkeit, sondern darauf, interessante Abwandlungen

der gewöhnlichen Analoguhr zu finden.

27—

—Matthias Kappeler | Product Design Basics | HS2011