GIMP geanimeerde GIF-zelfstudie

GIMP is een opmerkelijk krachtig stuk software, aangezien het gratis is. Met name webontwerpers zullen dankbaar zijn voor het vermogen om eenvoudige geanimeerde GIF’s te maken.

Geanimeerde GIF’s zijn eenvoudige animaties die je op veel webpagina’s zult zien en hoewel ze veel minder geavanceerd zijn dan Flash-animaties, zijn ze heel eenvoudig te maken door iedereen met een basiskennis van GIMP.

Hoe maak je een geanimeerde GIF in GIMP

De volgende stappen tonen een eenvoudige animatie ter grootte van een webbanner met een aantal basisafbeeldingen, wat tekst en een logo. De instructies in dit artikel zijn van toepassing op GIMP-versie 2.10.12.

1. Open een nieuw document. In dit voorbeeld hebben we de vooraf ingestelde sjabloon van . geselecteerd Webbanner groot mobiel 320×100. Voor uw animatie kunt u een vooraf ingesteld formaat selecteren of aangepaste afmetingen instellen, afhankelijk van hoe u uw uiteindelijke animatie gaat gebruiken.

   Voor deze zelfstudie bestaat animatie uit zeven frames en elk frame wordt weergegeven door een afzonderlijke laag, wat betekent dat het uiteindelijke GIMP-bestand zeven lagen zal hebben, inclusief de achtergrond.

2. Stel frame één in. De animatie begint met een lege ruimte, dus er verandert niets aan de werkelijke Achtergrond laag is nodig omdat deze al effen wit is.

   Echter, een wijziging in de naam van de laag in de Lagen palet nodig. Klik met de rechtermuisknop op de Achtergrond laag in het palet en selecteer Laagkenmerken bewerken.

3. In de Laagkenmerken bewerken dialoogvenster dat wordt geopend, voeg toe (250ms) aan het einde van de naam van de laag. Hiermee stelt u in hoe lang dit frame in de animatie wordt weergegeven. De ms staat voor milliseconden en elke milliseconde is een duizendste van een seconde. Dit eerste frame wordt een kwart seconde weergegeven.

   

4. Stel frame twee in. Voor de zelfstudie wordt een voetafdrukafbeelding gebruikt voor dit frame. Ga naar Bestand > Openen als lagen en selecteer het grafische bestand. Dit plaatst de footprint op een nieuwe laag die naar wens kan worden gepositioneerd met behulp van de Verplaatsingstool.

   

5. Net als bij de achtergrondlaag, moet deze nieuwe laag worden hernoemd om de weergavetijd voor het frame toe te wijzen. In dit geval 750 ms. In de Lagen palet, lijkt het nieuwe laagvoorbeeld een zwarte achtergrond rond de afbeelding te tonen, maar in werkelijkheid is dit gebied transparant.

   

6. Stel frame drie, vier en vijf in. De volgende drie frames zijn meer voetafdrukken die over de banner lopen. Deze worden op dezelfde manier ingevoegd als frame twee, met dezelfde afbeeldingen en een andere afbeelding voor de andere voet. Net als voorheen is de tijd ingesteld op 750 ms voor elk frame. Elk van de voetafdruklagen heeft een witte achtergrond nodig, zodat slechts één frame ooit zichtbaar is – momenteel heeft elk een transparante achtergrond. We kunnen dit doen door een nieuwe laag direct onder een footprint-laag te maken, de nieuwe laag met wit te vullen en vervolgens met de rechtermuisknop op de footprint-laag te klikken en te klikken Omlaag samenvoegen.

7. Frame zes instellen. Dit frame is slechts een leeg frame gevuld met wit waardoor het lijkt alsof de uiteindelijke voetafdruk verdwijnt voordat het laatste frame verschijnt. We hebben deze laag Interval genoemd en hebben ervoor gekozen deze weergave slechts 250 ms te laten duren. U hoeft lagen geen naam te geven, maar het kan gelaagde bestanden gemakkelijker maken om mee te werken.

   

8. Frame zeven instellen. Dit is het laatste frame en toont wat tekst samen met het Lifewire.com-logo. De eerste stap hier is om nog een laag toe te voegen met een witte achtergrond.

   

9. Gebruik vervolgens de Teksttool om de tekst toe te voegen. Dit wordt toegepast op een nieuwe laag​ maar we zullen dat behandelen zodra u het logo of de nieuwe afbeelding heeft toegevoegd, wat op dezelfde manier kan worden gedaan als de voetafdrukafbeeldingen eerder zijn toegevoegd.

   

10. Als we deze naar wens hebben geregeld, kunnen we gebruik maken van Omlaag samenvoegen om de logo- en tekstlagen te combineren en vervolgens die gecombineerde laag samen te voegen met de witte laag die eerder was toegevoegd. Dit produceert een enkele laag die het uiteindelijke frame zal vormen en we hebben ervoor gekozen om dit gedurende 4000 ms weer te geven.

    

11. Bekijk een voorbeeld van de animatie. Voordat de geanimeerde GIF wordt opgeslagen, heeft GIMP de mogelijkheid om deze in actie te bekijken door naar Filters > Animatie > Afspelen. Dit opent een voorbeeldvenster met zelfverklarende knoppen om de animatie af te spelen. Als iets er niet goed uitziet, kan het op dit punt worden gewijzigd. Anders kan het worden opgeslagen als een geanimeerde GIF. De animatiereeks wordt ingesteld in de volgorde waarin de lagen zijn gestapeld in de Lagen palet, beginnend vanaf de achtergrond of de onderste laag en naar boven toe werkend. Als uw animatie niet in de juiste volgorde wordt afgespeeld, moet u de volgorde van uw lagen aanpassen door op een laag te klikken om deze te selecteren en de pijlen omhoog en omlaag in de onderste balk van de Lagen palet om de positie te wijzigen.

    

12. Bewaar de geanimeerde GIF. Het opslaan van een geanimeerde GIF is een vrij eenvoudige oefening. Ga eerst naar Bestand > Bewaar een kopie en geef uw bestand een relevante naam en selecteer waar u uw bestand wilt opslaan.

    

13. Ga vervolgens naar Bestand > Exporteren als om het op te slaan als een geanimeerde GIF.

    

14. In de Afbeelding exporteren dialoogvenster dat wordt geopend, selecteer Selecteer Bestandstype en scrol naar GIF-afbeelding en selecteer deze, selecteer vervolgens Exporteren. Als u een waarschuwing krijgt over lagen die verder gaan dan de werkelijke randen van de afbeelding, selecteert u de Bijsnijden knop.

    

15. Dit zal nu leiden tot de Opslaan als GIF dialoog met een sectie van Geanimeerde GIF-opties. Je kunt deze op hun standaardwaarden laten staan, maar als je wilt dat de animatie maar één keer wordt afgespeeld, moet je het vinkje weghalen Voor altijd herhalen.

    

16. Nu kunt u uw geanimeerde GIF delen.

Gevolgtrekking

De hier getoonde stappen geven u de basishulpmiddelen om uw eigen eenvoudige animaties te maken, met verschillende afbeeldingen en documentformaten. Hoewel het eindresultaat vrij eenvoudig is in termen van animatie, is het een heel eenvoudig proces dat iedereen met een basiskennis van GIMP kan bereiken.