R&D LAB Computational Design Ausgeliefert Bildwerkzeug
Tessera-Mosaic
Bild hinein, malbarer Bogen heraus
Jedes Bild wird in flache Farbfelder zerlegt, jedes Feld bekommt eine Nummer, und heraus kommt ein druckbarer Vektorbogen mit Legende, ohne dass das Bild den Tab verlässt.
- 96Farben höchstens, ab 12 frei wählbar
- 12Stufen in der Kette
- 0,8 slängste Rechenzeit auf dieser Seite
- 0Netzanfragen
Der druckbare Bogen, hier am prozedural gezeichneten Beispielbild, mit dem die Anwendung ohne jede Datei startet: 46 Felder, 25 Farben. Haarlinien, in jedem Feld eine Ziffer, darunter die Legende mit Farbfeld, Nummer, nächstliegendem Farbnamen, Hex-Wert und Flächenanteil.
Publikationsgrund
Der Schritt von einem Bild zu etwas, das jemand tatsächlich in die Hand nimmt, ist kein Filter, sondern eine Kette von Entscheidungen mit Nebenbedingungen: Segmentierung, Zusammenfassen, Vereinfachen, Beschriften. Tessera-Mosaic ist unser Beleg, dass wir eine solche Kette bauen und an ihren eigenen Randbedingungen prüfen, statt am Ende ein Bild zu zeigen und das Beste zu hoffen.
Ein Malbogen nach Zahlen sieht nach einem Filter aus und ist keiner. Die Zahl in einem Feld setzt voraus, dass das Feld groß genug zum Ausmalen ist, dass es nicht so dünn ist, dass ein Pinsel nicht hineinpasst, dass es eine Stelle hat, an der die Ziffer vollständig steht, und dass die Farbe daneben von ihren Nachbarn unterscheidbar ist. Tessera-Mosaic ist die Kette von Schritten, die diese vier Bedingungen gleichzeitig erfüllt, und drei Ansichten, in denen man das Ergebnis vor dem Farbkauf beurteilen kann.
Eine Fotografie hat keine Felder
Sie hat Verläufe, Rauschen und Kanten, die nirgends genau anfangen. Ein Malbogen braucht das Gegenteil: geschlossene Gebiete, jedes groß genug für einen Pinsel, jedes mit einer Farbe, die man kaufen und wiederfinden kann. Zwischen beidem liegt keine Einstellung, sondern eine Kette.
Vier Bedingungen müssen gleichzeitig gelten, sonst ist der Bogen unbrauchbar. Ein Gebiet braucht genug Fläche. Es darf nicht so schmal sein, dass kein Pinsel hineinpasst. Es braucht eine Stelle, an der die Ziffer vollständig steht. Und seine Farbe muss von den Nachbarn unterscheidbar bleiben. Jede einzelne dieser Bedingungen ist leicht, zusammen sind sie die Aufgabe.
Der Bogen daneben ist aus einer gemeinfreien Landschaftsaufnahme gerechnet, 914 x 1280 Pixel, auf 714 x 1000 Arbeitspixel heruntergesetzt. Heraus kamen 239 Gebiete in 24 Farben, 10,9 m Umriss, 0,8 s Rechenzeit. Die Fußzeile nennt jede dieser Zahlen, bevor jemand druckt.
Die ganze Kette läuft im Arbeiterthread
Zwölf Stufen, in sechs Schritten gelesen
- 01 In einen Farbraum, in dem Abstand etwas heißt sRGB geht nach CIELAB. Erst dort heißt ein kleiner Abstand zwischen zwei Farben auch, dass ein Auge sie schwer trennt, und erst dort ist die spätere Palettenwarnung eine echte Zahl statt eines Gefühls.
- 02 Rauschen weg, Kanten behalten Ein separabler bilateraler Filter mit Radius 0 bis 4 glättet Flächen und lässt Kanten stehen, damit der nächste Schritt nicht Korn zu einer eigenen Farbe erklärt.
- 03 Die Palette rechnen Gewichtetes k-Means in Lab, k-Means++ als Start, 32 Lloyd-Durchläufe, und zwei Startpunkte fest am 1. und 99. Helligkeitsperzentil, damit Licht und Schatten nicht wegmitteln. Die Zuordnung ist exakt und ungedithert: ein Dither wäre hier kein Effekt, sondern ein unmalbares Feld.
- 04 Aus Pixeln werden Gebiete Ein Mehrheitsfilter über drei mal drei stimmt Sprenkel weg, danach werden 4-verbundene Komponenten gezählt. Ab hier arbeitet die Kette nicht mehr mit Farben, sondern mit Flächen.
- 05 Zu klein oder zu dünn zusammenlegen Union-Find bis zum Fixpunkt, mit zwischendurch neu gerechneter Abstandskarte. Zu dünn ist die Bedingung, an der die meisten Werkzeuge scheitern: ein langes schmales Band besteht jede Flächenprüfung und nimmt trotzdem keinen Pinsel auf.
- 06 Rand, Umriss, Ziffer Ränder werden als Kanten und Ketten aufgebaut, jede Kette einmal geglättet (Douglas-Peucker, Chaikin, Douglas-Peucker), die Umrisse zusammengesetzt, die Farben nach bemalter Fläche neu nummeriert und erst dann die Ziffern gesetzt.
Die Pipeline baut ein Mosaik auf
Die eine Entscheidung
Eine Gleitkommazahl entschied, ob ein Bild malbar ist
Drei der fünf Palettenstufen lieferten lange nicht, was auf ihnen stand. Rich 40, Deep 56 und Full 72 gaben eine Handvoll Gebiete und einen Bruchteil der verlangten Farben zurück, und zwar umso schlechter, je mehr Farben verlangt wurden. Derselbe Bogen, der bei Medium 24 Farben und 574 Gebiete hatte, kam bei Deep mit 8 Farben und 9 Gebieten zurück.
Die Ursache stand in einer Zeile im Zusammenlegen. Das Feld, in dem die Dicke jedes Gebiets steht, ist ein Float32Array, der Mindestradius, gegen den geprüft wird, ist eine doppelt genaue Zahl. Wenn ein Gebiet einen Nachbarn aufnahm, war die Dicke der Vereinigung unbekannt, und der Code schrieb den Mindestradius hinein, als Behauptung: dieses Gebiet gilt jetzt als malbar. Eine doppelt genaue Zahl in einem Float32Array wird gerundet, und ungefähr die Hälfte der Werte rundet nach unten.
Rundete sie nach unten, war die Vereinigung nach ihrer eigenen Prüfung immer noch zu dünn. Also legte sie erneut zusammen, und wieder, bis vom Bild ein paar Dutzend Klumpen übrig waren. In welche Richtung gerundet wurde, hängt am genauen Wert des Mindestradius, und der ist aus Palettengröße und Papierformat abgeleitet, also für jede Kombination anders. Der Wert von Medium rundete nach oben und funktionierte. Rich, Deep und Full teilten sich einen Wert, der nach unten rundete.
Der Beleg dafür war unangenehm klar: eine Änderung des Mindestradius um vier Millionstel ließ denselben Bogen zwischen 574 und 79 Gebieten umschlagen, und der Vergleich des Wertes mit seiner eigenen Float32-Rundung sagte bei zwölf von zwölf Proben voraus, welchen Zweig man bekam.
Die Entscheidung war dann, den Vergleich nicht zu reparieren, sondern abzuschaffen. Die Behauptung steht heute als eigenes Kennzeichen neben dem Gebiet, das Dickenfeld behält den ehrlichen Höchstwert, und ein Gebiet, das schon einmal zusammengelegt wurde, überspringt die Dünnheitsprüfung. Keine Gleitkommazahl entscheidet mehr darüber. Seitdem liefert jede Stufe genau ihre Palette, ohne einen einzigen Wiederholversuch: Rich 40 mit 633 Gebieten, Deep 56 mit 618, Full 72 mit 874. Ein Bogen aus diesem Bild dauert dafür 1,0 bis 2,2 s statt 0,6 bis 1,0 s, weil sehr viel mehr Gebiete überleben.
Eine Zahl, die als Behauptung gemeint war, wurde als Messwert zurückgelesen.
Was 24 Farben aus einer Fotografie machen
Diese Ansicht existiert für eine einzige Frage: taugt die Palette, bevor sie gekauft wird. Es sind dieselben 239 Gebiete und 24 Farben wie auf dem Bogen weiter oben, nur ohne Ziffern und ohne Haarlinien.
Jeder Palettenplatz kennt seinen Abstand zum nächsten Nachbarn. Diese eine Zahl treibt die Anzeige unter dem Regler, den Wiederholversuch und die Absage, wenn ein Bild die verlangten Farben nicht trägt. Hier stehen 5,9 dE zwischen dem engsten Paar, dieselbe Aufnahme trägt auch alle 72 Farben, dann mit 3,7 dE. Eine flache Vektorgrafik sättigt dagegen um 50 bis 60 Farben und sagt das.
Was hineingeht, was herauskommt
Die Fotografie
- 914 x 1280 Pixel, für die Rechnung auf 714 x 1000 heruntergesetzt.
- Millionen Farbwerte, keiner davon benannt.
- Verläufe ohne Rand: wo das Laub aufhört, ist eine Frage der Schwelle.
- Kein kleinstes Merkmal. Ein Ast darf ein Pixel breit sein.
- Nichts daran sagt, wie lange es dauern würde, das zu malen.
Der Bogen
- 239 geschlossene Gebiete, in jedem genau eine Ziffer.
- 24 Farben, jede mit Farbfeld, nächstliegendem Namen, Hex-Wert und Flächenanteil.
- Jedes Gebiet mindestens 2,4 mm breit auf A4, sonst ist es zusammengelegt worden.
- 10,9 m Umriss, 0,8 s Rechenzeit, geschätzte 32 Minuten von Hand.
- Eine A4-Seite als Vektor, ohne einen einzigen externen Verweis.
Derselbe Ausschnitt, zwei Paletten
Weniger Farben heißt nicht weniger Felder
15 Farben273 Gebiete, engstes Paar 7,9 dE, geschätzte 36 Minuten von Hand. Das sind mehr Gebiete als bei 24 Farben, nicht weniger: eine grobe Palette franst die Grenze zwischen Laub und Himmel aus, statt sie zu vereinfachen.
72 Farben782 Gebiete, engstes Paar 3,7 dE, geschätzte 1 Stunde 44 von Hand. Die Aufnahme trägt alle 72, und die Anwendung nennt diese Zahl, statt sie zu verschweigen.
Die anderen beiden Ansichten
Wo das passt
- Alles, was ein Bild in etwas Herstellbares übersetzen muss: Zuschnitt, Applikation, Intarsie, Fliese, Folienschnitt.
- Produkte, bei denen ein Kunde ein eigenes Foto einreicht und ein physisches Ergebnis erwartet, das tatsächlich machbar ist.
- Jede Aufgabe, deren Nebenbedingung eine Mindestgröße und eine Mindestbreite ist, nicht nur eine Farbanzahl.
- Werkzeuge, die aus Datenschutzgründen nichts hochladen dürfen und trotzdem im Browser laufen sollen.
Bildnachweis: Alle Aufnahmen zeigen unsere eigene Anwendung. Fünf davon zeigen ein Ergebnis, das aus einer gemeinfreien Fotografie gerechnet wurde: Limestone quarry landscape von Rosendahl, über Wikimedia Commons. Die übrigen verwenden das prozedural gezeichnete Beispielbild der Anwendung selbst.
Publikationsgrund
Was das für Ihr Projekt heißt
Weiteres aus dem Lab
Methode Event Scout Ein Sprachmodell liest die Veranstaltungsseiten, alles andere ist festes Programm. Übrig bleibt eine kurze Liste, wo sich ein Tag vor Ort lohnt. 
Angewandte Forschung Vellum Kanten, Perspektive, Licht und Text werden auf dem Telefon berechnet. Ein Dokument verlässt das Gerät erst, wenn jemand es sendet. 
Computational Design Atlas EV1 Zwölf Kapitel nehmen ein Elektroauto auseinander, bis zur einzelnen Zelle. Keine Modelldateien, keine Texturen: 327 Teile aus einer Maßtabelle. Sie müssen ein Bild in etwas Herstellbares übersetzen, mit echten Nebenbedingungen? Das ist unsere Art von Aufgabe.
Kontakt aufnehmen