Marktplatz Downloads Tutorials Forum

Designnation bietet auch:

Tutorial hinzufügen

Beliebte Links Weitere Optionen

Tutorial suchen

Titel

Schlüsselwörter

Adobe Photoshop Tutorial: Animiertes Radar



Ranking: +13   Kommentare: 16   |   Bewertung: Keine Berechtigung!  

So hier nochmal das Tutorial auf Userwunsch. Es geht immer noch um ein animiertes Radar

Ich hoffe ihr seid mit dem Ergebnis zufrieden...ich bin es auf jeden Fall.

Aber fangen wir mal an.

Als erstes sucht ihr euch mal eine Landkarte oder noch besser eine Seekarte.

Ich hab eine gefunden und auf negativ gestellt.

seekarte
seekarte


Dann hab ich die Arbeitsfläche auf 300 x 300 verkleinert und 2 Hilfslinien gezogen....




Jetzt wollen wir unsere Karte erst mal passend zurecht schneiden.

Dazu nehmt das Auswahlellipse Werkzeug und zieht damit folgende Auswahl...




Dann geht auf Auswahl --> Auswahl umkehren (Umschalt + STRG + I)

Wählt jetzt die Ebene mit der Karte und drückt Entf auf der Tastatur....




Jetzt klicken wir mit gedrückter STRG auf die Ebenenminiatur der Karte.

Dann erstellen wir eine neue Ebene und füllen die Auswahl mit Farbe #005a00




Dann stellt ihr auf dieser Ebene noch folgendes ein....







Jetzt dürfte es ungefähr so aussehen....




Diese Ebene stellen wir nun noch auf 40% Deckkraft...




Als nächstes wollen wir uns noch ein paar Ringe einzeichnen. Dazu müsst ihr, falls noch nicht passiert, die Lineale einblenden. Drückt dazu einfach STRG + R Jetzt erstellt eine neue Ebene auf der ihr eure Ringe zeichnet
Nehmt dazu das Bleistiftwerkzeug mit 2 - 3 Pixel...je nach dem wie dick eure Linien werden sollen.
Dann müsst ihr von 25 angefangen alle 50 Pixel eine Linie ziehen. Also das wär bei 25, bei 75, 125, 175 und 225.

Am besten zeichnet ihr die Linien mit gedrückter Umschalt Taste..dann werden die schön grade. Ach ja Farbe hab ich #056b0a genommen




Wenn ihr das habt, dann auf Filter --> Verzerrungsfilter --> Polarkoordinaten und auf rechteckig -> Polar stellen...




Jetzt dürfte das ganze ungefähr so aussehen....




Das ist schon das Unterteil von unserem Radar. Nun wollen wir uns noch einen *Sucher* basteln.

Dazu wählen wir aus der Werkzeugpalette das Auswahlwerkzeug: Einzelne Spalte aus




Mit diesem Werkzeug klickt ihr jetzt einmal genau in der Mitte eures Radars.

Mit den Hilfslinien ist das auch gar kein Problem....




Anschließend wählt ihr Bearbeiten --> Kontur füllen Farbe nehmt #24af2a und stellt folgendes ein




Jetzt habt ihr einen fetten Streifen in der Mitte übers ganze Bild.

Wie ein Sucher von einem Radar sieht das noch nicht aus.




Erstellt jetzt auf dieser Ebene eine Ebenenmaske.
Auf dieser brusht ihr mit einem harten Pinsel und Vordergrundfarbe Schwarz alles weg was über euren Ring drüber steht und was ab der Mitte nach unten geht...




Ich hab noch einen kleinen Knopf drüber gelegt...




Als nächstes erstellt ihr eine neue Ebene unter der mit dem Strich, nehmt euer Polygonlasso und zeichnet folgende Auswahl...




In dieser Auswahl macht ihr mit dem Verlaufswerkzeug und ein wenig dunklerem Grün einen Verlauf von Grün nach Transparent...




Jetzt drückt ihr STRG + E und reduziert so die Ebene mit dem Verlauf und die mit dem Strich auf eine Ebene.

Dann müssen wir noch die Animation vorbereiten.
Dazu dupliziert ihr immer einmal die Ebene mit dem *Sucher* und geht anschließend auf Bearbeiten --> Transformieren--> Drehen




Dann müsst ihr immer drauf achten, das der Referenzpunkt immer in der Mitte ist beim drehen.
Dort wo der Referenzpunkt sich befindet ist die Drehachse. In unserem Fall in der Mitte
Als Drehungswinkel gebt ihr immer 11,25° ein....




Das ganze müsst ihr jetzt solange wiederholen, bis ihr einmal ganz rum seid
Wenn ich das grade mal ausrechne, wären das also 32 Teile die ihr am Ende haben müsst.
Das ist schon ein Stück Arbeit




Mein Gott, seid ihr endlich fertig damit? Bin schon fast eingepennt.

OK jetzt markieren wir alle 32 Einzel Ebenen von eurem Sucher...




...und gehen dann auf Ebene --> Neu --> Gruppe aus Ebenen

Nun haben wir alle Einzel Ebenen in einem Ordner.
Das hat den Vorteil, das ich nid scrollen muss bis mir das Mausrädchen aus der Maus springt.




Wenn ihr das habt, können wir endlich ans animieren gehen.
Drückt dazu die Schnelltasten Umschalt + STRG + M um nach Image Ready zu wechseln.
(CS3 Benutzer gehen nur auf Fenster --> Animation)

Dort angekommen seht ihr unten links die Animationsleiste.
Dort animieren wir unser Radar. Das erste Frame ist ja bereits augewählt.
Dazu öffnet ihr noch die Ebenengruppe mit den 32 Sucherteilen und blendet das erste davon ein...




Jetzt Dupliziert ihr das erste Frame indem ihr auf folgenden Button klickt...




Jetzt im 2. Frame blendet ihr in eurer Ebenengruppe die 1. Ebene aus und die 2. ein....




Dann wieder Frame duplizieren und die 2. Ebene ausblenden, aber die 3. ein...




Und wieder Frame duplizieren und die 3. Ebene aus und die 4. einblenden...




Das wiederholt ihr jetzt so lange, bis ihr alle 32 Sucherteile animiert habt.

Ihr habt dann also 32 Frames in der Animationsleiste.
Die markiert ihr dann alle indem ihr das erste anklickt und dann bei gedrückter Umschalt Taste aufs letzte klickt.
Wenn alle markiert sind, klickt ihr mit der rechten Maustaste auf die Zeit unter den Frames und wählt dort andere...




In dem neuen Fenster das sich dann öffnet gebt ihr eine Verzögerung von 0,05 ein




Ihr werdet es nicht glauben, aber das war es schon.
Wer will kann sich in die Animation noch ein paar Targets einbauen. Bleibt euch überlassen.
Das ganze müsst ihr jetzt noch als Optimierte Version irgendwo auf eurer Platte als Gif speichern.
(Bei CS3 heißt das für Web und andere Geräte)

Und als ich mit allem durch war, sah meins nach ein paar Veränderungen so aus...




So ich hoffe euch gefällt das Tutorial Dann würde ich mich auf ein wenig Feedback freuen

Und bitte nicht rippen...das war ne scheiß Arbeit

Veröffentlicht von: M.C.Eric
Veröffentlicht am: 14 Jul. 2008
Bookmarks: social bookmarking yigg it Linkarena Technorati Yahoo Mr. Wrong
Schlüsserwörter: Animation CS3 M.C.Eric PSBoard.de Radar


Themenverwandte Tutorials


Kommentar(e) (16)


puschkinmaster sagt:

geiler tut ;)
muss sagen ich bin fast absoluter anfänger ;) und habs nach etwas rumbasteln hinbekommen...läuft aber noch etwas rucklig...ich glaub wenn ich in noch kleineren schritten dreh is das besser

11 Sep. 2009 21:35:55 • Antworten


peniix3 sagt:

Danke

5 Aug. 2009 22:06:56 • Antworten


bo2221 sagt:

Mega geiles Ding das kann ich gut für meine neue Website brauchen danke

Mach weiter so

11 May. 2009 07:22:05 • Antworten


Abra sagt:

gutes tut .. nett erklärt
tip top

17 Feb. 2009 12:05:28 • Antworten


Olytibar sagt:

gutes Tutorial!
(Auch wenn es etwas doof ist das so oft zu drehen )

22 Jan. 2009 10:44:19 • Antworten


Delisha sagt:

oh super danke :D
sowas hab ich gebraucht!
ich werde in computertechnik ein referat über animationen mit photoshop halten =)

27 Nov. 2008 17:24:43 • Antworten


c00p3r sagt:

sehr schönes tut

26 Nov. 2008 15:42:21 • Antworten


Maxximum sagt:

nice tut =)

20 Oct. 2008 15:56:01 • Antworten


Lukas K. sagt:

Schönes Tutorial. Das Ergebnis kann sich echt sehen lassen.
mfg /

24 Aug. 2008 11:27:39 • Antworten


qulor sagt:

echt nice tut , hab es direkt beim ersten mal geschafft :D

7 Aug. 2008 13:02:03 • Antworten



Anfang

<<

1

2>>Ende

Kommentar eintragen


!! Jetzt kostenlos anmelden oder einloggen und mitdiskutieren!


Partner: • Designer in ActionFlash HilfeTutorials.dePixelio.deFlashstar BlogLizenzfreie Bilder