Zum Inhalt springen
  • Tutorials
  • Veröffentlicht am 21.02.2020

Wie erstelle ich kostenlos GIF-Animationen?

GIF-Animationen funktionieren wie Daumenkinos, sie bestehen aus mehreren statischen Bildern die aneinandergereiht werden. Je nachdem, wie lange jedes Einzelbild dargestellt wird, entsteht die Illusion von Bewegung. GIF’s haben den Vorteil, dass du sie auf so ziemlich jeder Webseite als Animation einbinden kannst.

4 kostenlose Software-Lösungen, die das
 Feature GIF-Maker enthalten

Name
Bewertung
Preis
MAGIX Photo & Graphic Designer
MAGIX Photo & Graphic Designer
(0 Bewertungen)
  • webbasiert, SaaS
  • webbasiert, self-hosted
  • Linux
  • Apple Mac OS X
  • Microsoft Windows
42,01
einmalig
49,99 EUR
(inkl. 19% USt.)
Photopea
Photopea
Free
(1 Bewertung)
  • webbasiert, SaaS
  • webbasiert, self-hosted
  • Linux
  • Apple Mac OS X
  • Microsoft Windows
kostenlos
-
GIMP
GIMP
(1 Bewertung)
  • webbasiert, SaaS
  • webbasiert, self-hosted
  • Linux
  • Apple Mac OS X
  • Microsoft Windows
kostenlos
-
Photoshop
Photoshop
(0 Bewertungen)
  • webbasiert, SaaS
  • webbasiert, self-hosted
  • Linux
  • Apple Mac OS X
  • Microsoft Windows
9,99
Foto-Abo (20 GB): Photoshop und Lightroom Classic für Desktop und iPad, Lightroom auf dem Desktop, Smartphone und Tablet.
pro Monat
11,89 EUR
(inkl. 19% USt.)

Kostenloses Tool mit viel Power

Im nachfolgenden Tutorial möchte ich insbesondere auf das kostenlose Online-Bildbearbeitungsprogramm Photopea eingehen. Über das Programm kannst du entweder eigene Illustration erstellen und animieren oder bereits vorhandene Bildfolgen zu einer Animation zusammensetzen. Wie das genau funktioniert zeige ich dir jetzt.

In 3 Schritten ein GIF erstellen

 

1. Reihenfolge festlegen

Zuerst ordnest du dir die Bildfolge an. Auf jede Ebene muss ein Bild der Animation platziert werden. Photopea verarbeitet die Frames von unten nach oben, d.h. das Anfangsbild sollte auf der untersten Ebene liegen. Wenn du deine Bilder in die richtige Reihenfolge gebracht hast, musst du die Ebenen richtig benennen.

Screenshot Photopea-Benutzeroberfläche: Reihenfolge festlegen

2. Ebenen umbenennen

Damit das Programm die Bilder als Animation interpretieren kann, muss jeder Frame mit _a_ (für Animation) beginnen, also z.B. _a_1 für die erste Ebene, _a_2 für die Zweite usw.

Screenshot Photopea-Benutzeroberfläche: Ebenen benennen

3. Als GIF exportieren

Nachdem du die Frames in die richtige Reihenfolge gebracht und die einzelnen Ebenen umbenannt hast, musst du die Szene nur noch exportieren und als GIF, PNG oder WEBP speichern. In der Vorschau kannst du sehen, wie die fertige Animation aussehen wird. Außerdem kannst du hier auch die globale Abspielgeschwindigkeit anpassen.

Screenshot Photopea-Benutzeroberfläche: GIF exportieren

Ein kleiner Tipp am Rande

Wenn du etwas mehr Kontrolle über den Ablauf deiner GIF-Animation willst, dann kannst du einzelne Timings für deine Frames festlegen. Um genau zu bestimmen, wie lange ein Bild dargestellt werden soll, legst du die Zeit in Millisekunden, mit einem Komma getrennt, nach dem Namen fest, z.B. _a_1,500 - hier wird der Frame also eine halbe Sekunde lang angezeigt.


Dein Experte bei Viewnit für:

Bildbearbeitungsprogramm, Fotobearbeitungsprogramm, Video-Editor, Zeichenprogramm, Layout­programm, Animationsprogramm, Bildvergrößerungssoftware

Richard - Redakteur für den Bereich Mediendesign
Richard,
Redakteur im Bereich Intermedia Design

weitere Beiträge, die dich interessieren könnten:

Vollautomatisches Freistellen – Der Traum eines jeden Designers
  • Vergleich

Automatische und KI-gestützte Funktionen in der Bildbearbeitung: Wir testen verschiedene Software-Lösungen und vergleichen das Ergebnis.

Richard - Content Manager für den Bereich Mediendesign
Beitrag von:Richard, Redakteur im Bereich Intermedia Design
Welches Bildbearbeitungsprogramm passt zu mir?
  • Ratgeber

Bist du Instagram-Star, Fotografie-Hipster oder doch ein Kunst-Connaisseur? Finde heraus, welches Foto-/Bildbearbeitungsprogramm am besten zu dir passt.

Richard - Content Manager für den Bereich Mediendesign
Beitrag von:Richard, Redakteur im Bereich Intermedia Design
Ist Adobe Photoshop CS2 kostenlos erhältlich?
  • Ratgeber

Seit langem hält sich das Gerücht, dass man Photoshop CS2 ohne weiteres kostenlos verwenden darf. Hier erfahrt ihr warum dies nicht so ist.

Richard - Content Manager für den Bereich Mediendesign
Beitrag von:Richard, Redakteur im Bereich Intermedia Design