Mit der Version 1.0 von Processing.js – erschienen Anfang November – kommt die für Designer besonders geeignete Programmiersprache nun ins Web. Und das bedeutet auch: In Kombination mit HTML5 könnte Processing.js beispielsweise unter iOS ein Flash- und Silverlight-Killer werden. Für die User Interface Design GmbH (www.uid.com) haben Art Director Markus Knauer und Software Engineer Manuel Hofmeister einen ersten Einsatz gewagt: sie haben mit Processing.js und HTML5 ein Weihnachtsspecial realisiert – eines mit einem guten Zweck noch dazu.

Ein bisschen länger, als gedacht, hat es schon gedauert: „Wir haben rund 10 Tage für die Anwendung gebraucht. Eigentlich wollten wir schneller sein, aber wir hatten ein paar unvorhergesehene Schwierigkeiten“, erklärt Markus Knauer. Auch die Schneeflöckchen mit angemessener Performance rieseln zu lassen, war nicht ganz so einfach, wie erwartet.

Ein dynamisches Processing-Partikelsystem sorgt unter www.uid.com/christmas2010/index.html dafür, dass viele gute Wünsche von Usern – über eine generative Animation in Schneeflocken verpackt – durch eine Winterlandschaft rieseln. Das Besondere: die Schneeflocken werden direkt auf ein HTML5-Canvas-Element gezeichnet. Plug-ins oder proprietäre Software-Tools sind also nicht mehr notwendig.

Unser Weihnachtswunsch an alle Leser!

Den Grund für die Wahl der Technologien, beschreibt Markus Knauer wie folgt: „Wir sind immer an neuen Technologien interessiert“. Außerdem zeige sich immer wieder, dass das Interesse an Open-Source-Lösungen – vor allem in Forschungsprojekten – sehr groß ist. Und: „Die Debatte um Flash auf dem iPhone oder iPad lässt erahnen, dass sich HTML5 in Kombination mit Tools wie processing.js künftig in den Wettstreit von Flash und Silverlight einmischen könnte“, findet Knauer.

Das Potential von Processing.js schätzt UID jedenfalls positiv ein: Sobald Processing.js seine Kinderkrankheiten abgelegt habe – so Knauers Fazit – könne es durchaus eine ernst zu nehmende Flash- oder Silverlight-Alternative werden. Und das mit dem Vorteil, dass es sich hierbei um eine OpenSource-Lösung mit einer äußerst aktiven Community handelt:

„Processing ist in den letzten Jahren gereift und wurde lange und in unzähligen Updates verbessert und erweitert. Dank der großen und etablierten Community existiert eine Vielzahl von Librarys und Tools, die Processing auf verschiedenste Anwendungsgebiete erweitern und die stabil und zuverlässig arbeiten. Processing ist sehr performant. Gleichzeitig gibt es viele gute Bücher, Blogs und Tutorials, die den Einstieg erleichtern und bei schwierigen Fragen weiterhelfen“, erklärt Knauer.

Links: Manuel Hofmeister (Software Engineer). Rechts: Markus Knauer (Art Direktor), UID.

Processing.js ist im Vergleich dazu natürlich noch ein absolut junges Tool. „Man ist (noch) viel eher mit Bugs und Workaraounds konfrontiert – zudem ist es recht Performance-hungrig und bietet bisher nur einen kleinen Teil des Funktionsumfangs von Processing“, räumt Knauer ein. Auch die Ressourcen zum Erlernen von Processing.js sind naturgemäß noch nicht so umfangreich. Aber: „Dafür hat Processing.js den unschlagbaren Vorteil, dass es direkt auf das Html5-Canvas zeichnen kann ohne dass man ein Java-Applet starten muss“, so Hofmeister.

Zur Frage der Konkuzzenzfähigkeit von Processing.js gegenüber Flash & Co. meint Markus Knauer: “”Wir hatte in unserem Fall ein Partikelsystem aus insgesamt 600 einzelnen Objekten – also Bedarf an viel Performance. Diese Anforderung dürften nicht allzuviele Anwendungen stellen. Animationen mit wesentlich weniger Objekten stellen überhaupt kein Problem dar. Zudem gibt es bisher einige Funktionen, die vermutlich noch nicht für Processing.js optimiert wurden und dadurch zur Zeit noch etwas unperformant sind. Ich gehe davon aus, dass diese Probleme in der Zukunft gelöst werden”. Somit sei die Frage nach der Konkurrenzfähigkeit momentan auch noch Spekulation. “Berechtigte Hoffnungen bestehen aber durchaus”, ergänzt Knauer.

Auch bei der Browserfragen sieht es wohl schon ganz gut aus: „Problemfrei läuft die Anwendung in den meisten aktuellen Browsern wie Firefox, Safari, Opera oder Chrome Beta“, erklärt Hofmeister. Der aktuelle Internet Explorer bildet mal wieder eine Ausnahme – aber der IE 9 Beta hat die neue Technologie integriert und kann die Anwendung somit anzeigen. Und so ist es wohl vor allem noch eine Frage der Zeit, bis mit Hilfe von Processing.js und HTML5 zahlreiche neue, interessante Visualisierungen entstehen.

Generative Gestaltung fasziniert seit Jahren durch ihren enormen Output. Aber bringt sie die Gestaltung im Sinne einer neuen Ästhetik oder Formsprache weiter? Der Designer Julian Koschwitz hinterfragt in der WEAVE 06.2009 kritisch die aktuellen Entwicklungen und regt dazu an, die der Natur zugrunde liegenden Strukturen und Algorithmen als Inspirationsquelle zu nutzen. Eine Linkliste mit interessanten Beispielen in dieser Richtung hat er im Folgenden zusammen gefasst (übrigens: wir haben Joshua Davis bei der Adobe Max Anfang Oktober in Los Angeles getroffen – er ist ja seit Jahren derjenige, der für die Ausübung generativen Designs schlechthin steht – und ein Video-Interview mit ihm geführt…):

www.james-thompson.co.uk/Main_Work_GenerativeTypography.html

Das generative Typo-Experiment von James Thompson basiert auf Strukturen von Viren

www.opensysdesign.com

Branching-Projekt von Marco Vanucci, bei dem Gebäude auf Grundlage von mathematischen Formel geformt werden, die das Wachstum von Ästen beschreiben

tinyurl.com/n5yxus

Resolution Wall ist ein Architektur-Experiment an der ETH Zürich, bei dem die optimale Architektur eines Gebäudes auf Basis generativer Algorhitmen berechnet wurde

www.interaktivegestaltung.net

Michael Schmitz’ Schriften in seinem Projekt »genoTyp« basieren auf genetischen Regeln

www.james-thompson.co.uk

Typografische Experimente von James Thompson, denen virale Strukturen zugrundeliegen

tinyurl.com/cme2ob

Mitchell Whitelaw programmierte auf Basis des nach dem Mathematiker Murray Eden benannten Eden-Modells (1961) zur Berechnung des Zellwachstums eine Anwendung, die den Buchstaben “D” ornamental mit Ranken durchwachsen lässt

www.jorislaarman.com

Der Bone Chair des Designers Joris Laarman folgt der Frage, wie Stühle wachsen würden, hätten sie Knochen

www.theverymany.net

Die New Yorker Agentur theverymany experimentiert viel mit generativer Gestaltung. Zum Beispiel kreirte sie so die Skulpturen „Echinoids“

www.levitated.net

Auf der Website des Medienkünstlers Jared Tarbell sind viele interessante Kunstwerke zu finden, die mittels generativer Gestaltung entstanden und sich die Natur zum Vorbild oder zur Inspiration nehmen

Tools, die generative Gestaltung einfach ermöglichen

scriptographer.org

Illustrator-Plug-In Scriptographers von Jürg Lehni für generative Gestaltung

Processing.org

“Processing is an open source programming language and environment for people who want to program images, animation, and interactions.”