L'objectiu d'aquesta pràctica és conèixer què són els GIF animats i com crear-los amb l'ajut de l'Animation Shop. També tractarem de les imatges amb fons transparent.
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.

    I com a desavantatges:

  • 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.
  • 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.

Desenvolupament de la pràctica :

El que fareu en aquesta pràctica és que 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 imatge4.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.
  • Obriu el fitxer bfly1.gif, que es trobarà a la carpeta del vostre disc dur, on haureu descomprimit l'arxiu descarregat, amb l'Animation Shop, mitjançant l'opció Abrir del menú Archivo.

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ó.

 

 

Material realitzat pel Programa d'Informàtica Educativa