Lieber Gast …

… die Inhalte von PSD-Tutorials.de stehen nur registrierten Mitgliedern zur Verfügung. Damit wollen wir den Communitygedanken weiterführen. Als Mitglied trägst du - wenn auch nur im Kleinen - zum Puls der Community bei. Und nur so ist es möglich, weiterhin hochwertige Inhalte für alle bereitzustellen.

Jetzt kostenlos registrieren!

Vorteile der kostenlosen Mitgliedschaft

Mit der kostenlosen und schnell erledigten Registrierung erhältst du viele nachhaltige Vorteile, die wir dir hier in aller Kürze aufzeigen möchten:

  • PSD steht für professionelles Know-how in den Bereichen Bildbearbeitung mit Photoshop, Fotografie, Webentwicklung, Layout- und Vektorbearbeitung, 3D-Bearbeitung mit Cinema 4D und Co.
  • Über 2200 Tutorials mit druckbarer PDF-Datei und teilweise den zugehörigen Arbeitsmaterialien
  • Mehr als 500 Video-Trainings als Stream zur Direktanzeige und zum Download
  • Abruf von über 1000 Downloads zu Photoshop-Presets, 3D-Modellen, Grußkarten, Texturen & Co
  • Zugriff auf ein sehr aktives Forum mit Antworten im Minutentakt
  • Deine Daten sind sicher. Sie werden nicht weitergegeben! Die Mitgliedschaft kann jederzeit und ohne Aufwand wieder gelöscht werden.

Reinschnuppern als Gast

Niemand kauft gerne die Katze im Sack, auch wenn sie kostenlos ist. Wir haben eine Handvoll Tutorials und Video-Trainings ausgesucht, die du auch als Gast ohne Registrierung ansehen kannst. Gefallen sie dir, stehen dir nach der Registrierung alle oben genannten Inhalte zur Verfügung.

Das Punktesystem

Einen winzigen Haken gibt es noch. Es gibt bei uns ein Punktesystem. Damit soll erreicht werden, dass Mitglieder sich aktiv in unserer Community beteiligen. Sobald du im Forum schreibst oder Tutorials kommentierst, bekommst du Punkte. Mit diesen Punkten kannst du wiederum Tutorials anschauen oder Downloads herunterladen. Mit der Registrierung bei PSD-Tutorials.de erhältst du ein Startguthaben von 100 Punkten, womit du schon ein gutes Stück weit kommst.

Jetzt kostenlos registrieren!

Passend zum Inhalt empfehlen wir unsere:

Photoshop-Workshop-DVD - Retusche & Composing

  • 100 Tutorials zu Retusche & Composing
  • 34 Stunden Video-Training, über 3.300 PDF-Seiten Know-how
  • Alle Tutorials sind als HTML für die Webansicht und als PDF für die Web- und Druckansicht optimiert.
Jetzt informieren Trailer ansehen

Kommentare

  • Alternative Portrait von FufuKatze

    FufuKatze

    23.05.2012 - 19:10

    Super erklärt ! Hat mir sehr gut weitergeholfen!

  • Portrait von Werbedesign_Jung

    Werbedesign_Jung

    06.10.2011 - 13:43

    Gut erklärt, wenn man auch Zeit dafür einplanen muss...

  • Alternative Portrait von puma76

    puma76

    23.08.2011 - 13:30

    Ist zwar komplex aber für Einsteiger wie mich nachvollziehbar

  • Alternative Portrait von Cacara

    Cacara

    31.07.2011 - 13:05

    Klasse gemacht, danke für das Tutorial.

    Grüße, Cacara

  • Alternative Portrait von phoenix966

    phoenix966

    23.05.2011 - 10:28

    Super einfach erklärt! Danke! :D

  • Alternative Portrait von tvmonster

    tvmonster

    13.03.2011 - 20:11

    Prima Ding, mach mich gleich mal an die Arbeit :)

  • Alternative Portrait von JayJaySpirit

    JayJaySpirit

    13.02.2011 - 21:03

    GENIAL . Toll gemacht!

  • Alternative Portrait von Izu

    Izu

    07.02.2011 - 19:56

    schönen tutorial. ist mein erstes gewesen und ich konnte trotzdem alles gut nachvollziehen.

  • Alternative Portrait von tourischreck

    tourischreck

    27.05.2010 - 19:20

    Super tut, sehr ausführlich - Vielen Dank für die Mühe

  • Alternative Portrait von Klopfi101

    Klopfi101

    21.05.2010 - 15:46

    Ihre PSD Tuts sind wirklich spitze!
    Immer tolle Ideen und exzellente Ergebnisse.

    Danke

  • Alternative Portrait von Hermann87

    Hermann87

    06.02.2010 - 23:37

    schönes ding, danke!

  • Alternative Portrait von KolibrisDream

    KolibrisDream

    26.01.2010 - 13:37

    Wow das ist toll, bin gespannt wenn ich es ausprobiere

  • Alternative Portrait von mascerat

    mascerat

    15.01.2010 - 11:09

    Danke, für dieses tolle Tutorial. So detailliert und gut erklärt. Hat mir sehr geholfen.

  • Alternative Portrait von rosi2904

    rosi2904

    03.01.2010 - 19:54

    Danke für das gute Tutorial

  • Alternative Portrait von Snagge86

    Snagge86

    28.11.2009 - 17:33

    Ist zwar echt ne Menge Arbeit, aber das Ergebnis kann sich wirklich sehen lassen. Super erklärt!

  • Portrait von Stella

    Stella

    21.11.2009 - 15:37

    Hallo
    schwierig hier einen Kommentar abzugeben, bevor ich das ausprobiert habe. Aber es liest sich gut, da hoffe ich, alles stimmt.

  • Portrait von truckerfrank8800

    truckerfrank8800

    04.11.2009 - 16:20

    Danke Pavel, wieder eine super gute Arbeit. Da werd ick mal wieder die Zeit vergessen

  • Portrait von yva

    yva

    29.10.2009 - 13:23

    Prima! Werde ich gleich mal ausprobieren :)

  • Alternative Portrait von and

    and

    29.10.2009 - 10:29

    Sehr gut und klar beschrieben. Das macht richtig Laune.

  • Alternative Portrait von motek

    motek

    29.10.2009 - 06:32

    beeindruckend, sowas in photoshop machen zu koennen...

Weitere Kommentare
Achtung: Du kannst den Inhalt erst nach dem Login kommentieren.

Tutorial empfehlen

 

Anleitung (Bilder + Extras werden nur für Mitglieder eingeblendet)


Neben Photoshop können Sie Vexel-Art auch in Illustrator machen. Dort gibt es sogar eine Nachzeichnen-Funktion, die Ihre Arbeit zum Teil automatisieren kann, aber das ist eine andere Geschichte und nicht das Thema dieses Tutorials. Und noch etwas: Neben dem Trendfaktor haben Vexel-Bilder eine ganz nützliche Eigenschaft. Sie können beliebig vergrößert werden, ohne dass die Konturen dabei unscharf werden – logisch. Wir arbeiten nicht mit Pixeln, sondern mit Formen, die mit Vektoren umschrieben werden und diese können problemlos skaliert werden.


Schritt 1

Zum Vergleich habe ich die Vorher-Nachher-Bilder nebeneinandergestellt, damit Sie den ganzen Umfang der Arbeit sehen können. Für den Anfänger ist das schon eine ziemlich aufwendige Aufgabe, aber mit jedem Vexel-Bild sammeln Sie Erfahrung und werden besser und schneller. Tipp: Wenn Sie ein Vexelbild erstellen möchten, duplizieren Sie das Original, um während der Arbeit Farben und Formen des Vektorbildes mit dem Original vergleichen zu können.

Bilder


 

Schritt 2

Beginnen Sie mit dem Nachzeichnen der Konturen des Bildes von oben nach unten. In unserem Fall ist das wichtig, da wir die Feder-Struktur des Vogels berücksichtigen müssen. Wählen Sie das Lasso-Werkzeug und zeichnen Sie den oberen Teil des Schnabels nach.

Bilder


 

Schritt 3

Mit einem Rechtsklick wählen Sie die Option Arbeitspfad erstellen.

Bilder


 

Schritt 4

Im darauf folgenden Dialog wählen Sie die Toleranz. Für kleine Details ist eine kleine Toleranz von ca. 1-3 optimal, dann wird der Pfad genau nach der Auswahl erstellt und wird vom Programm nicht willkürlich vereinfacht.

Bilder


 

Schritt 5

Der Schnabel des Vogels ist nicht einfarbig, sondern hat einige Farben, die Sie in der Vektor-Version mit einem Verlauf darstellen können. Wählen Sie in der Ebenenpalette die Option Verlauf zum Füllen des Pfades.

Bilder


 

Schritt 6

Wählen Sie zuerst die Verlaufsart Schwarz zu Weiß und definieren Sie den passenden Winkel im Dialog Verlaufsfüllung.

Bilder


 

Schritt 7

Den Verlauf, der im Moment schwarz-weiß ist, können Sie mit beliebigen Farben ausstatten. Doppelklicken Sie auf den Verlaufsbalken und definieren Sie im Dialog Verläufe bearbeiten die Farben Rot und Gelb, wie das auf dem Screenshot gezeigt ist.

Bilder


 

Schritt 8

Auf die gleiche Art, wie in den Schritten 2 bis 7 beschrieben, können Sie auch den unteren Teil des Schnabels erstellen. Achten Sie auf die Reihenfolge der Ebenen. Das Prinzip der Ebenenpositionierung ist denkbar einfach. Die Ebene mit dem unteren Teil des Schnabels liegt unter der Ebene mit dem oberen Teil.

Bilder


 

Schritt 9

Erstellen Sie auf dem oberen und unteren Teil des Schnabels einige Formen, die die Struktur des Schnabels unterstreichen. Diese können Sie mit dem Lasso-Werkzeug erstellen und in einen Pfad umwandeln.

Bilder


 

Schritt 10

Die erstellten Formen werden nicht mit Verläufen, sondern mit einer Farbe gefüllt. Wählen Sie dazu in der Ebenenpalette die Option Volltonfarbe.

Bilder


 

Schritt 11

Auf dem Screenshot sehen Sie, aus wie vielen Füllebenen die vektorisierte Version des Schnabels besteht. Der Mund wurde mit schwarzer Farbe gefüllt. Im Grunde kann man hier Schluss machen mit den Erklärungen, denn die Techniken werden sich jetzt mehr oder weniger wiederholen. Das wäre aber nicht fair, denn es gibt noch einige Tipps, die Ihre Arbeit erleichtern werden, und diese möchte ich Ihnen nicht vorenthalten.

Bilder


 

Schritt 12

Für eine bessere Übersicht ist es sinnvoll, die Füllebenen, die thematisch zueinander passen, in Ebenengruppen zu vereinigen. Die Ebenen, aus denen der Schnabel besteht, können Sie bei gedrückter Umschalt-Taste markieren und mit der Tastenkombination Strg+G in eine Gruppe zusammenfügen. Benennen Sie die Gruppe "Schnabel".

Bilder


 

Schritt 13

Klicken Sie die Hintergrundebene an und erstellen Sie eine Auswahl des Kopfes des Vogels mit dem Lasso-Werkzeug. Benutzen Sie für das Lasso-Werkzeug die Option Der Auswahl hinzufügen, damit Sie die Form nicht in einem Durchgang auswählen müssen, sondern die Auswahl bequemer abschnittsweise erstellen können. Wandeln Sie die Auswahl in einen Pfad um, wählen Sie eine Toleranz von 2. Füllen Sie die Form mit blauer Farbe.

Bilder


 

Schritt 14

Wenn Sie mit der Form des Pfades nicht zufrieden sind, können Sie an den Ankerpunkten des Pfades ziehen und die Form anpassen. Wählen Sie dazu das Direktauswahl-Werkzeug und das  Pfadauswahl-Werkzeug.

Bilder


 

Schritt 15

Damit die gezeichnete Form des Kopfes nicht die weiteren Details wie Augen und das Gefieder verdeckt, können Sie die Deckkraft der Füllebene vorübergehend auf ca. 50% reduzieren.

Bilder


 

Schritt 16

Zeichnen Sie die Formen mit etwas hellerer blauer Farbe oben und hinten auf dem Kopf. Achten Sie darauf, dass die Ebenen, die zu dem Kopf gehören, nicht über die Ebenengruppe mit dem Schnabel kommen.

Bilder


 

Schritt 17

Das Gefieder auf dem Kopf des Vogels können Sie mit der gleichen Technik machen. Zeichnen Sie mit dem Lasso-Werkzeug mehrere kleine „Federn“ (Option Der Auswahl hinzufügen) und wandeln Sie dann alle zusammen in einen Pfad um. Füllen Sie dann den Pfad mit einer dunkelblauen Farbe.

Bilder


 

Schritt 18

Wenn Sie alle Formen des Kopfes fertig haben, können Sie die Deckkraft der untersten Ebene mit dem Kopfumriss wieder auf 100% setzen. Vereinigen Sie die Ebenen des Kopfes in einer Ebenengruppe.

Bilder


 

Schritt 19

Beginnen Sie mit dem Gestalten der Augen. Damit Sie unter der Gruppe mit dem Kopf alles auf dem Originalbild erkennen können, reduzieren Sie die Deckkraft der ganzen Gruppe Kopf auf ca. 30-50%. Erstellen Sie die dunklere Formen unter den Augen.

Bilder


 

Schritt 20

Erstellen Sie die Form des Augapfels, die Sie mit dunkelroter Farbe füllen.

Bilder


 

Schritt 21

Gestalten Sie weitere Formen wie die Pupille, die mit Schwarz gefüllt wird, einen Lichtreflex in der Pupille, den Sie mit weißer Farbe füllen können. Verbinden Sie die Ebenen des Auges in einer weiteren Ebenengruppe.

Bilder


 

Schritt 22

Wie bereits beschrieben, gestalten Sie die Ebenen, mit denen Sie den Hals des Vogels vektorisieren.

Bilder


 

Schritt 23

Bei den Details, wo es besonders bunt wird, wie zum Beispiel bei der Brust des Vogels, können Sie ein bisschen tricksen. Erstellen Sie zuerst die Grundform, so wie Sie das bei dem Kopf gemacht haben, dann die Form mit dem Gefieder, welche Sie mit etwas dunklerer Farbe füllen.

Bilder


 

Schritt 24

Duplizieren Sie dann die Ebene mit der Struktur noch dreimal. Skalieren Sie die Kopien der Füllebene mit der Struktur, verschieben Sie diese etwas gegenüber der ersten Ebene mit der Struktur und ändern Sie die Farbe der Füllung, indem Sie auf die Ebenenminiatur der Füllebene doppelklicken. Wenn Sie mit dem Verteilen der Strukturen fertig sind, können Sie die Ebenen in eine Ebenengruppe zusammenfügen.

Bilder


 

Schritt 25

Bei den größeren Federn können Sie sich die Arbeit auch erleichtern, indem Sie mit Kopien der Füllebenen arbeiten. Erstellen Sie zuerst eine Füllebene mit der Form einer Feder und mit einem Verlauf von hellgrün zu dunkelgrün.

Bilder


 

Schritt 26

Machen Sie von der Füllebene eine Kopie und verschieben Sie diese an eine andere Stelle. So können Sie eine große Anzahl von geklonten Federn erschaffen. Damit diese nicht zu gleich aussehen, können Sie einige Formebenen mit dem Befehl Frei transformieren drehen.

Bilder


 

Schritt 27

Verbinden Sie die Federn-Ebenen in einer Ebenengruppe.

Bilder


 

Schritt 28

Damit die Feder etwas mehr Struktur bekommen, können Sie einen weiteren Trick anwenden. Duplizieren Sie die Ebenengruppe mit den Federn und verkleinern Sie diese so, dass die Struktur der Federgruppe dem Original gegenüber etwas verschoben wird.

Bilder


 

Schritt 29

Erstellen Sie auf der Ebenengruppe mit den skalierten Federn eine Ebenenmaske und wählen Sie das Verlaufswerkzeug mit der Option Vordergrund-Transparent, Vordergrundfarbe Schwarz. Ziehen Sie einen Maskierungsverlauf, wie das mit dem Pfeil auf dem Screenshot gezeigt ist.

Bilder


 

Schritt 30

Wie Sie sehen, können Sie auf die in den vergangenen Schritten beschriebene Art die ganze Gestaltung des Vogel und des Astes in Vektoren umwandeln. Wichtig ist, die Ebenenstruktur durch Ebenengruppen zu unterteilen; dadurch haben Sie eine bessere Übersicht.

Bilder


 

Schritt 31

Um den Hintergrund des Bildes zu gestalten, benutzen Sie die gleichen Techniken, die ich in diesem Tutorial beschrieben habe. Wenn Sie das Eigene-Form-Werkzeug benutzen, können Sie auf die Photoshop-Bibliothek zurückgreifen, wo viele interessante Muster für Ihre Gestaltung zur Verfügung stehen. Außerdem können Sie auch eigene Muster speichern und diese benutzen.

Bilder


 

Schritt 32

Wenn Sie vermeiden wollen, dass eine Form, die über der anderen liegt, deren Grenzen überschreitet (in unserem Beispiel ist das eine frei gezeichnete Form, die nicht über die Grenzen des Quadrats gehen soll), benutzen Sie die Option Schnittmaske, die Sie durch das Klicken zwischen zwei Ebenen bei gedrückter Alt-Taste aktivieren können.

Bilder


 
Und so sieht das fertige Bild aus.

Bilder
Webdesign Darmstadt vBulletin 0.038 ZF-App 0.512 Total 0.55