Partikelsysteme in JavaScript und P5.js

Creative Coding
Spieleprogrammierung
JavaScript
P5.js
Autor:in

Jörg Kantel

Veröffentlichungsdatum

14. Juli 2026

Auch wenn ich vielem von dem zustimme, was Ralf Stockmann in seinem am Donnerstag hier vorgestellten Video »Wir müssen uns Schrödingers Katze als halbtot vorstellen – Über KI, Urteilskraft und die Kunst, Widersprüche auszuhalten« anführte, werde ich einer Empfehlung von ihm nicht folgen: Ich werde Vibe-Coding weiterhin meiden, wie der Teufel das Weihwasser. Denn für mich ist Programmieren eine kreative Tätigkeit, die mir Spaß macht, und dieses Vergnügen möchte ich nicht an eine gekünstelte Intelligenzia abtreten.

Das führt aber direkt zu einer weiteren Baustelle, die neben der Erstellung interaktiver Geschichten und Spiele bei mir noch offen ist. Hier hatte ich schon erwähnt, daß ich mich in Zukunft im Bereich des Creative Coding oder Generative Art, wie auch der Spieleprogrammierung verstärkt JavaScript, speziell P5.js, dem JavaScript-Ableger von Processing (Java), zuwenden werde, weil die Kehrtwendung zur gekünstelten Intelligenzia, die Python derzeit gerade vollzieht, ist nicht wirklich mein Ding ist.

Und unser aller Datenkrake würde einen schlechten Job machen, wenn sie nicht dazu passend ein paar Tutorials in meinen Feedreader spülen würde. Das obige Video »Data-Driven Particles: More Effects, Less Code« von Franks Laboratory ist Teil der umfangreichen Playlist »Vanilla JavaScript Game Development Course«, die aus momentan zwölf halbstündigen bis einstündigen Videos zur Spieleprogrammierung mit purem JavaScript und dem HTML-Canvas-Element besteht.

Das letzte Video mit den Partikeln ist gerade einmal drei Tage alt, die Playlist kann also noch aktualisiert werden. Am Ende sollt Ihr über ein wiederverwendbares JavaScript-Framework für die Spieleprogrammierung verfügen.

Partikelsysteme sind nicht nur für die Spieleprogrammierung, sondern generell im Bereich Creative Coding und Generativ Art ein nützliches Werkzeug. Daher gibt es natürlich auch von Patt Vira eine Playlist »Particle Systems with P5.js« die aus fünf je etwa halbstündigen Videos besteht, und die mit dem obigen Video »Fireworks« eingeleitet wird.

Von Franks Laboratory gibt es noch eine weitere interessante Playlist »Generative Art for Beginners – Learn Creative Coding«, die eigentlich schon drei Jahre alt ist und auch nur reines JavaScript und den HTML-Canvas benutzt. Sie hat aber mit obigem Video »HTML Canvas Deep Dive 2026« Anfang dieses Jahres noch ein Update erfahren.

War sonst noch was? Ach ja, Patt Vira hat auf dem Processing Community Day am 3. Juli dieses Jahres in Taiwan den Vortrag »Why Technical Literacy is Your Ultimate Defense Against AI« gehalten. Sie drückt darin vieles aus, was auch auf meiner Linie liegt.


Bild: Auf einem fernen Planeten, erstellt mit OpenArt. Prompt: »At night, @Qumbo and @Rudi Rabbit stand on an alien planet—in a desolate desert landscape with gentle hills in the background—watching a massive, colorful fireworks display in the sky. On the left edge stands a cartoon-style spaceship on stilts, with its boarding stairs extended. Alongside the fireworks, two moons and various planets are visible in the sky. Classic American comic book style. No speech bubbles, no text boxes.« Modell: Nano Banana 2.