ScribbleAI: Vom Kritzeln zum Kunstwerk
Freie Nutzung von Text & Abbildungen & Video mit einem Unidigital-Zugang
Es gibt einige Online-Tools, die simples Gekritzel in echte Kunstwerke umwandeln. Aber kann ich solche Anwendungen auch selber erstellen? Ja, das funktioniert mit Vibe Coding und geeigneten KI-Umgebungen wie dem Gemini-Chat. Hierbei ist es wichtig, dass der KI-Anbieter neben einem Top-Sprachmodell wie Gemini, das für den Programmiervorgang zuständig ist, ebenfalls über eine eigene Bild-KI wie Nano Banana verfügt.
Bevor ich mit dem Entwicklungsprozess starte, wird über Gemini ein detaillierter Prompt formuliert, der möglichst alle Funktionen der geplanten App genau beschreibt. Zusätzlich wird im Gemini-Chat über das Plus-Symbol die Canvas-Funktion aktiviert. Dies sind die Voraussetzungen, um eine Anwendung im Vibe-Coding-Stil zu generieren.
Prompt:
Erstelle eine moderne Web-App, mit der Nutzer aus einfachen Maus-Kritzeleien hochwertige Bilder in verschiedenen Kunststilen generieren können.
Die App soll ein Zeichenfeld enthalten, auf dem Nutzer mit der Maus oder dem Finger grobe Skizzen zeichnen können. Beispiel: Der Nutzer zeichnet einen einfachen Baum, klickt auf „Generate“, und die App verwandelt die Skizze in ein detailliertes, fotorealistisches Bild eines Baumes.
Nach der Generierung soll der Nutzer das Bild in verschiedene Stile umwandeln können, zum Beispiel:
Fotorealistisch
Comic-Stil
Wasserfarben
Neonpunk
Ölgemälde
Anime
Pixel Art
3D Render
Bleistiftzeichnung
Fantasy Art
Die App soll folgende Funktionen haben:
Ein großes, responsives Zeichenfeld mit weißem Hintergrund.
Werkzeuge zum Zeichnen, Radieren, Rückgängig machen, Löschen und Ändern der Pinselgröße.
Einen „Generate“-Button, der aus der Skizze ein fertiges Bild erstellt.
Eine Stilauswahl mit visuellen Buttons oder Dropdown-Menü.
Eine Vorschau des generierten Bildes.
Die Möglichkeit, dasselbe Motiv nachträglich in anderen Stilen neu zu rendern.
Download-Funktion für das fertige Bild.
Eine moderne, minimalistische Benutzeroberfläche mit klaren Icons, abgerundeten Karten, sanften Schatten und guter mobiler Bedienbarkeit.
Eine kurze Texteingabe, mit der Nutzer zusätzliche Details ergänzen können, zum Beispiel: „großer alter Baum bei Sonnenuntergang“.
Einen Ladezustand mit Animation während der Bildgenerierung.
Das Design soll kreativ, clean und intuitiv sein. Die App soll sich wie ein professionelles AI-Kreativtool anfühlen. Verwende eine dunkle, elegante Oberfläche mit Akzentfarben in Blau, Lila oder Neon-Grün. Die Nutzerführung soll einfach sein: zeichnen, Stil auswählen, generieren, Ergebnis speichern.
Baue die App so, dass sie später leicht mit einer Bildgenerierungs-API verbunden werden kann. Verwende dafür eine klare Struktur mit separaten Funktionen für das Erfassen der Skizze, das Auswählen des Stils, das Erstellen des Prompts und das Anzeigen des generierten Bildes.
Mit ScribbleAI habe ich über Gemini eine App entwickeln lassen, die mein Gekritzel nach der Auswahl einer Stilrichtung automatisch in ein hochwertiges Bild transformiert. Es reicht aus, wenn die Bildelemente wie im Beispiel ein Zeppelin mit Luftströmung und ein oben rechts dargestellter Mond so ungefähr zu erkennen sind. Es bedarf also keinerlei hochwertiger Zeichnungen.
Unterhalb des Zeichenfeldes kann ich die Stärke des „Stifts“ je nach Bedarf dünner oder dicker einstellen. Über den Radiergummi lassen sich einzelne Bestandteile entfernen. Mit einem Klick auf den Papierkorb wird das Zeichenfeld komplett geleert und man kann von Neuem starten.
Die App ScribbleAI ist in der ersten Version recht einfach gehalten und ließe sich jederzeit um weitere Funktionen über die Versionen 2,3,4 bis X ergänzen. Nach einem Klick auf den Button „Kunstwerk erstellen“ wird ein Bild mithilfe der Bild-KI Nano Banana entwickelt und steht anschließend zum Download bereit.
Neben dem Zeichenfeld befindet sich der Block „Stil auswählen“, in dem zum Beispiel von „Fotorealistisch“ auf „Comic“ oder „Neonpunk“ gewechselt werden kann. Ich entscheide mich für die futuristische Stilrichtung „Neonpunk“ und klicke wieder auf „Kunstwerk generieren“, um den Zeppelin neu zu designen.
Auch diese Übertragung von meinem anfänglichen Gekritzel hin zu der Darstellung eines Zeppelins, der in ein sehr futuristisches Szenario eingebettet ist, war erfolgreich. Solche Abbildungen lassen sich direkt herunterladen und wie hier im Blogbeitrag in die eigene WordPress-Mediathek hochladen.
Generell eignet sich der Gemini-Chat mit der Canvas-Funktion sehr gut, um Apps zu entwickeln, die eine Bilderstellung ermöglichen. Die Anwendung sollte zu Beginn mit wenigen Funktionen ausgestattet sein, um sie dann Schritt für Schritt zu erweitern. Ist die Vibe-Coding-App überladen, kann es schnell unübersichtlich werden. Viel Erfolg!
Autor
