kick off creative coding
TRANSCRIPT
the intention
the system
the intention
the system
the outcome
the intention
the system();
the outcome
the intention
“Infinity” by John Maeda’s (1993)
“Infinity” by John Maeda’s (1993) 10,000 interconnected loops, generated by algorithm.
John Maeda, Design By Numbers, P. 175
» But drawing a stroke with a pen is no different from drawing a stroke with a mouse. The real challenge is to discover the intrinsinc properties of the new medium and to find out how the stroke you "draw" via computation is one you could never draw, or even imagine «
The Preservation of Favored Traces by Ben Fry (2009)
http://benfry.com/traces/
Poetry On The Road 2003 Boris Müller 2003
Poetry On The Road 2003 Boris Müller 2003
http://www.esono.com/boris/projects/poetry03/visualpoetry03/visualpoetry.html
Generated Entropy Martin W Maier 2009
Generated Entropy Martin W Maier 2009
Generated Entropy Martin W Maier 2009
COP15 okdeluxe 2009
COP15 okdeluxe 2009
Computational Couture Mary Huang
Computational Couture Mary Huang
http://www.continuumfashion.com/Ddress/
My little piece of Privacy Niklas Roy 2010
The V Motion Project 2012
#Task1
Beschreibt ein Processing Projekt in einem 5 Minütigen Vortrag. Titel, Autor(ren), Kurzbeschreibung, Abbildung(en), Quelle1. Warum habt ihr das Projekt gewählt? (Ästhetische Gründe, interessiert euch das Thema…)
2. Was passiert im Hintergrund (Techniken), wie würdet ihr es umsetzen
www.processing.org http://www.creativeapplications.net
SMS Airplanes Christian Gross 2011
SMS Airplanes Christian Gross 2011
Algorithm
Algorithm
A language understood by both sides (sender and recipient)
Specific, simple instructions. Split up a problem into smaller ones.
Übung
Zeichne zwei 10x10cm Rechtecke auf ein leeres Blatt. Zeichne ein Bild darauf, sodass niemand es sehen kann. Finde einen Partner. Wenn Ihr beide fertig seid, dann erkläre dem anderen deine Zeichnung und erzeugt so eine Kopie.
Processing the programm
size(width, height);
size(100, 100);
size(100, 300);
Coordinate system and positions
point(0, 0);
point(120, 0);
point(0, 150);
point(340, 370);
line(x1, y1, x2, y2);
line(50, 20, 100, 100);
line(30, 10, 30, 80); line(50, 10, 50, 80); line(10, 10, 80, 95);
rect(x, y, width, height);
rect(50, 20, 20, 20);
rect(0, 0, 60, 60); rect(10, 10, 40, 70);
ellipse(x, y, width, height);
ellipse(50, 50, 30, 30);
ellipse(50, 50, 60, 50); ellipse(50, 50, 20, 30);
ellipse(x, y, width, height);
ellipse(50, 50, 30, 30);
ellipse(50, 50, 60, 50); ellipse(50, 50, 20, 30);
Other drawing functions
triangle(x1, y1, x2, y2, x3, y3);
quad(x1, y1, x2, y2, x3, y3, x4, y4);
curve(x1, y1, x2, y2, x3, y3, x4, y4);
arc(x, y, width, height, start, stop);
...
Color
background(color);
background(100, 0, 200);
background(100);
fill(red, green, blue);
ellipse(50, 50, 60, 50);
fill(100, 0, 200); ellipse(50, 50, 20, 30);
stroke(red, green, blue);
smooth();
stroke(255, 100, 0); ellipse(50, 50, 60, 50);
noStroke(); fill(100, 0, 200); ellipse(50, 50, 20, 30);
Transparency
smooth();
stroke(255, 100, 0); ellipse(50, 50, 60, 50);
noStroke(); fill(100, 0, 200, 30); ellipse(50, 50, 20, 30);
Transparency
smooth();
stroke(255, 100, 0); ellipse(50, 50, 60, 50);
noStroke(); fill(100, 0, 200, 30); ellipse(50, 50, 20, 30);
Other color functions
noStroke();
noFill();
strokeWeight(weight);
all Exercises in 500x500px
E1: Schreibe dein erstes Processing sketch. Zeichne eine Komposition aus sich kreuzenden Linien und einem Rechteck auf ein Blattpapier, danach kopiere dies mit Processing.
E2: Zeichne ein Gesicht Zeichne eine Anordnung verschiedener Kreise auf einfarbigem Grund.
Verwende nur Graustufen sowie die Befehle: »size«, »background«, »fill«, »noFill«, »stroke«, »noStroke«, »strokeWeight«, »ellipseMode« und »ellipse«.
E3: Erzeuge eine Kopie Du hast alle Werkzeuge die dir Processing bietet.