• Zuhause
  • Artikel
  • Neuerstellen von Gemälden mit Generative Art unter Verwendung von p5.js
Veröffentlicht am 26-05-2019

Neuerstellen von Gemälden mit Generative Art unter Verwendung von p5.js

Ein Bündel zufälliger, schnörkeliger Linien wird gezeichnet, um ein Porträt von Van Gogh zu erzeugen.

Die obige Methode verwendet zwei Konzepte - Random Walk und Perlin Noise.

Stellen Sie sich vor, Sie gehen eine leere Straße entlang, es ist ein Feiertag und Sie haben die ganze Zeit auf der Welt. Alle 10 Sekunden wirfst du eine Münze. Köpfe, du machst einen Schritt nach vorne. Schwänze, es ist ein Schritt zurück. Dies ist im Wesentlichen, was ein zufälliger Spaziergang ist - ein Weg, der durch eine Reihe von zufälligen Schritten definiert wird.

Anstatt einer leeren Straße, nehmen wir an, es ist ein Labyrinth, in dem Sie die Möglichkeit haben, einen Schritt nach links und rechts sowie nach vorne und hinten zu machen. Nun nimmst du 2 Münzen und entscheidest auf der Grundlage ihres Flips eine Schrittrichtung, z. Wenn es Kopf und Kopf ist, machst du vielleicht einen Schritt nach vorne, einen Schritt nach links und so weiter.

Dies ähnelt dem oben beschriebenen Algorithmus. Linien werden zwischen zwei Punkten gezogen - ausgehend von einem Anfangspunkt (x1, y1) wird der Zielpunkt (x2, y2) basierend auf einer gewissen Zufälligkeit ausgewählt. In der nächsten Iteration wird der Anfangspunkt nun zur Vergangenheit (x2, y2) und das Ganze wiederholt sich noch einmal.

Um die Farbe zu erhalten, nehmen wir hier den RGB-Wert des Zielpunktes (x2, y2). Wir könnten auch den anfänglichen Pixelwert verwenden, aber da der Abstand zwischen den Punkten groß ist und häufig vom Hintergrund ausgeht, ist es sinnvoller, den Zielpixelwert zu verwenden. Eine rein persönliche Vorliebe.

Nun kommen wir zum Zufallsteil.

Fast alle Programmiersprachen und Bibliotheken haben eine random () -Funktion. Wir hätten das verwenden können, um eine zufällige Richtung zu erhalten und Linien entsprechend zu zeichnen, aber das Problem dabei ist, dass das Ergebnis, das wir erhalten, auch zufällig ist.

Ein interessanter Effekt, aber nicht ganz das, was wir wollen.

Wir möchten, dass unsere Linien zufällig sind, aber auch eine Art Muster, sodass das Endergebnis nicht ganz so chaotisch ist.

Geben Sie Perlin Noise ein.

Erfunden von Ken Perlin, ist dies eine Möglichkeit, Punkte auf zufällige Weise zu erhalten, die jedoch auch einem bestimmten Muster folgen.

So sieht zufälliges Rauschen aus - aufeinanderfolgende Punkte, die nach dem Aufrufen einer Zufallsfunktion abgerufen und dann geplottet werdenSo sieht Perlin-Rauschen aus - aufeinanderfolgende Punkte, die nach dem Aufrufen der 2D-Perlin-Rauschfunktion abgerufen und dann geplottet wurden.

Die Punkte sind in beiden Fällen zufällig, doch im zweiten Bild haben sie eine visuelle Ästhetik.

In p5.js ergibt ein einfacher Aufruf von noise () anstelle von random () diese Art von Muster, mit dem wir die halbzufälligen Zielpunkte ermittelt haben.

Wenn es Ihnen langweilig ist, nur Van Gogh zu sehen, wird der Code hier live bereitgestellt. Jedes Mal, wenn Sie die Seite aktualisieren, erhalten Sie ein neues, zufälliges Bild.

~ https://unographymag.com/void

Ein paar Ressourcen zum Auschecken:

  1. Daniel Shiffman auf Random Walk
  1. Daniel Shiffmans Einführung in Perlin Noise

Ursprünglich veröffentlicht unter https://dhruvkaran.com.

Siehe auch

Stand der TechnikKreativität als sorgfältige AnnäherungAnn Veronica Janssens bei Micheline SzwajcerDuveenDIE INSTALENZLondons letztes Abendmahl: Besser als das von Leonardo?