Fa temps que es va establir la possibilitat de l'existència de colors transparents, així com què un fitxer GIF pogués contenir internament múltiples imatges, visibles durant un temps determinat, amb el qual s'obtenia una imatge animada. Però aquesta característica va estar oblidada fins que a finals del 1995 Netscape la va implementar en el seu navegador (versió 2.0), adquirint molt ràpidament una gran popularitat.

 Els GIF animats presenten certs avantatges:

• Fàcils de crear: els autors no necessiten dominar llenguatges de programació o que tinguin un accés especial a un servidor web.
• Fàcils d'integrar en una pàgina web: es criden de la mateixa forma que una altra imatge.
• Al ser fitxers GIF tenen compressió sense pèrdua.
• Àmpliament suportats en eines de navegació i plataformes.
• No carreguen el tràfic de dades, ja que l'usuari el carrega d'una sola vegada i s'executa des del catxé del navegador.

• Els GIF en bucles infinits (que no paren mai) molesten, encara que els usuaris poden desactivar l'animació fent clic al botó Parar del navegador.
• No existeix interactivitat, és a dir, no es pot parar o iniciar la reproducció com passa amb altres tipus d'animacions (Shockwave, Flash, Quicktime...)
• No hi ha so.
• Sols permeten 256 colors.
• No tots els navegadors mostren l'animació a la mateixa velocitat.
  
  

Feu un bon ús de les animacions GIF. Les animacions GIF poden ser tan molestes com utilizar colors llampants en el fons de les pàgines web. Utilitzeu animacions GIF per:

• Cridar l'atenció sobre informació important en una pàgina, com per exemple el punt principal.
• Oferir entreteniment, com per exemple, un personatge animat.
• Il·lustrar un procés dinàmic.
• Il·lustrar diverses vistes d'un objecte.

El que fareu en aquesta pràctica és una animació a partir d'un seguit d'imatges ja fetes. Les obrireu i seguidament els donareu uns quants paràmetres per acabar d'ajustar l'animació.

• Descarregueu el fitxer imatge12.zip i descomprimiu-lo en el vostre disc dur amb l'ajut del programa Winzip.
  
  
• Obriu el programa Animation Shop, des del menú Archivo | Ejecutar Animation Shop del programa Paint Shop Pro.  Si no localitzau aquesta opció al menú Archivo, vol dir que mai heu executat l'Animation Shop. Haureu d'obrir-lo abans des de Mi PC o des de l'Explorador de Windows. Localitzeu la carpeta on teniu el Paint Shop Pro i cerqueu el fitxer Anim.exe

• Les properes vegades ja trobareu l'opció per executar-lo des del menú Archivo del Paint Shop Pro.
  
  
• Des de l'Animation Shop, mitjançant l'opció Abrir del menú Archivo, obriu el fitxer bfly1.gif, que es trobarà a la carpeta del vostre disc dur, on haureu descomprimit l'arxiu descarregat. Veureu que teniu la imatge posada en un quadre envoltada per altres quadres en blanc.
  
  



La F:1 vol dir que la imatge està en el quadre 1 (frame en anglès), i la D:10 vol dir que té una espera (delay en anglès) de 10 centèsimes de segon.
 

• A continuació carregueu les altres imatges, una darrere de l'altre, segons l'ordre establert pel nom del fitxer (bfly2.gif, bfly3.gif...). Aquesta acció la podeu fer amb l'opció Insertar cuadros desde archivo del menú Editar.

Quan realitzeu aquesta acció veureu que us mostra un quadre de diàleg, on li podeu dir quines imatges haurà de posar.

• Amb l'ajut dels botons Subir i Bajar poseu l'ordre tal com us mostra el gràfic. Una vegada tingueu el mateix ordre, feu clic al botó Aceptar.
   
• Per veure l'animació aneu a l'opció Animación del menú Ver, i us mostrarà una finestra amb l'animació tal com queda.



• Si voleu modificar el retard entre els quadres poseu-vos sobre el quadre a modificar, feu clic al botó dret del ratolí i seleccioneu Propiedades del cuadro. Allà podeu posar el nombre de centèsimes de segon que desitgeu.

 
• També podeu posar efectes de transicions entre dos quadres. Per fer-ho feu clic amb el botó dret del ratolí sobre un quadre i escolliu l'opció Transición de imagen.

 
• Finalment, deseu l'animació amb l'opció Guardar como... del menú Archivo. Quan feu això us mostrarà un assistent perquè trieu quina qualitat voleu que tingui l'animació. Seguiu les instruccions i ja haureu fet la vostra primera animació.

Una altra qüestió a tenir molt en compte és la següent: com ja hem comentat, els programes gràfics tenen normalment un color de primer pla (foregroun") i un altre de fons (background). Per aconseguir la transparència amb el Paint Shop Pro haureu de forçar al programa gràfic perquè el seu color de fons sigui precisament el color que vulgueu fer transparent. 

• Obriu el fitxer imatge13.gif amb el Paint Shop Pro.






• Una vegada teniu oberta la imatge, assegureu-vos que teniu seleccionat com a color de fons (o també anomenat de 2n pla) el mateix color verd, que serà el color al qual li voleu donar transparència. Per fer-ho, utilitzeu l'eina Cuentagotas i feu clic amb el botó dret del ratolí damunt el color verd a qualsevol costat del barret. La selecció de colors de la paleta de colors ha de quedar com a la següent imatge.
  
  



• A continuació aneu a l'opció Configurar transparencia de paleta del menú Colores. Us mostrarà un quadre de diàleg com el següent:






• Seleccioneu l'opció que posa Config. el valor de transp. según el color actual de 2º plano. Això us posarà com a color transparent el color que teniu seleccionat com a color de fons, en aquest cas el verd. Podeu fer clic en el botó Probar per veure com us quedaria la imatge. La part transparent es mostrarà com un tramat de colors gris i blanc.
  

 

• Finalment deseu el fitxer en el format GIF amb l'opció Guardar como... del menú Archivo. Mireu que el guardeu amb el subformat GIF 89a. Per comprovar-ho feu clic al botó Opciones... i us apareixerà el quadre de diàleg següent:

Poseu tal com us ho mostra la imatge i ja tindreu el GIF amb transparència. Per comprovar-ho podeu posar la imatge sobre una altra amb un fons de diferent color i observareu com el color verd ja no apareix.