Das kleine ABC der Signatur

    Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

    • Das kleine ABC der Signatur

      Hallo TwF!

      Willkommen zum ultimativen Einstieg in die Welt von Photoshop.
      (Genauer genommen der Bildbearbeitung oder auch kurz GFX - "Graphical Effects" genannt)

      Indem dem folgenden Tutorial werden Heliux und ich Euch einiges lernen, wie man eine, in unseren Klassen "gute" Signatur erstellt.
      (Der folgende Text ist selbstverfasst worden. Rechtschreib - sowie Grammatikfehler könnt ihr für Euch behalten. Er dient lediglich zur Veranschaulichung.)


      Zum Anwenden werden diese Dinge benötigt.
      - Eine funktionstüchtige Photoshop Anwendung
      - Logisches Denken

      Wer schon immer mal damit arbeiten wollte, ist hier genau richtig. - Deshalb beginnen wir auch mal direkt mit dem ersten Punkt.


      v1. Begriffserklärung


      Viele werden im folgenden Text eventuell Schwierigkeiten mit einigen Begrifflichkeiten haben, sodass ich diese vorab hier mal erläutern werde.

      - Render:
      Wenn man von Render(n) bei Signaturen spricht, sind es häufig Abbildungen von Figuren u.ä. die auf einem transparentem Hintergrund liegen. (Die Dateien sind als .png
      (Portable Network Graphics) abgespeichert und meist daran zu erkennen.)
      Jedoch kann es genauso den Vorgang meinen, der davor liegt. D.h. mit anderen Worten, die Figur aus ihrem eigentlich Bild herauszuschneiden und erst auf die transparente Ebene zu bringen.

      - Stock:

      Ein "Stock" beschreibt einfach ein schlichtes Bild, worauf x-beliebiges drauf abgebildet sein kann. (Sei es eine Blume, ein Mensch o.a.)
      D.h. auch, dass man aus solchen Bildern gut "Render" erstellen kann, indem man dort das Hauptsächliche ausschneidet und auf eine neue, transparente Ebene bringt.

      - Effektstock:
      Der Effekt ist im Prinzip das gleiche wie ein normaler Stock. Der Unterschied ist nur ,dass auf dem Effektstock hellere, kuriose Figuren zu sehen sind, die bei den meisten Bildern sehr stark ins Detail gehen.


      - C4D:
      C4D Render sind auch nichts weiter, als skurrile Formen die man benutzen kann, um etwas besonders zu betonen.
      Dazu fragen sich viele...
      Was bedeutet C4D? - Das ist ganz einfach. Es sagt lediglich aus, mit welchen Programm es erstellt wurde. Indemfall "Cinema 4D"

      - Effekt C4D:
      Der Effekt C4D unterscheidet sich nicht sehr groß vom "Normalen C4D"
      Lediglich ist der Hintergrund schwarz und wird beim "Linearen Abwedeln" (Ebeneneinstellung - mehr dazu später) in Photoshop aufgehellt und bringt damit einen besseren Klang ins Bild.

      - Effekt bzw. Effektstocks:
      Wie bei den Effekt C4D's arbeitet man Effekte/Effektstocks über die Funktion "Linear abwedeln" ein. Auch diese bringen wie der Name schon sagt, einfach einen gewählten/gewünschten Effekt in das Bild.

      - Brush:
      Die meisten sollten diesen Begriff kennen, aber für die, die es noch nicht wissen, erkläre ich es nochmal.
      Der Brush beschreibt in Photoshop lediglich das Pinselwerkzeug bzw. genauer genommen die Pinselspitze.
      Im Augenblick gibt es allerlei Aufsätze zum Downloaden. Ob es nun ganze Muster sind die ihr damit malen könnt, bis zum kleinsten Pixel.
      Bekannte Brushes sind z.B.
      - Smoke Brushes:
      Diese werden wie der Name schon gesagt angewendet um Rauch/Nebel und desgleichen leicht einzuarbeiten.
      - Splatter Brushes:
      Das sind Brushes, die unsauber btw "spritzend" sind. D.h. stellt Euch vor, ihr nehmt einen Pinsel, taucht den in Farbe und kleckst die Farbe an die Wand.
      Die Punkte die dabei enstehen wären ein Beispiel für einen Splatter Brush.

      - Font:
      Fonts beschreiben in der Regel einfach nur Schriftarten, die ihr auf euren Bildern verwenden könnt.

      ...so viel auch zu den Fachwörtern.
      "Reflect on your...
      Childhood...
      Your sensation...
      Your words...
      Your emotions...
      Time...
      It will not wait
      No matter
      ...how hard you hold on
      it escapes you..."
    • v2. Die ersten Schritte




      Zuerst öffnen wir Photoshop und erstellen eine neue Datei. (oben links auf Datei -> Neu)

      Wir nehmen als Maßeinheit Pixel und stellen sie auf 350 x 150.

      Den Hintergrund lassen wir weiß.



      Als nächstes öffnen wir einen beliebigen Render und fügen diesen in unser Bild ein.

      Entweder ihr schiebt das Bild einfach in Photoshop auf die Ebene oder sobald ihr den Render in Photoshop geöffnet habt, dupliziert ihr den Render zu eurer neuen Datei.





      Natürlich seht ihr nun, der Render ist eurem Format nicht angepasst, also müssen wir skalieren.









      Wir skalieren indem wir Strg + T drücken. (Nun dürften sich Ankerpunkte um den Render befinden um ihn zu verkleinern)

      Damit das Seitenverhältnis nicht zu bruch geht, halten wir die Shift Taste gedrückt oder klicken oben die kleine Klammer an.

      Sobald ihr zufrieden seid, macht einen Doppelklick oder klickt den 'Bestätigungshaken' oben an.



      Es dürfte nun in etwa so aussehen.









      Soweit alles gut ist, kommen wir nun zum Hintergrund (engl. Background).

      Dieser sollte immer dem Render entsprechen. Indemfall sind helle Farben sowie etwas "süßes" vom Vorteil.







      Sollte der Hintergrund nicht passend von der Größe sein, so skaliert diesen auch auf das gewünschte Maß.


      Als Nächstes sollte man sich fragen - Wohin verläuft der Flow (Verlauf)?

      Wir sehen hier, dass das Mädchen nach links schaut. Aus diesem Grund wäre es sinnvoll, alles nach links einzuarbeiten btw. zu verlagern.


      Im nächsten Schritt erstellen wir eine Lichtquelle.

      Wir erstellen dafür eine neue Ebene, nehmen einen weißen Softbrush (Größe 110px) und malen auf die Ebene, wo der Lichtpunkt sein soll.

      Anschließend stellen wir die Ebene auf "Lichtpunkt" und spielen ggf. mit der Deckkraft.







      Da Licht auch Schatten erzeugt, müssen wir diesen auch einfügen.

      Dazu erstellen wir wieder eine neue Ebene, setzen diese auf Abdunkeln und stellen die Deckkraft der Fläche auf 40%.

      Nun brushen wir mit einem schwarzen Softbrush (Größe 80px) und brushen der Lichtquelle entsprechend den Schatten.







      Nach den Arbeitsschritten fügen wir noch ein paar Splatterbrushes hinzu.

      Auch hier erstellen wir eine Ebene btw. zwei. (Eine über - und eine unter dem Render)



      Die Ebene unter dem Render stellen wir auf Strahlendes Licht und nehmen einen 38px großen Splatterbrush.

      Das kann dann so aussehen. (Es ist nur ein kleiner Effekt)






      Das gleiche wiederholen wir auf der Ebene über dem Render, nur das wir diese auf Hartes Licht stellen und die Größe auf 45px stellen.


      Alles kann natürlich noch variieren in der Stärke, in der ein Brush zu sehen ist. Jedoch ist in dieser Signatur nicht von Wichtigkeit.







      Nun erstellen wir einen 'leichten' Farbverlauf.

      Dazu klickt man den schwarz, weißen Halbkreis ganz unten rechts in Photoshop an und wählt "Verlaufsumsetzung aus.

      Passend zur Signatur nehmen wir ein hellblau zu dunkelblau verlaufend und stellen diese Ebene auf "Multipliziert" mit der Flächendeckkraft 40%.









      Somit nähern wir uns auch immer langsamer dem Ende.

      Beim vorletzten Schritt erstellen wir einen Typo. Hier muss man darauf achten das die Farbe, die Größe und die Font zum Bild passend sind.



      FALSCH:







      RICHTIG:




      Zuletzt kommt je nach Geschmack noch ein Rand dazu.
      Wir erstellen einfach eine neue Ebene und benutzen das Auswahl-Rechteck Werkzeug (M) und wählen einen 5px großen Rand aus (Oben auf Bearbeiten klicken und Kontur füllen auswählen) und füllen das ganze mit einer Farbe passend zur Signatur.







      Fertig ist unsere erste richtige Signatur.

      「/╲/\( ; ; )/\╱\
    • v3. Eine C4D/Effektsignatur


      Vorab muss ich mich leider entschuldigen, dass ich nicht mehr jeden Schritt einzelnd als Bild habe und deshalb gezwungen bin, manchmal einiges mehr mit der Schriftsprache zu erläutern.

      Wir beginnen, indem wir eine neue Datei erstellen.
      Diesmal nehemn wir die Maße 400 x 200 und lassen den Hintergrund erneut weiß.

      Zuerst nehmen ich einen Background einer Stadt und skaliere ihn dem entsprechend.







      Als nächstes erstelle ich eine neue Ebene und nehme das Weichzeichnungswerkzeug. (Oben ein Kreuz bei "Alle Ebenen aufnehmen" machen)
      Nun einmal mit dem Tool über die ganze Ebene brushen. (Leider kein Einzelbild)
      Dazu fügen wir unseren Render ins Bild ein.





      Darauf passen wir den Hintergrund ein wenig dem Render an, indem wir unter dem Render von Cloud eine Verlaufsumsetzung erstellen.
      Die Farbe des Verlaufes habe ich von Cloud entnommen. Anschließend stellen wir diese Ebene auf "Multiplizieren" und einer Deckkraft von 50%.




      Jetzt kopieren wir unseren Render insgesamt 4 Mal. (Dies können wir indem wir Strg + J drücken oder Rechtsklick auf die Ebene machen und "Ebene duplizieren auswählen)
      Anschließend blenden wir die oberen 3 Ebenen aus.

      Schritt 1: Die unterste Ebene
      Wir nehmen den Wischfinger (Nehmen in etwa eine Pinselspitze von 32px) und wischen den Render von innen nach außen weg.
      Darauf stellen wir die Ebene auf Linear belichten und einer Deckkraft von 50%.

      Schritt 2: Die zweite Ebene
      Diese blenden wir ein und wiederholen Schritt 1. Lediglich stellen wir diese Ebene auf Linear abwedeln und erneut 50% Deckkraft.

      Schritt 3: Die dritte Ebene (Diese Ebene muss nicht angewendet werden)
      Hier stellen wir die Ebene auf weiches Licht und verwischen erneut den Render. Die Deckkraft bleibt.

      Schritt 4: Die obere Ebene
      Ihr nehmt das Lassowerkzeug, haltet Strg gedrückt und klickt die Ebene an.
      Nun macht ihr einen Rechtsklick auf den Render und wählt "Weiche Kanten" aus (stellt diese 3) und drückt Ok.
      Jetzt klickt erneut ins Bild und nehmt "Auswahl umkehren."
      Daraufhin drückt 2-5 Mal die Entf- Taste und beendet das ganze mit Auswahl aufheben.

      Es sollte wenn ihr es im Ansatz richtig gemacht habt, so Aussehen.




      Anschließend habe ich zwei Effektstocks unter den Render eingearbeitet.
      Dazu fügt ihr diese ein, stellt sie auf Linear abwedeln, spielt ein wenig mit der Deckkraft und radiert unschöne Stellen einfach aus.




      Nun kommen wir zu den C4D's.
      Ich habe einen bestimmen ausgewählt, diesen dupliziert, skaliert und gefärbt. (Ihr könnt Ebenen färben, indem ihr Strg + U drückt)
      Anschließend habe ich noch eine Ebenenmaske erstellt (Über Ebene -> Ebenenmaske -> Einblenden) und damit unsschöne Stellen ausradiert.



      Kleine Erklärung zur Ebenenmaske!
      Wenn ihr auf einer Ebenenmaske mit einem schwarzen Softbrush malt, radiert ihr Stellen weg. Nehmt ihr einen weißen, so fügt ihr radiertes wieder hinzu. (Etwas praktischer als das Radiergummiwerkzeug)

      Das Ganze sollte dann so sein.




      Danach habe ich wieder Effekte hinzugefügt, nur diesmal über dem Render.
      Es ist ein Bubble Effect sowie ein Leuchten auf dem Schwert. (Beide wieder auf Linear abwedeln und mit der Deckkraft spielen. Unschöne Stellen ausradieren.)







      Ebenso um dem Licht noch entgegen zu wirken, erstellen wir eine neue Ebene, stellen diese auf Lichtpunkt (10~30% Deckkraft) und malen mit einem weißen Softbrush Licht ins Bild.




      Nun folgen zwei Verläufe sowie eine Farbbalance. (Beides auszuwählen unter dem schwarz, weißen Kreis ganz unten rechts)

      Zuerst die Farbbalance wie folgt.
      Tiefen: +5 -28 -22
      Mitteltöne: -14 +22 +45
      Lichter: +15 -15 -45

      Danach die Verläufe:


      Weiches Licht, 75% Deckkraft




      Weiches Licht, 10% Deckkraft







      Sollte das geschafft sein, erstellen wir eine neue Ebene und und machen eine Bildberechnung. (Entweder Strg+ Shift+ E oder über Bild -> Bildberechnung)
      Danach gehen wir oben auf Filter -> Weichzeichnungsfilter und wählen gaußscher Weichzeichner aus. Wir stellen die Rate auf 1,5.
      Damit nur der Hintergrund verschwommen ist, radieren wir einfach alles was dem Render gehört aus.

      Anschließend erstellen wir wieder eine neue Ebene und machen erneut eine Bildberechnung.
      Diese Ebene stellen wir auf "Ineinanderkopieren" und 40% Deckkraft.

      Es sollte nun etwa so aussehen.






      Fast geschafft.
      Nun kommt noch ein Typo dazu.
      Ich habe mehrere Schriften hinzugefügt, diese überlappt und die Deckkraft gesenkt (Da könnt ihr selber dran experimentieren.)
      Speziell aber bei dem Schriftzug "Final Fantasy" habe ich eine Schnittmaske benutzt.
      Das möchte ich auch nochmal kurz erklären.

      Ihr nehmt eine neue Ebene, macht eine Bildberechnung und klickt mit einem Rechtsklick auf diese. Dort wählt ihr Schnittmaske aus.
      Jetzt nimmt die Ebene nur den Verschnitt der darunter liegenden Ebene (Eurem Schriftzug).
      Ihr könnt nun die Bildberechnung so verschieben, sodass der Schriftzug "Gut" aussieht.




      Nun nehmt ihr wieder eine Verlaufsumsetzung, nehmt einen hellen Verlauf, stellt diesen auf Weiches Licht und 10% Deckkraft.




      Bevor ihr fertig seid, fügt ihr noch ein Rand hinzu. (Wie in der Basic Signatur beschrieben)




      Nun zuletzt könnt ihr noch die Augen färben. Ich habe mich für ein helles blau entschieden.
      Ihr erstellt eine neue Ebene und macht erneut eine Bildberechnung.
      Anschließend wählt ihr die "Kamera" aus. Ihr findet sie links in der Symbolleiste ganz unten!
      Nun nehmt eine Softbrush und malt die Augen an. Jetzt erneut die Kamera anklicken und Auswahl umkehren.
      Zuletzt Strg + U zum Färben nehmen (Ein Haken in "Färben") und Wunschfarbe bestimmen.
      Das Alles mit Auswahl aufheben beenden.






      Nun ist eure Signatur fertig!
      "Reflect on your...
      Childhood...
      Your sensation...
      Your words...
      Your emotions...
      Time...
      It will not wait
      No matter
      ...how hard you hold on
      it escapes you..."
    • v4. Eine Smudgesignatur

      Ich (Heliux) möchte Euch das Smudgen anhand eines Beispiels einer meiner Signatur zeigen.

      Was ist das Smudgen überhaupt?
      Smudgen ist das Arbeiten mit dem Wischfingertool in Photoshop, indem ein Splatter bzw. Grunge Brush benutzt wird, dessen Streuung Form etc. verändert wird. Dazu benutzt ihr das Ordnersymbol das sich oben links in eurem Photoshop befindet. (Oder Alternativ F5)

      Wir starten mit der Signatur.

      Wir erstellen eine neue Datei mit der Größe 350x150 und weißem Hintergrund.


      Als erstes nehmen wir einen Radialen Lila-Violet Verlauf, der in etwas so aussieht.



      Danach erstellen wir eine neue Ebene und brushen mit einem grauen Hardbrush, der danach etwas gesmudged wird.



      Diesen Schritt wiederholen wir, aber diesmal mit einer dunkleren Farbe.



      Darauf eine erneute Wdh., mit einer neuer Farbe und der Hintergrund wäre für's Erste erledigt.



      Nun fügen wir einen Render der Signatur hinzu.



      Anschließend benutzen wir einen grauen Brush und setzen ihn leicht über dem Render.



      Jetzt fügen wir einen C4D Render hinzu. (Stellen diesen auf Linear abwedeln und radieren unschöne Stellen aus.)



      Danach benutzen wir einen dunkelblauen Brush, der anschließend wieder gesmudged wurde.



      Jetzt fügen wir einen weiteren, hellen C4D Render hinzu.



      Nun setzen wir einen ein Glasstock ein. Einstellungen, Deckkraft etc. können variieren.


      Darauf folgend nehmen wir einen hellen Softbrush, smudgen dies ein wenig zurecht und setzen die Ebene auf Strahlendes Licht.



      Die Helligkeit/Kontrast sowie Gradiationskurve bearbeitet.
      (Einstellbar unter dem schwarz, weißen Kreis wieder. - Einstellungen der der Helligkeit und Kurve können wieder variieren.)



      Radialer weiß-schwarzer Verlauf einbringen und diesen auf Multiplizieren stellen, mit einer 80% Deckfläche.



      Anschließend fügen wir einen breiten Rand hinzu. (Wie oben beschrieben)
      Um die äußeren Kanten zu entfernen, einfach beim Skalieren (Strg+T) die äußeren Ankerpunkte aus dem Bild ziehen.



      Nun smudgen wir den Render leicht, damit es so aussieht als würde er den "Rauch" auspusten.




      Fertig ist eure eigene Smudgesignatur.

      Ich hoffe, euch hat das Tutorial ein wenig weiter geholfen und hattet Spaß beim Lesen.

      Über Feedback, Anregungen und desgleichen sind wir gern erfreut.

      Gruß,

      Gamii & Heliux


      // Written by Gamii
      // Images and Phrases by Heliux

      「/╲/\( ; ; )/\╱\
    • Wow, da habt ihr euch ja ganz schön viel Arbeit gemacht.
      Nice, auch wenn ich mir nicht sicher bin ob das auch jmd ganz ohne PS Erfahrung schafft.
      Hm leider kann ich euch keine Renommeepunkte geben, weil bei mir die Bewertungsfunktionsfunktion immernoch nicht funktioniert^^

      (jetzt werden sich eh wieder 20 Leute ihr PS cracken und dann vergessen die hosts auszutauschen ;) )
      X5O!P%@AP[4\PZX54(P^)7CC)7}$EICAR-STANDARD-ANTIVIRUS-TEST-FILE!$H+H*
    • pixel schrieb:

      Sorry Focke, aber fand beide Bilder vor dieser Farbkorrektur/whatever bei weitem schöner. (Gamiis geht eig klar)
      Ich finde man sollte so ein Tutorial nur machen, wenn man's auch wirklich drauf hat.
      Naja ich kanns nicht besser, find's trotzdem schlecht.

      negativ Renomee incoming, ciyaaaaa



      Geschmackssache oder wie wars?
      Natürlich sind wir beiden nochnicht mal annährend auf dem weg der perfektion bzw auf dem weg es richtig drauf zu haben jedoch wurde ich bzw wir schon von vielen gefragt ob ich ihnen jetzt auch Skype (nicht nur in der TwF) helfe und da hatte ich einfach die Idee soetwas zu machen :)

      Faint* schrieb:

      und ich sehe jetzt schon die ersten Fails, da es bestimmt (leider) welche gibt die sich das ganze nicht genau durch lesen ^^.


      Was meinst du wohl wie hässlich meine first try´s waren?

      Epple schrieb:

      Das Tutorial ist gut und ausfürhlich, aber ich sehe schon die ersten trys in den Showroomen der jenigen kommen.


      Es ist immer schön zusehen das man Leute animiert was neues auszuprobieren

      Propaganjapuncher schrieb:


      tl; dr LOL SORRY


      Ich hätte wenn ichs nicht selber mitverfasst hätten wohl auch nicht gelesen :DD

      「/╲/\( ; ; )/\╱\