Projekt Logo

Eine GIF Animation

Logos wie der schwarze Kopf sind schnell erstellt.

Was Sie dazu brauchen:
1. Ein Grafikprogramm, welches Bilder mit transparentem Hintergrund erstellen kann, z.B. Paint.NET.
2. Ein Grafikprogramm, welches animierte GIF Animationen erstellen kann, z.B. Animake.
3. Eine Bildvorlage „Kopf“
4. Eine Bildvorlage „Zahnrad“

Vorgehensweise:
Als erstes legen Sie die Größe des Kopfes fest, indem Sie das Bild mit Paint.Net öffnen.


Anschließend klicken Sie auf das oberste linke Symbol in der Werkzeugleiste links. Der Mauspfeil ändert sich in ein Kreuz.
Jetzt drücken Sie die linke Maustaste und halten diese gedrückt während Sie das Kreuz von der oberen linken Ecke zur unteren rechten Ecke bewegen. Das komplette Bild wird dadurch markiert.
Als nächstes klicken Sie auf „Bild > Größe ändern“ und geben die gewünschte Größe ein, in meinem Beispiel 136 x 176 Pixel.


Auf OK klicken, dann „Datei > schließen > speichern“

Nun öffnen Sie die das Bild vom Zahnrad und wählen aus der Werkzeugpalette den Radiergummi aus. Die Größe des Radiergummis können Sie unter „Pinselstärke“ auswählen. Radieren Sie alles um das Zahnrad herum weg, so dass nur noch das Zahnrad und der leere Hintergrund übrig bleiben.


Dieses Bild speichern Sie als GIF ab: „Datei > speichern unter (Dateiname: Zahnrad 00, Dateityp: GIF)

Jetzt erstellen Sie drei Zahnräder in unterschiedlicher Größe und geben sinnvolle Namen beim „Speichern unter - GIF“ an (Zahnrad A 0Grad, Zahnrad B 0Grad, Zahnrad C 0Grad).
Die Gradangabe wird später benötigt, da sich die Räder ja drehen sollen.
Sie können z.B. die Größen von 40 Pixel, 20 Pixel und 10 Pixel wählen.

Als nächstes öffnen Sie das Zahnrad A 0Grad und markieren es mit dem Maskenwerkzeug (oben links).
Um das Zahnrad ein Stück nach rechts zu drehen klicken Sie auf „Ebenen > Rotationszoom“. Geben Sie einen Winkel von 15 Grad ein und speichern Sie das Bild unter dem Namen „Zahnrad A 15Grad“.


Klicken Sie nun erneut auf „Ebenen > Rotationszoom“. Geben Sie einen Winkel von 30 Grad ein und speichern Sie das Bild unter dem Namen „Zahnrad A 30Grad“.

Erstellen Sie nun auch von den Zahnrädern B und C jeweils um 15 Grad und 30 Grad gedrehte Bilder. Die Namen sollten sinnvollerweise lauten: „Zahnrad B 15Grad, Zahnrad B 30Grad, Zahnrad C 15Grad, Zahnrad C 30Grad,“

Sie sollten nun 9 Zahnräder haben.

Kopieren Sie nun den Kopf 11 mal und benennen Sie die Bilder 01 bis 12 (01 ist der erste Kopf mit 136 x 176 Pixel welchen Sie aus der Bildvorlage „Kopf“ erstellt haben.

Öffnen Sie nun das Bild „Kopf 01“ und ziehen Sie das Zahnrad „A 0Grad“ auf den Kopf. Wählen Sie bitte: Ebene hinzufügen, in sich nun öffnenden Fenster.
Klicken Sie nun auf den blauen Pfeil oben rechts in der Werkzeugpalette und verschieben Sie dann  das Zahnrad an die gewünschte stelle.
Fügen Sie auch die Zahnräder: „B 30Grad und C 0Grad“ ein.


Klicken Sie nun auf „Datei > Speichern unter“ und wählen Sie den als Dateityp „JPEG“ aus. Den Warnhinweis „Bild ist bereits vorhanden“ bestätigen Sie mit „JA“

Bevor Sie nun das Bild schließen klicken Sie bitte auf „Lineale“ (das letzte Symbol in der Symbolleiste oben). Bewegen Sie die Pfeilspitze des Mauszeigers in die Mitte jeden Zahnrades und notieren Sie die in den Linealen oben und links, angezeigten Positionen.

Schließen Sie jetzt das Bild und öffnen Sie das Bild „Kopf 02“
Hier fügen Sie nun ebenfalls Zahnräder ein (siehe nachstehende Liste) und verschieben diese an die gleichen Positionen wie im Bild „Kopf 01“.  Auch dieses Bild speichern Sie genau so wie das vorherige.

Den Vorgang wiederholen Sie mit allen weiteren Bildern „Kopf 03 bis Kopf 12“.

Da sich die Zahnräder auf Grund ihrer unterschiedlichen Größen unterschiedlich schnell, und auf Grund ihrer Anordnungen, in unterschiedliche Richtungen drehen sollen, verwenden Sie am einfachsten folgende Liste, welche angibt, welches Zahnrad in welches Kopf-Bild  eingefügt werden soll.
Praktisch sollen sich die Räder A und C in eine Richtung drehen und das Zahnrad B in die entgegengesetzte Richtung.
Das Zahnrad B soll sich doppelt so schnell drehen wie das Zahnrad A, und das Zahnrad C, doppelt so schnell wie das Zahnrad B.

Zahnradpositionierungsliste:


                         Zahnrad                         Zahnrad                         Zahnrad
Kopf 01           A 0Grad                         B 30Grad                       C 0Grad

Kopf 02          A 0Grad                         B 30Grad                       C 15Grad

Kopf 03          A 0Grad                         B 15Grad                       C 30Grad

Kopf 04          A 0Grad                         B 015Grad                     C 0Grad

Kopf 05          A 15Grad                       B 0Grad                         C 15Grad

Kopf 06          A 15Grad                       B 0Grad                         C 30Grad

Kopf 07          A 15Grad                       B 30Grad                       C 0Grad

Kopf 08          A 15Grad                       B 30Grad                       C 15Grad

Kopf 09          A 30Grad                       B 15Grad                       C 30Grad

Kopf 10           A 30Grad                       B 15Grad                       C 0Grad

Kopf 11           A 30Grad                       B 0Grad                         C 15Grad

Kopf 12           A 30Grad                       B 0Grad                         C 30Grad

 

Nachdem Sie alle 12 Bilder erstellt haben, können Sie das Programm Paint.NET schließen und das Programm Animake öffnen.

Klicken Sie auf „Datei > Neu“


Anschließend klicken Sie auf „Bearbeiten > Einfügen aus Datei“
Navigieren Sie zum Ordner mit den 12 Kopf-Bildern, markieren Sie alle 12 und klicken auf „öffnen“.


Nun werden die Bilder nach 1,2,3 sortiert, wobei das 1. oben steht. Passen Sie aber auf, weil Sie mehr als 10 Bilder haben, wird in dieser Reihenfolge sortiert: 1, 10, 2, 3,... Das ist aber nicht schlimm. Wählen Sie das 10. Bild aus und drücken Sie den schwarzen Pfeil nach unten (so lange, bis es an der richtigen Stelle ist)
Falls Sie wie oben angegeben, die Bilder 01, 02, 03, 04,…. 10, 11, 12, benannt haben tritt dieses Problem erst gar nicht auf.


Haben Sie diese Schritte erledigt, dann markieren Sie alle Bilder und klicken auf „Bearbeiten > Eigenschaften".
Hier können Sie z.B. die Verweilzeit einstellen. Sie gibt an, wie lange es dauert, bis das Bild wechselt, wobei 1000 = 1 Sekunde entspricht.
Wenn Sie sehen wollen, wie es fertig aussieht, klicken Sie auf „Animation > Starten“.


Falls es Ihnen gefällt und Sie damit zufrieden sind, beenden Sie die Animation und klicken auf „Datei > speichern unter“.
Als Dateityp wählen Sie: Animiertes GIF-Bild.
Das Fragefenster zur gemeinsamen Palette beantworten Sie mit „Nein“

Das war‘s auch schon.

Falls Ihr Standardbildbetrachter das Bild ohne sich drehende Räder anzeigt, liegt dies daran, dass das verwendete Anzeigeprogramm keine animierten GIF-Bilder darstellen kann.
Klicken Sie mit der rechten Maustaste auf das Bild und wählen Sie „Öffnen mit…“ z.B. einen Internetbrowser oder ein geeignetes Bildbetrachtungsprogramm.