KINGx - Das inoffizielle PlayStation Forum & News Portal
[Photoshop]Animierte Bilder - Druckversion

+- KINGx - Das inoffizielle PlayStation Forum & News Portal (http://www.kingx.de/forum)
+-- Forum:    Sonstiges (/forumdisplay.php?fid=9)
+--- Forum: User-Projekte (/forumdisplay.php?fid=15)
+---- Forum: GFX (/forumdisplay.php?fid=87)
+---- Thema: [Photoshop]Animierte Bilder (/showthread.php?tid=31085)


[Photoshop]Animierte Bilder - gutster - 04.01.2011 22:07

Hallo zusammen

Mit diesem Photoshop Tut will ich euch zeigen wie ihr im Wahrsten Sinne des Wortes "Bewegung ins Bild" bringt.

So dann fangen wir mal an:



Ihr braucht:
-Photoshop (Ich benutze CS4)
-Ein Video im MP4 Format
-Etwas Geduld und Kreativität ^^

Ich werde dieses Video benutzen (Download Link ist unten)


Auf gehts



Schritt 1.
Stellt sicher das ihr bei "Fenster" ein Häckchen bei "Animationen" gesetzt habt
Nun geht ihr auf Datei/Öffnen und wählt dort euer Video aus.


So sieht es nach dem öffnen aus



Kleiner Tipp meinerseits:
Wenn ihr z.B. eine Signatur erstellen wollt könnt ihr natürlich das Video/Bild beliebig transformieren, das macht ihr indem ihr STRG+T drückt.
Bearbeitet die Größe eures Bildes erst nachdem ihr es fertig gestellt habt, und dann mit gedrückter STRG Taste, so verzieht sich das Werk nicht^^

Schritt 2.
Nun bestimmt ihr den Ausschnitt des Videos, das macht ihr indem ihr im unteren Bildschirmbereit ins Animationsfenster schaut, dort findet ihr diese Balken, die die länge des Videos bestimmen:


Mit dem Regler könnt man sich sozusagen durch das Video navigieren
So sieht mein Ausschnittsbereich aus:


Nun haben wir unseren animierten Teil fertig


Schritt 3.
Ab hier könnt ihr mit dem Bild machen was ihr wollt, einzelne Personen hinzufügen, Schriften mitreinbringen, usw.
Ich habe noch meinen Nickname hinzugefügen :

Schritt 4.
Wenn ihr dann mit bearbeiten fertig seit, muss man das ganze ja noch speichern. Dazu geht ihr auf "Datei" und dann nicht auf "Speichern unter" sondern auf "Für Web und Geräte speichern"
Nun wird Photoshop euer Werk zuerst in dieses Fenster laden:


Dort müsst ihr nur beachten, dass die Schleifenbegrenzung auf unbegrenzt ist, sonst würde die Animation nur einmal durchlaufen

Schritt 5.
Jetzt könnt ihr euer animiertes Bild auf Internetseiten wie imageshack.us hochladen und schon hättet ihr eine animierte Signatur

Zum Abschluss ist hier noch mein kleines Wertk und der DL-Link zum Video:
DownloadDownload



____________________________________________________________ _______________________

So jetzt will ich uech noch zeigen wie ihr Schriften z.B. verschwinden lässt und wieder erscheinen lässt, oder sie von oben nach unten "durchscannen" lässt
In diesem Fall braucht ihr nur Photoshop, jedoch sind die Animationesmöglichkeiten sehr eingeschränkt, wenn ihr damit aufwendige Animationen machen wollt braucht ihr ein anderes Programm.
Aber jetzt genug geredet, fangen wir an:

Schritt 1:
Erstellt euch ein neues Bilddokument mit den Maßen eurer Wahl, Hintergrundfarbe ist auch egal, ich bevorzuge transpartet

Schritt 2:
Nun könnt ihr wieder euer Bild frei gestalten, ich hab einfach für dieses TuT ein Dunkelrot-Schwarz Verlauf genommen und wieder meinen Nickname und einen Brush draufgeklatscht und ein bisschen mit den Ebenenstilen experimentiert:



Ihr seht das die Animationsleiste etwas anderst ist, als bei dem Beispiel oben:


Der erste Frame wird automatisch gesetzt, damit mit diesem Bild fängt eure spätere Animation an. Um einen neuen Frame zu setzten klickt ihr auf den rot umrandeten Button der sich "Dupliziert ausgewählten Frame"
Jetzt erscheint ein zweiter, gleicher Frame:



In diesem Frame könnt ihr dann bestimmen was, wie in diesem Beispiel, mit der Schrit passieren soll. Wenn ihr sie verschwinden lassen wollt, macht ihr die Schrift Ebene einfach unsichtbar, indem ihr auf das Auge neben der Ebene drückt.



In der oberen Animationsleiste hab ich den nächsten Schritt grün makiert. So wie es jetzt eingestellt ist würde die Schrift einfach ohne Übergang verschwinden und wieder erscheinen. Aber das sieht finde ich sehr abgehackt auch. Darum drückt ihr nun auf den grün makierten Button, "Fügt Animationsframes ein" Dann sollte dieses Fenster erscheinen:



Bei dem Punkt Zuzufügende Frames könnt ihr die Frame Zahl einstellen, wie schnell bzw. wie langsam die Schrift verschwinden soll. Dabei gilt:
Je weniger desto schneller, Je mehr desto langsamer.
Ich habe die Zahl "12" genommen, wenn ihr dann auf OK drückt werden genau 12 Frames zwischen dem ersten und dem letzten hinzugefügt.



So jetzt ist die Schrift verschwunden, jedoch taucht sie wieder viel zu schnell auf. Dazu macht ihr wieder einen neuen Frame und blendet die Schrift Ebene wieder ein(Wieder aufs Auge drücken)



Nun wiederholt ihr wieder den Schritt mit den "Zuzufügenden Frames"
Jetzt müsste ihr mit meiner genutzten Zahl 27 Frames haben



Jetzt ist eure Animation fretig und ihr könnt sie wieder speichern, wie im oberen Teil Schritt4, und sie hochladen
So sieht mein Werk aus:




RE: [Photoshop]Animierte Bilder - m33leads - 05.01.2011 10:14

1-A Tutorial! Super erklärt, schöne Bilder, Beispiel mit dabei!

Vielen Dank!


RE: [Photoshop]Animierte Bilder - Deutschland 1 - 05.01.2011 10:20

Wo habt ihr alle Photoshop her? Ist das nicht sau teuer?

B2T: Geiles TuT,wenn ich reich wäre,würde ich das testen Big Grin


RE: [Photoshop]Animierte Bilder - DaRkSiDe - 05.01.2011 10:21

@Deutschland ich sag nur wozu gibt es ausland hosting:-D


RE: [Photoshop]Animierte Bilder - Unbekannt - 05.01.2011 10:23

Es gibt Keygens dafür (Finger weg) -.-
    Zum Topic
    Gutes Tut. Ein Freund hat PS mal sehen Wink.



RE: [Photoshop]Animierte Bilder - gutster - 05.01.2011 10:26

Schueler bekommen so viel ich weiß 80% Rabatt wenn sie beim Kauf ein Schuelerausweis vorlegen, muesste ich mal nachschauen


RE: [Photoshop]Animierte Bilder - shaplayer - 05.01.2011 10:26

Ja,die müssen "nur" 200 zahlen...


RE: [Photoshop]Animierte Bilder - Unbekannt - 05.01.2011 10:28

1000 € und 80% Rabatt?


RE: [Photoshop]Animierte Bilder - Deutschland 1 - 05.01.2011 10:28

DaRkSiDe :
@Deutschland ich sag nur wozu gibt es ausland hosting:-D

Das schadet der Wirtschaft und man wundert sich danach noch,dass wir in einer Wirtschaftskrise sind -.-


RE: [Photoshop]Animierte Bilder - Unbekannt - 05.01.2011 10:32

DaRkSiDe :
@Deutschland ich sag nur wozu gibt es ausland hosting:-D


Man braucht aber den Produce Key, sonst ist das nur eine Trial Edition.


RE: [Photoshop]Animierte Bilder - shaplayer - 05.01.2011 10:36

Aber du hast doch geschrieben es gibt keygens,also könnte man sich es illegal holen......
Naja BTT:
Ich hät auch gern so ein BILD,aber ich hab kein pHOTOSHOP...Sad


RE: [Photoshop]Animierte Bilder - Deutschland 1 - 05.01.2011 10:39

Können die Entwickler von Photoshop nicht eine Lite Version machen für ca. 60€ die schon viele Funktionen hat,aber halt bezahlbar ist machen?! Das wäre doch genial.


RE: [Photoshop]Animierte Bilder - m33leads - 05.01.2011 11:04

Es gibt viele Freeware Programme, aber die haben so ca. 10% der Funktionen von Photoshop.


RE: [Photoshop]Animierte Bilder - ocram - 05.01.2011 11:08

gutster tolles tut, zur umsetzung eines videoclips in ein animiertes gif, aber die umsetzung von selbsterstellen und frei nach lust und laune animierten schriften und anderem ist bei weitem nicht so einfach und erfordert dennoch sehr viel zeit wenn es in gif format sein soll.#

es gibt wie schon erwähnt meherere möglichkeiten um an Adobe Photoshop zu kommen.

1. entweder ihr seit studenten od. Schüler und bekommt bei vorlage eures Schuelerausweis einen rabatt.

2. ihr kauft euch eine ältere gebrauchte version, muss ja nicht immer die neuste sein aber ich rate euch mindestens zur cs4. dann wirds auch günstiger.

3. ihr könnt auch auf free software zurückgreifen da gibt es z.b GIMP das den photoshop schon sehr nahe kommt und mit dem solche animationen auch machbar sein sollten.

4. oder eben, gecrackte software, wovon ich aber tunlichst abraten würde da eben die hersteller solcher software nicht selten schmerzhafte geldstrafen über ihrer anwälte verhängen lassen.

geschweige den gibt es um aus Youtube videos animierte gifs zu erstellen einfacherer software die genau dafür ausgelegt ist, auch online generatoren gibt es zu genüge wie z.b hier über google oder die suchmaschine eurer wahl wird so einiges mit den richtigen suchbegriffen rauskommen.


RE: [Photoshop]Animierte Bilder - gutster - 05.01.2011 11:36

Wenn ihr wollt erweitere ich das TuT mit animierten Schriften, zumindest mal die Basics


RE: [Photoshop]Animierte Bilder - Neo92 - 05.01.2011 12:06

Das geht auch alles kostenlos. Man braucht nur RAD Video Tools (http://www.radgametools.com/bnkdown.htm) und GIMP. Mit RAD Video Tools konventiert man das Video zu einzelnen GIF Frames. Dann öffnet man mit GIMP das erste Frame und fügt die anderen hinzu. Beim Speichern einfach als Animiertes Bild markieren und fertig ist es.
Ich mach vielleicht noch später ein TUT dazu.


RE: [Photoshop]Animierte Bilder - Unbekannt - 05.01.2011 15:39

Auf Filsh.net, kann man sich das gewünschte Video im MP4-Format downloaden und man kann dazu noch die größe und die länge einstellen. Danach in PS bearbeiten und tadá.


RE: [Photoshop]Animierte Bilder - A7X - 05.01.2011 15:44

Deutschland 1 :
Wo habt ihr alle Photoshop her? Ist das nicht sau teuer?

B2T: Geiles TuT,wenn ich reich wäre,würde ich das testen Big Grin


Ebay.

Hab damals etwas über 150€ für PS gezahlt, hat sich jedenfalls gelohnt. Siehe auch http://shop.ebay.de/?_from=R40&_trksid=p5197.m570.l1313&_nkw=photoshop+cs4&_sacat=See-All-Categories


RE: [Photoshop]Animierte Bilder - Cha0z - 05.01.2011 15:47

Super Gutes TuT! Danke.

Ach und zu KeyGens: Man kann auch die trial Version verwenden -.-


RE: [Photoshop]Animierte Bilder - Unbekannt - 05.01.2011 15:48



So, habs auch gemacht, funktioniert perfekt Wink.


RE: [Photoshop]Animierte Bilder - A7X - 05.01.2011 15:54

Man bedenke aber, das die Datei durch lange Videos extrem groß wird und dann auch laggt.


RE: [Photoshop]Animierte Bilder - MyKey - 05.01.2011 16:03

Kann einer mal ein Tut für GIMP machen kann mir Photoshop nicht einfach so leisten ^^,oder geht das auch mit der Trialversion ?


RE: [Photoshop]Animierte Bilder - A7X - 05.01.2011 16:06

Darkkeyblademaster :
Kann einer mal ein Tut für GIMP machen kann mir Photoshop nicht einfach so leisten ^^,oder geht das auch mit der Trialversion ?


Geht auch problemlos mit der Test Version


RE: [Photoshop]Animierte Bilder - Unbekannt - 05.01.2011 16:08

Ghost_Mw2 :
Man bedenke aber, das die Datei durch lange Videos extrem groß wird und dann auch laggt.


Vorallem bei HD-Videos. Ist mir hier,

aufgefallen: 8 MB siesta.


RE: [Photoshop]Animierte Bilder - PSFAQ - 05.01.2011 16:23

Da ich 16 , und damit auch Schüler bin , hab ich mir auch Photoshop CS5 gekauft.Ich musste hart dafür arbeiten , aber es lohnt sich.Man kriegt viel mit PS hin und es ist einfach nur Super.Im moment hab ich es mit Wine installiert , etwas instabil , aber was solls.Ich werd's später noch ausprobieren , Super TuT


RE: [Photoshop]Animierte Bilder - A7X - 05.01.2011 16:25

Unbekannt :

Ghost_Mw2 :
Man bedenke aber, das die Datei durch lange Videos extrem groß wird und dann auch laggt.


Vorallem bei HD-Videos. Ist mir hier,

aufgefallen: 8 MB siesta.


Ähm... mal OT... die Assassin's Creed Font passt überhaupt nicht zu Zelda


RE: [Photoshop]Animierte Bilder - Bananajunky - 05.01.2011 17:06

na toll. genau 2 tage zu spät. zum glück hab ich schon bei google gefunden was ich machen wollte...


ok, hab nun doch selbst hand angelegt:



RE: [Photoshop]Animierte Bilder - gutster - 07.01.2011 21:25

---=====Update====---