21. Februar 2009

Abstrakter Effekt in Fireworks

Abstrakter Effekt in Fireworks

Eine interessante Funktion in Fireworks ist die “Pfade mischen” Funktion. Sobald man sie auf mehrere Pfade anwendet (mindestens 2), werden die Pfade in Zwischenschritten miteinander “verbunden”. Was später so aussieht wie ein weicher und flüssiger Übergang, ist in Wahrheit nur die Aneinanderreihung von vielen (für flüssige Übergänge benötigt man einige Hundert) Pfaden.
Im Folgenden kann man sehen, was für Gebilde mit dieser Technik entstehen können.

Fireworks Tutorial - Abstrakter Effekt Pfad Misch Methode


Fireworks Tutorial - Abstrakter Effekt Pfad Misch Methode


Schritt 1

Ihr legt ein neues Dokument (400×400 im Beispiel) an und wählt eine Hintergrundfarbe, vorzugsweise Weiß.

Fireworks Tutorial - Abstrakter Effekt Pfad Misch Methode

Schritt 2

Nun schnappt Ihr Euch das Pfad-Werkzeug (P) und zieht damit solche Pfade, wie ich es (im Bild zu sehen) getan habe.

Fireworks Tutorial - Abstrakter Effekt Pfad Misch Methode

Das macht Ihr vorzugsweise drei Mal. Ihr könnt auch mehr Pfade ziehen, aber umso mehr Pfade Ihr erstellt, desto mehr kurbelt der Prozessor später. Achtet beim Erstellen der Pfade darauf, dass sie sich oft überschneiden.

Fireworks Tutorial - Abstrakter Effekt Pfad Misch Methode

Schritt 3

Nun noch schnell jedem Pfad eine andere Farbe verpasst und ab geht’s zum Schritt 4.

Fireworks Tutorial - Abstrakter Effekt Pfad Misch Methode
Fireworks Tutorial - Abstrakter Effekt Pfad Misch Methode

Schritt 4

Markiert die drei Pfade, geht rechts unten auf die Registerkarte “Pfade” und wählt bei “Ändern” den Punkt “Pfade mischen” aus.

Fireworks Tutorial - Abstrakter Effekt Pfad Misch Methode

Setzt eine Zahl ein, wieviele Schritte zwischen den Pfaden erstellt werden sollen. Je höher die Zahl, desto “weicher” und fließender werden die Übergänge - desto mehr kurbelt aber auch euer Rechner. Ich habe 250 gewählt.

Fireworks Tutorial - Abstrakter Effekt Pfad Misch Methode

Nach kurzer Rechenzeit sieht das Ganze dann so aus:

Fireworks Tutorial - Abstrakter Effekt Pfad Misch Methode

Schritt 5

Nun wird die Gruppierung dieses Objektes zwei Mal aufgehoben (Strg+Shift+G),

Fireworks Tutorial - Abstrakter Effekt Pfad Misch Methode

was anschließend so aussehen sollte

Fireworks Tutorial - Abstrakter Effekt Pfad Misch Methode

Schritt 6

Markiert alle Pfade und stellt die Transparenz auf einen niedrigen Wert zwischen 0 und 15. In diesem Fall habe ich “8″ gewählt.

Fireworks Tutorial - Abstrakter Effekt Pfad Misch Methode

Schritt 7

Markiert alle Pfade wieder und gruppiert sie (Str+G). Dupliziert das Objekt und wandelt es in eine Bitmap-Grafik um (”Modifizieren” > “Auswahl als Hintergrund”). Dieser Bitmap-Grafik weist Ihr den Gausch-Verwischen-Filter.

Fireworks Tutorial - Abstrakter Effekt Pfad Misch Methode

Schritt 8

Erstellt einen großen Kreis über beide Objekte mit der Verlaufsoption “Radial”

Fireworks Tutorial - Abstrakter Effekt Pfad Misch Methode

Der Kreis muss nach außen hin ins Transparente verlaufen und den Misch-Modus “Überagerung” bzw. “Ineinanderkopieren” (ältere Fireworks Version) haben.

Fireworks Tutorial - Abstrakter Effekt Pfad Misch Methode

Das war’s schon. Unser fertiges Endprodukt sieht dann wie folgt aus:

Fireworks Tutorial - Abstrakter Effekt Pfad Misch Methode

Ähnliche Beiträge

11 Kommentare »

  • Gravatar
    Gino — 19. März 2009 @ 02:42

    cool! :)

  • Gravatar

    [...] 4. Abstrakter Effekt in Fireworks [...]

  • Gravatar

    [...] 4. Abstrakter Effekt in Fireworks [...]

  • Gravatar

    [...] 4. Abstrakter Effekt in Fireworks [...]

  • Gravatar
    Kron — 7. April 2009 @ 14:37

    I really wish I was fluent in German….

  • Gravatar
  • Gravatar
    Rafay — 23. Juni 2009 @ 03:15

    OH no!!! a great thing but I am not able to read german. Please translate it in english

  • Gravatar
    pnolan — 27. Juli 2009 @ 14:16

    To the author, great tute great vid, both very easy to follow. Im assuming the vid didnt have audio but following it I noted the following steps hope it helps Rafay.

    Being done in CS3 so not all options are available to me
    Create 3 or more paths of different colors
    Select all Paths
    From the Paths palette select blend paths
    In the Javascript window set the number of steps to 250
    After the process completes
    Go to the top Modify menu and select Ungroup
    When complete go back and repeat the ungroup
    In the Layers palette you will now have 250 paths one for each step
    With them still selected go to the properties palette change the opacity to 8 (that’s the number he used.
    After review, select all and Modify – Group

    (it looks like you can ignore this part of the video as the ellipse in the end did not aid in the final output my 2 cents)
    Select the Ellipse Tool From the vector palette
    Draw a circle over the Grouped paths
    Set a fill color, but no stroke
    Still in the Properties palette set the Fill Category to Gradient – Radial
    Select the Fill color, This brings up the gradient properties window
    Set both sides of the Gradient to the same color
    Change the right sides opacity to zero
    With the ellipse still selected change the blending mode to Overlay

  • Gravatar
    Susan — 27. Juli 2009 @ 19:33

    Grate!! thanks to the video i was able to understand :)

  • Gravatar
    Ben — 28. Juli 2009 @ 08:39

    You’re welcome, and thanks for the translation @pnolan.

  • Gravatar
    justus asembo — 27. Januar 2010 @ 14:51

    Great tutorial! Please avail an english version!

RSS-Feed für Kommentare zu diesem Artikel. TrackBack-URL

Kommentar hinterlassen

Sie müssen eingeloggt sein, um ein Kommentar zu schreiben.