El gif animado es una buena opción para la web, ya que su peso es bastante reducido, y nos permite llegar mas rápido al usuario, ademas de que tenemos posibilidades como el acceso a los celulares, lo cual no es posible atravez de las animaciones en flash.
Para hacer un gif animado lo primero que hay que hacer es crear un nuevo documento en fireworks del tamaño que se desea la animación. Importamos a imagen y la optimizamos, en este caso utilizaremos 3 imágenes, las cuales cambiaran cada determinado tiempo, también podemos exportar texto o ilustraciones. Una vez optimizadas, las guardamos como jpg.
Los fotogramas van a crear los momentos de las animaciones. Abrimos los 3 archivos ya optimizados, con el tamaño deseado y en la parte de abajo, existe la opción de abrir como untitled o como animación, elegimos la animación y automáticamente se convertirán en states de una misma imagen, la similitud con los procesos anteriores de botones es igual, con la diferencia de que esta vez podremos manipular el tiempo de cada una de ellas.
En la parte de abajo de las imágenes nos aparece un cuadro de herramientas en donde esta el play, para que podamos visualizar como esta quedando nuestra animación. en el cuadro de los states, tenemos la opción de modificar el tiempo que tendrá cada fotograba. Para reducir su peso, elegimos la opción de no transparencia y comenzamos a optimizarlo hasta lograr un buen resultado con un bajo peso de las imágenes. Antes de guardar nuestra animación, debemos cambiarla a la opción de gif animado, de no ser así, no nos reconocerá la animación el servidor. Lo guardamos como images only, y lo arrastramos a un explorador para ver la animación.
Nuestro gif no debería pesar mas de 100 kb, un buen ejemplo es la pagina de www.santande.com.mx, lo primero en cargarse en la pagina son las animaciónes en gif, lo que mas tiempo tarda, son las animaciones flash.
Para realizar una animación básica en fireworks, vamos a utilizar de nuevo el panel de los states, veremos lo que se conoce como interpolación de movimiento. Como sabemos, cualquier animación se compone de puntos críticos de movimiento, es decir, el inicio y el final de una acción, o el inicio y final de la animación. En este caso necesitamos el inicio de un objeto y el final de su movimiento. No debemos olvidar la planeación, resulta extremadamente importante a la hora de animar, ya que los estados guardaran la información de atrás hacia adelante, un error nos costaría regresar a cada uno de los cuadros, o estados para mandar hacia adelante o hacia atrás el objeto.
Los pasos para animar serán los siguientes: Seleccionamos el objeto y lo convertimos a símbolo eligiendo la opción de gráfico. lo colocamos en su posición final y seleccionamos ambos objetos, damos click derecho y vamos a la opción de convertí to symbol, ahí encontramos la opción de tween instantes o interpolación de movimiento, nos pregunta en cuantos cuadros queremos animar, seleccionamos el numero y la opción de distribuir en los states.
Podemos seguir haciendo este proceso cuantas veces queramos, siempre tomando en cuenta que las acciones se guardaran de atrás hacia adelante, lo guardamos como gif animado y listo lo podemos visualizar en cualquier explorador.
Una vez realizados las animaciones, las podemos exportar como htm, y subir a nuestra pagina en dreamweaber, en algún frame adaptado a este tamaño.
No hay comentarios:
Publicar un comentario