http://www.creativecoding.org/ Mon, 22 Mar 2010 20:37:44 +0100 FeedCreator 1.7.2-ppt DokuWiki http://www.creativecoding.org/lib/images/favicon.ico http://www.creativecoding.org/ http://www.creativecoding.org/de/p5/basics/lesson1?rev=1238617244&do=diff In dieser Workshopreihe dreht sich alles um das Gestalten von genarativen und interaktiven Systemen mittels der open source Umgebung Processing. Sie ermöglicht Interessierten, ohne Programmierhintergrund, einen schnellen und simplen Einstieg in das Arbeiten mit Code – für einen grafischen Output. Ohne aufwendige Vorbereitung erlaubt Processing das Zeichnen von grafischen Elementen und die Verwendung von Input, z.B. durch Maus und Tastatur. Das Projekt wurde von Ben Fry und Casey Reas 2001 am MI… de:p5:basics Wed, 01 Apr 2009 22:20:44 +0100 http://www.creativecoding.org/de/p5/basics/lesson10?rev=1237553096&do=diff Wiederholung: Datentypen Durch die Einführunf von Variablen haben wir die Möglichkeit kennen gelernt unterschiedlich Formen von Daten zu speichern, auszulesen und zu verändern. Folgende Datentypen kennen wir bereits: * Interger - simple Ganzzahl, beispielsweise 0, 1, 8, -25, etc. siehe Referenz int number = 10; de:p5:basics Fri, 20 Mar 2009 13:44:56 +0100 http://www.creativecoding.org/de/p5/basics/lesson11?rev=1239782437&do=diff Bei der Einführung von sich endlos wiederholenden Programmen haben wir zwei Bestandteile kennengelernt, die wir bisher nicht weiter hinterfragt hatten. void setup() { } void draw() { } Auch die Events für Mouseclicks und Tastatureingaben funktionierten nach dem selben Prinzip. de:p5:basics Wed, 15 Apr 2009 10:00:37 +0100 http://www.creativecoding.org/de/p5/basics/lesson12?rev=1238616238&do=diff Aus Lesson 3 sind uns Zeichenketten (in Processing mit String betitelt) bekannt. Sie beinhalten Informationen über Schriftzeichen die wir mit text() abbilden können. Anders als bei int und float handelt es sich bei String um einen komplexen Datentyp. Dies erkennen wir an der Großschreibung und dem nicht orange eingefärbt werden im Processing Texteditor. Komplexe Datentypen besitzen einen erweiterten Umfang von Speicher- und/oder Funktionsmöglichkeiten. Beispielsweise erlauben uns Variablen vom T… de:p5:basics Wed, 01 Apr 2009 22:03:58 +0100 http://www.creativecoding.org/de/p5/basics/lesson13?rev=1237418760&do=diff Es empfiehlt sich permantent den Entwicklungsstand von Projekten grafisch zu dokumentieren. Dabei geht es weniger um Veröffentlichungen — sondern um das Nachvollziehen des durchlaufenen Prozesses bei der Bearbeitung des Themas. Oft kommt es auf dem Weg zum Resultat zu interessanten Entdeckungen von grafischen Konstellationen aus älteren Abeitsständen, die wieder in den gegenwärtigen Stand übernommen werden. de:p5:basics Thu, 19 Mar 2009 00:26:00 +0100 http://www.creativecoding.org/de/p5/basics/lesson14?rev=1263256373&do=diff Kamera Input Der Video Datentyp * Capture ist der Datentyp zum Ablegen von Bewegtbildern die von angeschlossenen Aufnahmegeräten, wie z.B. Webcams, kommen. Mit new Capture (this, BREITE, HÖHE); kann auf diese zugegriffen werden. Optional kann der Gerätename und die Anzahl der Einzelbilder von der Kamera angegeben werden. Wenn kein Gerät namentlich aufgeführt wird, selektiert Processing das letzte aus der mit Capture.list() erfragbaren Liste mit verfügbaren Geräten. Die Anzahl der Einzelbilde… de:p5:basics Tue, 12 Jan 2010 01:32:53 +0100 http://www.creativecoding.org/de/p5/basics/lesson15?rev=1240657065&do=diff Diese Lesson soll das Konzept des Objektorientierten Programmierens (kurz OOP) erläutern, sowie die dafür nötigen Code-Elemente Vorstellen. Grundgedanke Ein modulares Programm besteht aus einzelnen Modulen, von den jedes eine bestimmte Aufgabe erfüllen soll. Von Variablen kennen wir den Ansatz der Wiederverwendbarkeit. Sie ermöglichen es einem einzelnen Wert mehrfach in einem Programm aufzutauchen, so dass dieser einfach geändert werden kann. Funktionen abstrahieren eine bestimmte Aufgabe und… de:p5:basics Sat, 25 Apr 2009 12:57:45 +0100 http://www.creativecoding.org/de/p5/basics/lesson16?rev=1267134257&do=diff Viele Sketchen wurden in den vergangenen Abschnitten mit Daten versorgt. Neben den klassischen Eingabeformen von Maus und Tastatur gaben wir Aufschluss über das Auslesen von Textdateien und die Anbindung der Kamera. All diese Formen des 'inputs' lassen eine Steuerung des sog. Programmablaufs und das erzeugte Resultat zu. Um komplexere Systeme in die Applikation einzubeziehen, zeigen wir in diesem Teil wie man mittels Processing mit etablierten Datenformaten umgeht. de:p5:basics Thu, 25 Feb 2010 22:44:17 +0100 http://www.creativecoding.org/de/p5/basics/lesson17?rev=1246408330&do=diff Sound in Processing Die minim Bibliothek * Minim(this) Eine Instanz der Minim Klasse dient als Schnittstelle zur Soundkarte. Nach dem Importieren kann diese mit new erzeugt werden. Dabei muss jeder Minim-Instanz eine Referenz auf den Processing-Sketch in Form eines Parameters übergeben werden. Minim m = new Minim (this); de:p5:basics Wed, 01 Jul 2009 02:32:10 +0100 http://www.creativecoding.org/de/p5/basics/lesson2?rev=1239709169&do=diff In der zweiten Veranstaltung der Kursreihe geht es um den Aufbau von endlos laufenden Programmen, die Einbindung des Mauszeigers und der Maustaste. Fortlaufende Programme Grundsätzlich werden alle im Vorherigen geschriebenen Programme nach einmaligem Durchlaufen beendet. Das Resultat wird im definierten Fensterbereich abgebildet – weitere Modifikationen am Dargestellten durchzuführen ist jedoch nicht möglich. Um dies zu ermöglichen müssen im Programm spezielle Bereiche angelegt werden. Block … de:p5:basics Tue, 14 Apr 2009 13:39:29 +0100 http://www.creativecoding.org/de/p5/basics/lesson3?rev=1238181890&do=diff Kommunikation basiert auf dem Austausch von Daten. Entscheidungen werden mit ja – nein gefällt. Die Kühlschranktemperatur ist meist ein Wert zwischen 0 und 5 Grad Celsius. Einem Menschen werden Reihungen von Zeichen zur Identifikation mitgegeben. Diese Art der Aufladung von Gegenständen und Individuen mit Informationen kann auch in Programmiersprachen verwendet werden. Belegt wird dabei immer eine Variable mit einem Wert – eine Schublade bekommt ihren Inhalt. Mit dem Wissen den Namen der Schubla… de:p5:basics Fri, 27 Mar 2009 20:24:50 +0100 http://www.creativecoding.org/de/p5/basics/lesson4?rev=1239708974&do=diff random Für Anzahl, Farbe, Form und Position die Würfel fliegen lassen. * random(a) erzeugt eine Zufallszahl zwischen 0 und a, wobei a eine rationale oder gebrochen rationale Zahl sein kann. Bei dieser Parameteranzahl legen wir demnach nur die Obergrenze des möglichen Wertebereiches fest. Die Untergrenze ist durch Processing auf 0 gesetzt. // z.B.: 0.8751683 println (random (1)); de:p5:basics Tue, 14 Apr 2009 13:36:14 +0100 http://www.creativecoding.org/de/p5/basics/lesson5?rev=1239709712&do=diff Um die Verwendung von Variablen zu strukturieren gelten diese stets nur für einen bestimmten Bereich des Programms – einem Block. Blöcke werden durch geschweifte Klammern gebildet. Das bedeutet, dass setup(), draw(), mousePressed(), etc. als auch if-Abfragen und for-Schleifen eigene Blöcke bilden. Das folgende Bild zeigt die Blockstruktur an einem Beispiel. de:p5:basics Tue, 14 Apr 2009 13:48:32 +0100 http://www.creativecoding.org/de/p5/basics/lesson6?rev=1254218957&do=diff Farben II In Lesson 1 wurde das Festlegen von Farbwerten für die Füllung und Umrandung von Elementen vorgestellt. Mittels der Befehle fill() und stroke() definieren wir seither, in unterschiedlichen Parameterkombinationen, die Anteiligkeit des Rot-, Grün-, Blau- und Alphakanals. Die Angabe aller drei bis vier Werte in den oben genannten Befehlen limitiert unser Arbeiten, da wir immer alle drei (bzw. vier) kennen müssen. Stellen wir uns vor das wir von einer beliebigen Farbe den Rotanteil um 40 … de:p5:basics Tue, 29 Sep 2009 12:09:17 +0100 http://www.creativecoding.org/de/p5/basics/lesson7?rev=1237545713&do=diff Schriften in Processing Innerhalb von Processing wird das Schriftformat vlw verwendet. Anders als bei Vektorschriften liegt dabei jedes Zeichen seperat als gerastertes Bild vor. Diese Bildinformationen beschränken sich pro Pixel auf die Angabe von schwarz (1) oder weiß (0) – wird das Pixel gefüllt oder nicht. Eine solche Schrift nennt man deshalb Bitmap-Font (Bit), da nur zwei Möglichkeiten existieren. Grund für diese umständliche und qualitativ ungünstige Lösung ist die Funktion des Webexports… de:p5:basics Fri, 20 Mar 2009 11:41:53 +0100 http://www.creativecoding.org/de/p5/basics/lesson8?rev=1269257951&do=diff Bildanimation Dieser erste Abschnitt steht für die digitale Form eines Daumenkinos. Durch die schnelle Abfolge von ähnlichen, aber nicht gleichen, Bildern in ausreichend zügiger Geschwindigkeit kommt es zur Wahrnehmung einer Bewegung. Alle Bilder werden dafür im Teil des setup() geladen und im draw() je nach Bedarf abgebildet. Die Entscheidung welches der Einzelbilder auf der Zeichenfläche erscheint wird beim automatisierten Ablauf anhand einer Variable gefällt. Global instanziert bildet sie da… de:p5:basics Mon, 22 Mar 2010 12:39:11 +0100 http://www.creativecoding.org/de/p5/basics/lesson9?rev=1237548829&do=diff Bisher haben wir in Processing lediglich die Möglichkeit kennengelernt, einfache geometrisch Grundformen in der Sketch anhand der aufgerufenen Methoden zu positionieren. Auch bei Bildern und Texten funktionierte das nur nach diesem Prinzip: // zeichne ein Rechteck an der Position x, y rect(x, y, breite, höhe); // zeichne ein Bild an der Position x, y image(img, x, y); // zeichne Text an der Position x, y text("Creative Coding", x, y); de:p5:basics Fri, 20 Mar 2009 12:33:49 +0100