So erzeugen Sie in Photoshop animierte GIFs für Web-Banner und Social Media

Animierte GIF kommen auch in Social-Media-Auftritten und Newslettern richtig in Mode. Das können ganz einfache Animationen mit Linien sein; sie erzeugen in einem ansonsten statischen Umfeld den absoluten Eyecatcher. Wer vor einer komplexen Timeline zurückschreckt, kann in Photoshhop ein animiertes GIF aus Photoshop-Ebenen erzeugen. Wir zeigen Ihnen die Technik. Außerdem erzeugen Sie eine Aktion zum zügigen Arbeiten. Die Ideen sollten Ihnen dann zufliegen.

Die fertige GIF-Animation

Arbeitsbereich und Ebenenaufbau

Am besten rufen Sie sich zu Anfang den Arbeitsbereich Bewegung aus dem Menü Fenster → Arbeitsbereich auf. Er ist ähnlich wie der Arbeitsbereich Fotografie mit zusätzlicher Zeitleiste unten am Bildschirm. Das Ebenen-Bedienfeld sollten Sie sich direkt größer ziehen.

1.Öffnen Sie die Datei »Dreieck-blau-schwarz«. In der Mitte der Zeitleiste befindet sich ein kleines Menü, in dem Sie direkt eine Animation erstellen können. Wählen Sie den Befehl Frame-Animation erstellen [Abb. 1].

Abb. 1: Mit Frame-Animation erstellen wird die aktuelle Ebenenansicht verwendet .

Elsst Put tosied2h koidlree.eE mhnee5ldotkie tueaSnZiVree b.te Fihnmeri m sZaire aSssIteklinSs trdsIl iAcg-hf eica nlctiSinrnuepl b.yeneise llna ll ,Fneue at t si o Ahresf aked fentttotds isbC

TzenTetnejseD seeo sdenbhheeAieo btlsim .uall nmBlenneI2i.i .erdu te t S nei

Ie neoas itDhnaenmiAn

Icr nePiiunitwf.eie o ssofndw adm odanneddGndohitnbauiIb.deadgreAnte ino sibrnreteoD-seest Btnhiei ineS ie- r iebpiAcn nndoiia hlS htmdnuemV e ,isin na n oie tideensdhLag ke o ciieepFiee

Rnde uinliPanmgnaAt o

Hwzi wDdeltde i aehrnnne,neaS r bldgaD ti dnseurdd ea eisrthc,leens .uarieriarcwr eW enusshrnee e bciDrtwk sk enhdu s rnkhe,i cifd o ef
B uemmrmuiee.tlibhe z ia r e,eIize gbsoaecaDneeilsWch A,eenhetgehnenaaelkdeit g ardecvele en bhtieeitrerridiotuhrA idedeni ree nnhwib Dcee Eck eree A nnevfeugr lnndhcbctrn.hi ii ehnwk ifunser giie
RE sh aE cnhij . scsntnt nsidtneeifnuaFreF nne ew ua hlenD ie emea enudrrifrnea-lilsitl dsuepto rhgmser n efelwSenzmirfe.w soeaeroibrnmgnDdi.ierzb3rnai0iesDeTr eieea nt,d babmn

Lerneinheit weiterlesen

Um die komplette Lerneinheit zu sehen, loggen Sie sich bitte ein oder registrieren Sie sich.

Ein Zugang bietet Ihnen zahlreiche Vorteile:

Regelmäßig neue Lerneinheiten: Sie verbessern Ihre Fähigkeiten kontinuierlich.
Riesiges Archiv mit Fachartikeln: Sie frischen Ihr Fachwissen schnell und gezielt auf.
Ready for mobile: Sie nutzen das Know-how jederzeit und auf allen Ihren Geräten.

Einloggen oder registrieren

nach oben

Lerneinheit weiterlesen

Um die komplette Lerneinheit zu sehen, loggen Sie sich bitte ein oder registrieren Sie sich.

Ein Zugang bietet Ihnen zahlreiche Vorteile:

Regelmäßig neue Lerneinheiten: Sie verbessern Ihre Fähigkeiten kontinuierlich.
Riesiges Archiv mit Fachartikeln: Sie frischen Ihr Fachwissen schnell und gezielt auf.
Ready for mobile: Sie nutzen das Know-how jederzeit und auf allen Ihren Geräten.

Einloggen oder registrieren

Inhaltsverzeichnis

So erzeugen Sie in Photoshop animierte GIFs
- Arbeitsbereich und Ebenenaufbau
  - Planung der Animation
  - Animation mit einer Aktion erleichtern
  - Animation vervollständigen
  - Automatisches Erzeugen von Frames (Tweening)
- Ausgabe als GIF

Beitragsinfo

Praxiswerk:

Autor:

Marianne Deiters

Seitenzahl:

Ausgabe:

Erschienen am

16.06.2017

Beitragsnummer:

CA10-PS-08

Kapitel:

Grundlagen und Techniken

Thema:

Export

Software:

Adobe Photoshop

Ab Version:

CS4

Schlagwörter:

Adobe, Photoshop, Bildbearbeitung, Bilder, Fotos, bearbeiten, GIF-Animationen, animierte, GIFs, Animationen, Zeitleiste, erstellen, bearbeiten, Web, speichern, unbegrenzt, Endloswiedergabe, Schleifenwiedergabe, animieren, Logos, Icons, Social-Media, social, Media, Banner, Zeitleiste, Frame-Animation, Aktionen, erstellen, drehen, Tweening, abspielen

Diese Beiträge könnten Sie auch interessieren

19.01.2023 von Martin Vogler

Wie Sie den Exportieren-Befehl von Photoshop nutzen, um Grafiken für Web und Social Media zu exportieren

Der Exportieren-Dialog wurde mit Photoshop CC 2015 eingeführt. Obwohl seine Funktionalität immer noch nicht ganz ausgereift ist, bietet er Web-, Screen- und Social-Media-Designern die Möglichkeit, ihre Grafiken schnell und effizient für die jeweiligen Projekte zu speichern. Wir stellen die Möglichkeiten nachfolgend vor.

02.12.2022 von Marianne Deiters

Wie Sie eine mehrseitige, druckreife Grußkarte mit Photoshop erstellen

Für mehrseitige Publikationen ist normalerweise InDesign das Programm der Wahl, aber auch mit Photoshop können Sie einfache, mehrseitige, druckreife Dateien im PDF-Format erzeugen. Dabei kommen anstelle von Seiten Zeichenflächen zum Einsatz, die als mehrseitiges PDF exportiert werden.

01.10.2020 von Marianne Deiters

Wie Sie Bilder für Instagram mit Photoshop vorbereiten und eine maximale Qualität erzielen

Wenn Ihre Bilder auf Instagram oder auch Facebook so richtig vermatscht oder verpixelt aussehen, liegt das daran, dass die Bilder von diesen Plattformen komprimiert und/oder zugeschnitten werden. Wenn Sie jedoch einige Feinheiten, wie die richtigen Pixelmaße und Bildproportionen, beachten, wird die Qualität verhältnismäßig gut. Es gibt aber noch mehr zu beachten. Wir zeigen Ihnen, worauf es ankommt.