Diese Anleitung zeigt, wie du eine GIF Animation erstellen kannst, indem du jeden Frame selbst zeichnest. Wir bauen ein gelbes Gesicht, das sich in drei Bildern bewegt. Genauso funktionieren Blinzeln, Winken, ein springender Ball oder ein animierter Sticker.
WigglyPaint ist hier weder KI-Generator noch Video-Konverter. Du beginnst auf einer leeren Zeichenfläche. Die Linien wackeln bereits; das Animation-Panel spielt zusätzlich mehrere Zeichnungen nacheinander ab.
Ein Frame ist eine Zeichnung, ein Loop die Rückkehr vom letzten zum ersten Bild und Onion Skin die blasse Vorlage des vorherigen Frames. Damit lässt sich eine Zeichnung animieren und eine kurze 2D-Animation bauen, ohne Video-Konverter. So kannst du eine GIF-Animation online mit einem klaren Animationsloop zeichnen.
Kurzfassung
Erste Pose zeichnen, Frame kopieren, nur den bewegten Teil ändern, dritten Frame ergänzen, den Übergang vom letzten zum ersten prüfen und als GIF exportieren.
Vor dem Zeichnen
- Nimm ein Motiv und eine Bewegung.
- Nutze zwei oder drei klare Farben.
- Zeichne groß genug für eine kleine Chat-Vorschau.
- Beende das erste Projekt mit drei oder vier Frames.
GIF-Animation Schritt für Schritt erstellen
1. Erste Pose zeichnen
Öffne WigglyPaint, wähle Pinsel und Farbe und zeichne den Anfang. Der erste Frame wird oft als Standbild gezeigt und sollte deshalb auch allein verständlich sein.
2. Animation-Panel öffnen
Klappe unten Animation frames auf. Dort findest du Vorschaubilder, Wiedergabe, Onion Skin und die große Plustaste. Wähle Frame eins.
3. Frame kopieren
Nutze Copy frame, wenn der größte Teil gleich bleibt. Ändere danach nur Augen, Mund oder Position. Einen leeren Frame brauchst du nur für ein ganz anderes Bild.
4. Onion Skin einschalten
Klicke das Geistersymbol. Der vorherige Frame erscheint als blasse Vorlage, die nicht exportiert wird. Richte feste Teile aus und verschiebe nur die bewegten.
5. Dritte Pose ergänzen
Kopiere erneut und ändere eine Kleinigkeit. Für einen Sprung reicht oben-unten-oben, für ein Blinzeln offen-zu-offen. Drei Posen genügen für die erste Frame-by-Frame-Animation.
6. Loop prüfen
Starte die Wiedergabe und sieh drei Durchläufe an. Prüfe besonders den Sprung vom letzten zum ersten Frame. Für eine Pause kopierst du den gewünschten Frame. Einzelne FPS- oder Frame-Zeiten gibt es derzeit nicht.
7. GIF exportieren und öffnen
Klicke Export, speichere das GIF und öffne es außerhalb des Editors. Prüfe Bewegung, Lesbarkeit in kleiner Größe und einen sauberen Neustart der Schleife.
Das fertige GIF
Die Datei unten wurde mit diesen Schritten exportiert. Ein großes Motiv, wenige Farben und nur Änderungen an Position und Ausdruck halten die Bewegung auch in Chats und Feeds verständlich.
GIF gut sichtbar und teilbar machen
- Leere Fläche reduzieren.
- Pro Frame nur eine Hauptbewegung ändern.
- Große Formen vor kleinen Details zeichnen.
- Für Pausen einen Frame kopieren.
- Den Übergang Ende-Anfang prüfen.
- Die Exportdatei vor dem Posten öffnen.
GIF-Grenzen vor dem Zeichnen von Details
Eine GIF Animation enthält keinen Ton und nutzt höchstens 256 Farben pro Frame. Flächige Farben, starke Formen und ein kurzer Loop bleiben meist klarer und kleiner als Verläufe, Fotos oder lange Sequenzen.
Häufige Probleme lösen
- Zu schnell: Kopiere die Pose, die länger stehen soll.
- Loop springt: Bringe letzte und erste Position näher zusammen oder füge eine Zwischenpose ein.
- Motiv ändert seine Größe: Aktiviere Onion Skin und richte feste Teile zuerst aus.
- Nur ein Bild sichtbar: Prüfe alle Vorschaubilder und exportiere erst nach Fertigstellung.
- Datei groß oder unscharf: Reduziere Frames, Farben, Details und Leerraum.
- Download bewegt sich nicht: Öffne ihn im Browser oder in einer GIF-App; manche Galerie zeigt nur Frame eins.
Wofür eignet sich das GIF?
Kurze Loops passen als Reaktion, Sticker, Social-Post, Unterrichtsbeispiel oder Spielgrafik-Idee. GIF enthält keinen Ton; die Bewegung muss für sich sprechen. Mehr zu den Bedienelementen steht in der Frame-by-Frame-Anleitung, weitere Ideen in Animations-Websites für Anfänger.
Häufige Fragen
Ist die GIF-Erstellung kostenlos?
Ja. Du zeichnest und exportierst im Web-Editor ohne Desktop-Installation.
Werden Fotos oder Videos automatisch animiert?
Nein. Du zeichnest jeden Frame selbst; es ist kein Bild- oder Video-Konverter.
Wie viele Frames für Anfänger?
Beginne mit drei oder vier und ergänze nur nötige Übergänge.
Kann ein Frame langsamer sein?
Eine eigene Dauer gibt es noch nicht. Kopiere den Frame, damit die Pose länger bleibt.
Wie wird der Loop nahtlos?
Vergleiche letzten und ersten Frame. Nähere die Positionen an oder ergänze einen Übergangs-Frame zurück zum Anfang.
Kann eine GIF-Animation Ton enthalten?
GIF speichert kein Audio. Bewegung und Timing müssen ohne Ton funktionieren.
Exportiert dieser Web-Ablauf ein Video?
Diese Anleitung beschreibt GIF-Export im Web-Editor und verspricht kein Video aus derselben Frame-Folge.
Erstes Drei-Frame-GIF zeichnen
Schließe zuerst eine einfache Bewegung als Loop ab, bevor du Details ergänzt.
Jetzt zeichnen