domingo, 25 de julio de 2010

Animaciones de Movimiento

Objetivo.
Crear una animación sobre un texto separándolo en bloques de letras cuyo movimiento será tratado de manera independiente, dando al texto un efecto vistoso que pudiera servir como presentación de entrada a una web u otro tipo de película.

Ejercicio paso a paso.

Vamos a basarnos en el ejemplo que acabamos de ver, para tener claro nuestro objetivo. Luego podremos extrapolarlo a cualquier otro texto. Veamos cómo conseguir esos efectos combinando las técnicas vistas hasta el momento.

1 Escribimos el texto en cuestión, en nuestro caso "aulaClic".

2 Abrimos el Panel Propiedades (tras seleccionar el texto) y seleccionamos el tipo de letra. Nosotros hemos elegido "Ruach Let", pero cualquiera es válida.

3 Seleccionamos el texto recién escrito.

4 Accedemos al menú Modificar → Separar. Con esto separamos cada letra ya que de no hacerlo Flash trataría todo el texto como un bloque y no podríamos dar el efecto a las letras.

Vamos a separar el texto en los siguientes bloques: "a", "u", "la" y "Clic". Podríamos cambiar los bloques si quisieramos dar otro efecto en concreto.

5 Seleccionamos dichos bloques y los convertimos a símbolos, dándoles un nombre identificativo y el Comportamiento gráfico, ya que no los animaremos "internamente".

6 Creamos 5 nuevas capas, una por cada bloque que hemos creado.

Esto último es necesario ya que si no lo hiciéramos Flash aplicaría el movimiento a todo aquello que encontrara en dicha capa, ya que como hemos comentado anteriormente, lo convertiría todo a símbolo automáticamente.

7 Nombramos cada una de las capas según el bloque de texto que vaya a contener, pero en orden inverso en el que vaya a producirse la animación, para que el objeto en movimiento se superponga a los que no lo están. Esto es, la capa de más arriba se llamará "Clic", la siguiente "la" y así sucesivamente.


8 Hacemos clic con el botón derecho sobre el único fotograma que tenemos en la línea de tiempos y en el menú emergente seleccionamos Copiar Fotogramas. A continuación vamos pegando los fotogramas (botón derecho → Pegar Fotogramas) en todas las capas.

9 Seleccionamos cada capa y vamos borrando las partes del texto que no corresponden con la parte del texto que debe contener. Es recomendable bloquear el resto de capas cuando se haga esto para asegurarnos de que borramos las letras de esa capa (hay que tener en cuenta que al principio todas las capas contienen lo mismo y superpuesto).

10 Situamos (arrastrando) el fotograma de cada capa a los siguientes frames:

"A" : Fotograma 1.

"U" : Fotograma 6.

"LA" : Fotograma 12.

"Clic" : Fotograma 18.

11 Seleccionamos el fotograma que ocupa cinco posiciones después del fotograma de cada capa y pulsamos F6 cada vez. En la capa "Clic" selecciona el fotograma 30 y pulsa también F6.

12 Hacemos clic con el botón derecho en los fotogramas centrales que hay entre los fotogramas claves y seleccionamos cada vez Crear Interpolación de Movimiento.

13 Extendemos la imagen los últimos fotogramas de cada capa hasta que ocupen el fotograma 30 (Botón derecho → Insertar Fotrograma Clave).

14 Exceptuando la capa "Clic" seleccionamos el primer fotograma de cada interpolación y aumentamos el tamaño del bloque que contiene.

15 Movemos ahora fuera del escenario el bloque "Clic".

16 Aún en esta capa, hacemos clic con el botón derecho sobre el fotograma 24 y seleccionamos Insertar Fotograma Clave.

17 En este fotograma recién creado reducimos el ancho del bloque de texto y lo colocamos junto a la última "a".

Y ya tenemos la animación creada. Como vemos hemos utilizado todo tipo de técnicas de interpolación, aunque todavía puede complicarse más como veremos más adelante.

Leer Mas

viernes, 16 de julio de 2010

Curso ONLINE de Flash 8

Entrar al siguiente link para empezar a reconocer la plataforma de flash 8, las diferencias con SWiSH Max y como hacer las primeras animaciones.
Leer Mas

lunes, 12 de julio de 2010

COMO COLOCAR FONDO TRANSPARENTE A UNA IMAGEN EN FIREWORKS

Abrimos Fireworks 8, pero con cualquier version se puede, incluso en photoshp el proceso es casi el mismo.
Tenemos las imagenes, las dos son bitmaps ninguna vectorizada.

Teniendo seleccionada la imagen a la que queremos quitarle el fondo damos click sobre la herramienta varita magica (esta sirve para seleccionar pixeles similares) y una vez seleccionada la varita damos click en la zona que que queremos eliminar.

En la barra de propiedades aparece el nivel de tolerancia de la barita, esto es para determinar el grado de similitud entre los pixeles, cuando el fondo es completamente de un solo color no es muy importante, pero si por ejemplo queremos quitar un cielo que tiene diferentes tonos de azul es bueno hacer pruebas de tolerancia.

Una vez seleccionado el fondo damos click en suprimir y borra el fondo de la imagen, aunque pueden quedar residuos como las lineas de los marcos que aparecen resaltadas por los recuadros rojos.

Usando la herramienta Lazo Poligonal rodeamos todas las areas con las impurezas que queremos eliminar, sin pasar por encima de la imagen, como muestra la linea punteada en la imagen y damos click en suprimir.

En la barra de propiedades recuerden mirar como aparecen los bordes, lo recomendable en este caso es suavizado mas adelante explicare porque.

Usando la herramienta trasnformacion libre, podemos cambiar el tamaño de la imagen y tambien podemos hacerla girar, esto para colocarla en la posicion deseada, luego en la barra de propiedades encima de efectos modificamos la transparencia de la imagen a nuestro gusto para que parezca que dos imagenes son una sola y asi no se nota "tanto" la superposicion.



Leer Mas

jueves, 8 de julio de 2010

SWiSH Max, Animación en FLASH para principiantes

Esta opinión ha sido evaluado como muy útil de media por 77 miembros de Ciao

Buenas tardes señores. Swish, un programa desarrollado para aquellas personas que aun no dominan el Macromedia Flash en sus distintas versiones. Pero vayamos por partes, pues en estas pocas frases se han lanzado muchos términos que para muchos suenan a chino.

Para los que no lo conozcan, Macromedia Flash es un software desarrollado, como bien indica su nombre, por Macromedia (los mismos de Dreamweaver, Freehand o Fireworks). Flash nos permite generar ficheros con una capacidad multimedia gigantesca para el poco espacio que ocupan. Nos permiten crear animaciones con clips de audio (incluso he llegado a ver casi películas en Flash). Esas magnificas animaciones, o esos preciosistas banners, algunos dignos de ser guardados en nuestros discos duros. Pero claro, esto es como el cine, lo que nosotros vemos tiene una ingente cantidad de trabajo detrás, cuya percepción se ve disminuida debido al poco tiempo de ejecución que suelen tener, o la rapidez con la que se ejecutan. Detrás de una animación en Flash hay, como mínimo, mucha paciencia. Y ese es el problema, que los usuarios inexpertos no suelen ser pacientes de primera hora, y quieren obtener resultados impresionantes en poco tiempo, cosa prácticamente imposible, debido principalmente a la cierta complejidad del programa de Macromedia.

Entonces ¿Qué se puede hacer? ¿Las animaciones en Flash están restringidas para aquellos cuya resistencia numantina seria digno de elogio? ¿Hay que apuntarse a algún curso como única salida? Pues estas preguntas tienen dos posibles respuestas. La primera es que si, que nos armemos de paciencia, que consigamos tutoriales, que nos apuntemos a algún curso para llegar a dominar completamente la, por otra parte, excepcional herramienta de Macromedia (y es que si fuese fácil no seria tan practica). La otra opción es usar Swish. Podríamos decir que Swish es una versión “sencilla” de Macromedia Flash.

El entorno de trabajo es similar al de Flash. Arriba se nos muestra un marco con la evolución temporal de nuestra animación, en la que vamos insertando distintos objetos y los colocamos en donde nosotros queramos, para que sean reproducidos en un momento u otro. Justo a la izquierda tenemos un pequeño menú que nos permite añadir una acción, entre las cuales se encuentran algunas tan interesantes como reproducir un clip de audio, cargar una URL o añadir un script.

En la parte inferior tenemos un gran marco en el que veremos nuestra película en el instante que tengamos seleccionado en la barra temporal anteriormente descrita. Además se nos añaden una serie de botones que nos permitirán transformar a nuestro antojo el frame actual. A la izquierda tenemos un marco que nos muestra a través de un árbol todos los elementos de nuestra animación y como están enlazados entre si. Y a la derecha, tenemos las distintas propiedades de los diferentes objetos. Básicamente se nos muestran cuatro pestañas: Película, Escena, Transformar y Acciones. En la primera se nos permite modificar el tamaño de la película, el color de fondo, la velocidad de los fotogramas… En Escena podemos especificar los enlaces que fabricamos en nuestra película. En Acciones tenemos un listado de los distintos eventos agregados a la película. Y finalmente en Transformar se nos provee de unos rangos para modificar visualmente los objetos que tengamos en pantalla, o sea, hacerlos mas anchos o estrechos, mas altos o bajos, rotarlos o desplazarlos por el fondo de la película.
Claro, todo esto esta de una manera más o menos compleja en Macromedia Flash. Entonces ¿Dónde esta la ventaja o la facilidad de usar Swish? Pues es algo difícil de explicar. Yo lo mostrare con un ejemplo bastante claro. Yo para lograr hacer la primera animación en Flash tuve que recorrerme todo el tutorial de Macromedia Flash, e incluso así me costo lo mió, pues es fácil perderse entre la infinidad de opciones que nos proporciona Flash. Sin embargo, con Swish logre crear una titulo animado en pocos segundos, y con una facilidad pasmosa. ¿A que se debe pues? Pues creo que esta facilidad de uso viene dada por la intuitividad del entorno que nos proporciona Swish. Un ejemplo: si plasmamos una palabra sobre el fondo de la película, podremos añadirle una animación bastante currada simplemente con ir al menú “Insertar”, y al submenú “Efectos”, y se nos expandirá una lista de posibles eventos que podemos aplicarle a nuestra palabra, como transformaciones carácter a carácter, giros, efecto de explosión… Y esto es lo que no tenemos en Macromedia Flash, pues para lograr un simple efecto de giro, tendremos que crearlo nosotros desde el principio, seleccionando el objeto, especificando un rango temporal en el que se sucede el evento, definir la posición final en la que queremos que nuestro objeto quede, y crear la animación. En comparación, Swish es muchísimo mas fácil.

Pero claro, también es muchísimo menos potente. En Swish tendremos que estar mas o menos atados a lo que los programadores han eliminado para ganar una mayor sencillez en el manejo.

Este programa, obviamente, no es gratuito, pero tampoco es que sea excesivamente caro, pues por la cantidad insignificante de treinta euros podemos adquirir la licencia. Pero como gran ventaja tiene que esta totalmente traducido al castellano (aunque el Macromedia Flash en todas sus versiones también ha sido traducido a nuestro rico idioma).

Comentar también que a parte de la versión 2, que es la que estamos comentando, también existe Swish Max, Swish Lite (que es una versión reducida de Swish, o sea, una miniversión de Flash), Swish Power FX, Swish Studio y Swish Pix. Cada una de estas versiones está orientada a cada uno de los grupos de usuarios, con sus respectivas necesidades. Yo os recomiendo que consigáis Swish 2, que es la estándar.

Y poco más que comentar, un gran programa que esta principalmente orientado a usuarios que quieran explotar su capacidad creativa y quieran tener una curva de aprendizaje asequible. Esta herramienta es el perfecto trampolín entre el usuario no iniciado y el usuario que maneja sin problemas la gran aplicación de Macromedia.

Así que ya sabéis, si no queréis romperos la cabeza entre mil y un tutoriales para lograr dominar desde cero a Macromedia Flash, empezad primero con Swish (que actualmente se encuentra en su versión 2), que os resultara muchísimo mas cómodo, y comprenderéis muchos aspectos de Flash que a primera vista son bastante abstractos y difíciles de entender.

Muchísimas gracias por seguir ahí. Un saludo.
Ivan-17

Leer Mas

Ejemplos de SWiSH FLASH Online!

Cuando navegamos por internet es bastante grato ver animaciones y efectos en sitios webs, la sensación de movimiento crea dinamismo a la web y evita que el usuario se aburra.

Por tal motivo Webmasters y diseñadores comienzan a desarrollar sus aplicaciones en Flash, y es por esto que quiero recomendarles Swish Max2, un programa con una amplia biblioteca de más de 350 efectos, 180 componentes y vectores con los que podrás realizar:

  • Botones animados
  • Películas de introducción
  • Barras de navegación
  • Presentaciones interactivas

SWiSHmax incluye también herramientas de dibujo, formas geométricas prediseñadas y te permite exportar tus creaciones a SWF, EXE y AVI.

Si deseas ver algunos ejemplos de animaciones creados por este programa, puedes visitar el apartado en la web oficial SWISH MAX Samples.

Leer Mas

jueves, 1 de julio de 2010

Descargar SWiSHMAX3 Completo + Tutoriales!!!

En esta entrada publico el enlace del cual pueden descargar el porgrama Swishmax3 completo, ademas agrego unos tutoriales con ejemplos para profundizar mucho más en el tema.

Aprovechenlos!

Leer Mas