Tip: Een animated GIF maken voor het web. In deze tip ziet u hoe u met behulp van Adobe Photoshop een geanimeerde afbeelding (animated GIF) kunt maken voor het web.
Ik maak voor het voorbeeld in Photoshop een nieuw bestand aan van 90 x 90 pixels (72dpi) maar in principe kan dit met iedere afmeting afbeelding. Houd er wel rekening mee dat een grote geanimeerde GIF afbeelding erg groot kan worden qua bestandsformaat en dat dit dan een (te) lange laadtijd met zich mee zal brengen.
Lagen
Als eerste moet u de achtergrondlaag omzetten naar een gewone laag want de achtergrondlaag kan niet omgezet worden naar een geanimeerde GIF. Om dit te doen klik je nadat je de achtergrondlaag hebt geselecteerd op het kleine hamburgermenu van het lagen palet en kies je voor ‘Laag uit achtergrond’. Je kan ook ‘control’ + ‘klikken’ op de laag als je efficienter wil.
Ik heb deze laag ‘Laag 1’ genoemd en vervolgens nog zeven andere lagen aangemaakt. Elke laag is straks een frame in de animatie.
Op elke laag heb ik een zwart kader van 30 x30 pixels gemaakt, steeds op een opvolgende positie binnen een 3 x 3 stramien.
Tijdlijn
Nu je alle lagen hebt kan je beginnen met de tijdlijn, deze open je via het menu ‘Venster’ > ‘Tijdlijn’.
Klik vervolgens op de tekst ‘Videotijdlijn maken’
De lagen komen nu op de tijdlijn te staan.
Omzetten
Versleep de paarse balken nu dusdanig dat ze elkaar niet meer overlappen. In mijn geval heb ik steeds een inspringing en een lengte van 3 seconden gedaan. De lengte maakt nu nog niet uit, deze stellen we op een later tijdstip in.
Kies vervolgens via het hamburgermenu van het tijdlijn venster voor ‘Frames omzetten’ > ‘Omzetten in frameanimatie’.
Frames
Nu zie je in de tijdlijn de frames van de animatie staan, je kunt hier per frame instellen wat de duur is waarin het frame getoond zal worden en je kan ook aangeven of de animatie altijd moet door blijven lopen (loopen), 3x de reeks afloopt of dat het maar een enkele reeks is. In dit voorbeeld heb ik de duur per frame ingesteld op 5 seconden en blijft de animatie zich altijd herhalen.
Exporteren
Nu kan je de GIF exporteren via het menu ‘Bestand’ > ‘Exporteren’ > ‘Opslaan voor web (verouderd)’.
Zorg er voor dat je GIF kiest en probeer zo min mogelijk kleuren mee te geven, hierdoor blijft de animatie zo klein mogelijk qua bestandsformaat.
Resultaat:
