Time2Grid Create an Alphabet Grid

Von Bild zu Schriftbild

Ein typografisches Porträt mit


From Image to Typeface
A typographic portrait featuring 




time2grid

und Goethes

Faust

In diesem Beitrag zeige ich Schritt für Schritt, wie mit time2grid ein Bild aus gefärbter Schrift entsteht – basierend auf einer Bildvorlage und einem literarischen Text. Das gezeigte Beispiel nutzt Goethes Faust 1 und führt zu einem typografischen Porträt, das Text, Farbe und Struktur miteinander verbindet.

Das Ergebnis gehört zur Serie Voices und visualisiert Sprache als visuelle Masse.

In this post, I’ll walk you through, step by step, how to use time2grid to create an image from colored text—based on a reference image and a literary text. The example shown uses Goethe’s *Faust I* and results in a typographic portrait that combines text, color, and structure.
The result is part of the *Voices* series and visualizes language as a visual mass.


Ausgangsidee

Das Ziel ist es, ein Portrait nicht aus Pixeln, sondern aus Buchstaben zu erzeugen.
Die Farbe jedes Zeichens wird aus einer Bildvorlage entnommen, der Inhalt stammt aus einem zusammenhängenden Text. Bedeutung, Form und Farbe überlagern sich.

Concept
The goal is to create a portrait not from pixels, but from letters.

The color of each character is taken from an image, while the content comes from a coherent text. Meaning, form, and color intertwine.


Schritt 1: Alphabet Grid in

time2grid


Dieses Format eignet sich gut für Porträts und vertikale Kompositionen.

📸 Screenshot: leeres Alphabet Grid mit eingestelltem Seitenverhältnis


Schritt 2: Text einfügen – Goethes

Faust


  • Kopiere den vollständigen Text von Faust
    (11.618 Zeichen)
  • Füge ihn in das Textfeld ein

Der lange, zusammenhängende Text sorgt für eine dichte, gleichmäßige Verteilung der Schrift über das gesamte Grid.

📸 Screenshot: Textfeld mit eingefügtem Faust-Text



Schritt 3: Grid- und Schriftgröße anpassen

  • Gridgröße:
    • 117 Zeilen
    • 100 Spalten
  • Passe die Schriftgröße so an, dass das Grid vollständig und gleichmäßig gefüllt ist


In diesem Schritt wird das Verhältnis zwischen Lesbarkeit und Struktur festgelegt.

📸 Screenshot: Grid mit angepasster Schriftgröße


Schritt 4: Bildvorlage laden


  • Lade ein Porträt von Goethe
  • Das Bild dient ausschließlich als Farbquelle, nicht als sichtbare Ebene

📸 Screenshot: geladenes Goethe-Bild


Schritt 5: Farben aus dem Bild extrahieren

Jetzt beginnt sich das Schriftbild in ein visuelles Porträt zu verwandeln.


📸 Screenshot: gefärbte Schrift nach Farbextraktion


Schritt 6: Transparenz einstellen

  • Reduziere die Deckkraft der Schrift leicht
  • Ziel: weichere Übergänge und mehr Tiefe

Die Transparenz hilft, Formen und Schatten subtiler wirken zu lassen.


📸 Screenshot: Schrift mit angepasster Transparenz


Schritt 7: Überschrift mit separatem Alphabet Grid

  • Erstelle ein zweites Alphabet Grid
  • Setze den Schriftzug GOETHE oberhalb der Hauptfläche
  • Klare, reduzierte Gestaltung für maximale Präsenz

📸 Screenshot: separates Grid für die Überschrift



Schritt 8: Export als PNG

  • Speichere das Ergebnis als PNG
  • Aktiviere einen transparenten Hintergrund

So lässt sich das Werk flexibel weiterverwenden (Print, Mockups, Fine Art Plattformen).

📸 Screenshot: Export-Einstellungen


Schritt 9: Signatur hinzufügen

Die Signatur fungiert als historischer und visueller Akzent.

📸 Screenshot: finale Version mit Signatur


Ergebnis

Das fertige Bild besteht aus reiner Typografie, deren Farbe aus einem Porträt extrahiert wurde.
Der Text formt nicht nur die Fläche, sondern trägt inhaltlich die Bedeutung des Werks.

Ein Porträt aus Sprache –
eine Stimme, die sichtbar wird.

Kommentare

Beliebte Posts