Vom Punkt zu Kurven und Linien

azubi@AhlersHeinel

Vom Punkt zu Kurven und Linien: Aus Pixelgrafiken Vektoren erzeugen und optimieren

Ein Motiv – links als Pixelgrafik, rechts umgewandelt in eine Vektorgrafik

Ein Motiv – links als Pixelgrafik, rechts umgewandelt in eine Vektorgrafik

Die meisten Bilder oder Grafiken basieren auf Pixeln. Ist eine unbegrenzte Skalierbarkeit notwendig, sind Vektorgrafiken ein Muss – zum Beispiel für Firmenlogos und andere Elemente, die in vielen unterschiedlichen Größen Verwendung finden, von der Darstellung auf Visitenkarten bis hin zu großflächigen Plakaten.

Den erheblichen Unterschiedn im Skalier-Ergebnis zwischen Pixel- und Vektorgrafik habe ich ja schon in einem anderen Beitrag beschrieben. Da Pixelgrafiken aus vielen einzelnen, voneinander unabhängigen Bildpunkten, den Pixeln, bestehen, ist beim Hochskalieren ein Qualitätsverlust unvermeidbar. Vor allem die Bilddetails und Konturen werden unscharf, sodass das Bild „pixelig“ erscheint. Anders ist es bei den vektorbasierten Grafiken, welche sich aus Bildlinien, Formen und Flächen zusammensetzen. Diese lassen sich problemlos ohne Qualitätsverlust vergrößern.

Im Folgenden zeige ich euch mit Hilfe von Illustrator, wie aus Rastergrafiken Vektorgrafiken entstehen können. Illustrator arbeitet hierbei mit sogenannten Pfaden, die es ermöglichen, dass jedes Ausgangsbild (Zeichnungen, Fotos, Logos, PDF, etc.) eindeutig definiert ist und beliebig veränderbar bleibt. Ihr benötigt:

    • Illustrator (Ich arbeite mit einer Version aus der Adobe Creative Cloud)
    • Eine Pixelgrafik
    • Einen voll ausgestatteten Schreibtisch ( Computer, Tastatur, Maus)
    • Den Willen etwas Neues zu lernen

 

Schritt 1

Zunächst müsst ihr die zu vektorisierende Grafik in Illustrator öffnen oder platzieren.

schritt_1

Schritt 2

Passt mit Hilfe des Zeichenflächenwerkzeugs in der Werkzeugleiste die Zeichenfläche an das Bild an oder skaliert diese über den zu vektorisierenden Bereich. Denn nur was auf der Zeichenfläche liegt, kann später auch umgewandelt werden.
schritt_2

Schritt 3

Wählt das Quellbild aus und öffnet unter dem Menüpunkt Fenster den Bildnachzeichner. Aktiviert im Bedienfeld die Vorschau (Häkchen setzen), damit die Ergebnisse der Änderungen sofort sichtbar sind.

schritt_3

Schritt 4

Unter Vorgabe könnt ihr eine Nachzeichnervorlage festlegen. Diese ist motivabhängig, von Strichgrafiken über Technische Zeichnungen bis hin zu Hohe Fototreue. Ich habe für mein Bild die Hohe Fototreue ausgewählt, da das Motiv sehr detailreich ist.

schritt_4

Schritt 5

Nun geht es ans Finetuning! Nach dem Motto „Probieren geht über Studieren“ könnt ihr mit den Einstellungen ein wenig experimentieren, bis euch das Ergebnis gefällt. Unter dem Reiter Erweitert lassen sich noch feine Korrekturen vornehmen, zum Beispiel die Bestimmung der Anzahl an Pfaden, Ecken oder der Rauschintensität.

 

schritt_5

Schritt 6

Wenn ihr mit eurem Werk zufrieden seid, könnt ihr euch ans endgültige Nachzeichnen in Pfade machen. Dieses Umwandeln findet ihr in der Optionsleiste.

schritt_6

Schritt 7

Wurde eure Pixelgrafik vektorisiert, könnt ihr diese nun punktuell bearbeiten und die einzelnen Farbflächen manuell ausbessern.

schritt_7-1

 

Speichert das Bild beispielsweise als EPS, AI, SVG oder PDF ab, damit ihr bei der späteren Verwendung keinen Qualitätsverlust habt.

schritt_7-2

 

Mein letzter Tipp:
Teilweise wird die Schrift, wie beispielsweise in einem Logo, nicht realitätsgetreu nachgezeichnet und sieht eher aus wie „handgemalt“. Hier empfiehlt es sich, die Schriftart ausfindig zu machen, den Schriftzug neu zu schreiben und separat in Pfade umzuwandeln.

Melissa Schönfeld

Seit September 2015 bin ich Teil des AhlersHeinel-Teams als Azubine zur Mediengestalterin. Dabei gestalte ich Broschüren, Logo, schneide Videos und pflege Websites. Seit ich laufen kann, bin ich leidenschaftliche Kunstturnerin und Tänzerin. Seit einigen Jahren trainiere ich auch die Tanzkids. Besonderen Freude habe ich beim Basteln.

Sag etwas dazu