fantastico y sensacional tutorial fireworks

30
Práctico Manual FIREWORKS 8 Patricia González Cristóbal Rojas

Upload: patita-gonzalez

Post on 06-Jun-2015

7.266 views

Category:

Documents


4 download

DESCRIPTION

Si tienes ganas de aprender, saber hacer gifts y animaciones... mira

TRANSCRIPT

Page 1: Fantastico y Sensacional Tutorial FIREWORKS

Práctico Manual FIREWORKS 8

Patricia González

Cristóbal Rojas

Page 2: Fantastico y Sensacional Tutorial FIREWORKS

FIREWORKS

Adobe Fireworks (Fw) Es una aplicación en forma de estudio (basada en la forma de estudio de Adobe Flash) pero con más parecido a un taller destinado para la edición y optimización para Web de gráficos en mapa de bits o vectoriales.

Originalmente fue desarrollado por Macromedia, compañía que fue comprada en 2005 por Adobe Systems.

Fireworks está enfocado en la creación y edición de gráficos para Internet.

Page 3: Fantastico y Sensacional Tutorial FIREWORKS

Área de trabajo Al entrar a Fireworks nos encontramos con la siguiente

pantalla:

Page 4: Fantastico y Sensacional Tutorial FIREWORKS

Luego vamos a Archivo(File)>Nuevo(New), y nos aparece esta ventana, que sirve para configurar el área de trabajo:

Acá están las opciones para determinar el ancho (width) y el alto (height) del lienzo, la resolución y el sistema de medidas que queremos utilizar: pixeles, pulgadas (inches), o centímetros.

Page 5: Fantastico y Sensacional Tutorial FIREWORKS

Herramientas A la izquierda o en algún lugar

de la pantalla, encontramos la llamada caja de herramientas, que sirve para comenzar todo tipo de proyecto en Fireworks.

Cada una tiene una aplicación distinta para utilizar, como los tipos de trazados, gotero y la pluma con la que realizamos puntos vectoriales.

Page 6: Fantastico y Sensacional Tutorial FIREWORKS

Rectángulos, líneas y elipses:1. Dibuje un rectángulo con la

herramienta correspondiente (pluma o lazo)

2. Ventana (Window)>Objeto (Object). O Alt+F2

3. Le aparecerá una ventana "Objeto":En esta ventana hay opciones para dar un ángulo de "redondeado" (roundness) a las puntas del rectángulo, y para poner el trazo, hacia adentro, centrado, o hacia afuera con respecto al objeto (stroke). Opciones similares aparecen si va a dibujar elipses o polígonos.

Page 7: Fantastico y Sensacional Tutorial FIREWORKS

También se puede hacer lo mismoteniendo seleccionada la herramientapolígono, pero antes de dibujar unobjeto: Ventana>Opciones deherramienta (Tool options), y verá queaparecen las siguientes opciones, quele permiten seleccionar:

1. Si va a dibujar un polígono o una estrella.

2. Cuántos lados tendrá el polígono o cuántas puntas la estrella.

3. El ángulo de los lados de la estrella.

Page 8: Fantastico y Sensacional Tutorial FIREWORKS

Otras herramientas de trazado:

Lápiz : es para dibujar a mano alzada. El trazo abierto se finaliza en cualquier lugar. El trazo cerrado, en el mismo lugar donde se empezó, y la figura resultante se le puede dar relleno.

Pincel : permite pintar pinceladas de estilo libre, mientras que la herramienta Lápiz dibuja trazos de lápiz de un píxel.

Pluma : es para realizar trazados segmento por segmento. Los nodos resultantes en este trazado, poseen sub-nodos que ayudan a la modificación en la curva de alguno de esos segmentos.

Page 9: Fantastico y Sensacional Tutorial FIREWORKS

Además: El trazado, color, efecto y otras características, son

modificables desde la ventana de trazado (stroke).

• Tanto las imágenes creadas con las herramientas de dibujo, se pueden modificar desde las ventanas de Relleno y Borde (Fill y Stroke) a las que se accede desde el menú ventana (Window).

Page 10: Fantastico y Sensacional Tutorial FIREWORKS

Edición y remodelado de imágenes: Las imágenes aparecen seleccionadas por defecto con una delgada

línea azul. Haciendo clic en cualquiera de sus nodos con la herramienta de “Selección” , podemos cambiar el tamaño. Pero, si queremos cambiar el tamaño conservando las proporciones, debemos utilizar la herramienta “Escalar”

Otra opción que da “Escalar” girar el objeto

Page 11: Fantastico y Sensacional Tutorial FIREWORKS

Insertar imágenes:

1. Menú Insertar (Insert)> Imagen (Image).2. Seleccionar la imagen que se va a insertar.3. OK o Aceptar.

Las imágenes se insertan con su tamaño y peso original. En caso que el tamaño del lienzo (canvas) difiera con el de la imagen, se puede arreglar mediante el comando “Recortar” (Trim) del menú “Modificar” (Modify).

Page 12: Fantastico y Sensacional Tutorial FIREWORKS

Efectos:

Seleccionada la imagen a la que se quiere aplicarlos, ir al menú Ventana(Window)> Efectos(Effect). Entonces aparecerá esta ventana:

En principio aparece sin ningún efecto

seleccionado

Page 13: Fantastico y Sensacional Tutorial FIREWORKS

Al desplegar el menú aparecerán las opciones y los efectos que se utilizan por defecto (use defaults):

Page 14: Fantastico y Sensacional Tutorial FIREWORKS

Los efectos "por defecto" son cuatro:

1. Inner Bevel

2. Outer Bevel

3. Drop Shadow

4. Glow

Page 15: Fantastico y Sensacional Tutorial FIREWORKS

Cada uno de ellos posee un menú desplegable (que se activa al hacer clic en la "i" azul que se ve en la imagen) para configurar en detalle cada uno de los efectos que se elijan:

Page 16: Fantastico y Sensacional Tutorial FIREWORKS

Otra de las opciones para aplicar efectos es la "Librería de estilos", que se activa mediante el menú Ventana (Window), y luego Estilos (Styles).

Page 17: Fantastico y Sensacional Tutorial FIREWORKS

Fireworks, también le da la posibilidad de crear sus propios estilos e incorporarlos a la lista de los que ya existen.Se debe partir de una imagen existente, una que ya tenga distintos efectos y estilos, aplicados por uno mismo.1- Seleccionar la imagen.2- Haga clic en el botón Estilo Nuevo (New Style) de la ventana de estilos:

Page 18: Fantastico y Sensacional Tutorial FIREWORKS

Enmascaramiento de imágenes: Las máscaras se crean agrupando dos objetos en un grupo de

máscara. El objeto superior (la máscara) se utiliza para crear un efecto de recorte sobre el objeto inferior. Ejemplo:

Dos objetos

Elipse sobre imagen

Luego, aplicamos: -Modificar (Modify)>-Máscara (Mask)>-Agrupar como máscara (Group as Mask).

Page 19: Fantastico y Sensacional Tutorial FIREWORKS

Otro caso es cuando el elipse esta por debajo de la imagen, adopta el color de ella.

o

• Cuando la máscara se halla por debajo del objeto, este adoptará la

gama de colores que le defina la máscara.

Page 20: Fantastico y Sensacional Tutorial FIREWORKS

Gifts animados:

En Fireworks es posible abrir y editar animaciones GIF existentes o crear otras nuevas".

• “Serie de imágenes fijas” que lo conformarán. Imágenes creadas en fireworks o cargadas al programa.

Page 21: Fantastico y Sensacional Tutorial FIREWORKS

• Estas imágenes se pegan, en un lienzo nuevo, una sobre otra pero perfectamente centradas.

Page 22: Fantastico y Sensacional Tutorial FIREWORKS

• Siguiente paso es ir a Ventana(Window)>Fotogramas(Frames).

• En esa misma ventana vamos al botón “Distribuir en Frames” (Distribute to frames), y automáticamente, las imágenes se distribuyen cada una en un frame distinto.

Page 23: Fantastico y Sensacional Tutorial FIREWORKS

• Ahora se configuran los "tiempos" de la animación. En la parte inferior de la ventana Fotogramas (Frames), esta el botón (Forever), que da las opciones de hacerlo hasta 20 veces, continuamente o sin repetición alguna.

Page 24: Fantastico y Sensacional Tutorial FIREWORKS

También se puede configurar la duración del tiempo de los frames, individual o generalmente. Esto se hace cliqueando dos veces en el número que aparece a la derecha de cada número de frame. Allí aparecerá un menú en donde se configura el tiempo que durará CADA FRAME. Si se quiere configurar la duración de TODOS los frames, habrá que seleccionarlos todos antes de hacerlo.

Page 25: Fantastico y Sensacional Tutorial FIREWORKS

Otras opciones de configuración:1- Para agregar un frame.2- Para eliminar el/los frame/s seleccionado/s.

• Finalmente PLAY

Page 26: Fantastico y Sensacional Tutorial FIREWORKS

Creación y organización de capas:

La ventana que permite trabajar con las capas (layers) está en el menú Ventana(Window)>Capas(Layers).Por defecto, el lienzo aparece con dos capas: la capa web y la capa 1.

Page 27: Fantastico y Sensacional Tutorial FIREWORKS

Ejemplo:

En un documento recién abierto, insertar una foto. Esta aparecerá en una capa independiente de la capa 1. Al estar en la capa 1 se dibuja una figura geométrica y luego colocarla sobre la figura. Esta imagen y las otras que se vayan agregando tendrán su capa exclusiva.

Las capas sirven para tener todo elemento independiente con un orden y posibilidad de editar cada capa, agregando efectos, darle nombre a la capa, cambiar colores, tamaño y hasta posición de ésta.

Page 28: Fantastico y Sensacional Tutorial FIREWORKS

Historial del documento:

Además:

1- Deshacer y rehacer comandos frecuentes.2- Seleccionar un número determinado de comandos realizados para repetirlos.3- Seleccionar y guardar un grupo de comandos recientemente realizados, para guardarlo como un solo comando

Permite ver, cambiar y repetir el historial del documento.

Page 29: Fantastico y Sensacional Tutorial FIREWORKS

Guardar como… Para guardar el

proyecto ir a Archivo, Guardar como, elegir tipo de formato.

El formato puede ser a elección.

Page 30: Fantastico y Sensacional Tutorial FIREWORKS

GRACIAS POR SU TIEMPO...

“AHORA PASAMOS A LAS NOTAS”