You are on page 1of 55

FIREWORKS

QUE ES FIREWORKS?
Editor de grficos orientado al diseo y maquetacin de sitios web, con herramientas y funciones
para obtener resultados optimizados para la pantalla y diversos dispositivos.
Te ayuda a crear en un instante, y sin necesidad de escribir cdigo, atractivos diseos para sitios
web y apps para dispositivos mviles. Ofrece imgenes de mapa de bits y vectoriales, bocetos,
grficos en 3d y contenido interactivo para las Tablet y los Smartphone ms conocidos del
mercado.

Cmo ingresar al programa?


1. Situarse en botn Inicio de Windows
2. En el cuadro de bsqueda, escriba el nombre Fireworks
3. Ahora espere y vera una lista de alternativas acerca de su bsqueda
4. Seleccione en icono de Adobe Fireworks

Una vez cargado el programa le mostrara una pantalla de bienvenida.

Manual Fireworks by wizardhaarp ~1~


En esta ventana deber elegir el tipo de documento que desea crear.
Documento de Fireworks(PNG): esta opcin le permite crear un archivo nuevo.
Desde Plantilla: Fireworks le mostrara carpetas modelos y ejemplos ya realizados, y
utilizarlos como plantillas.
En el cuadro de dialogo Nuevo vera las siguientes opciones:

La opcin Anchura y altura del documento, se medir en pixeles, pulgadas o


centmetros.
La opcin de resolucin: Es interpretado como la calidad de la imagen, mientras la
resolucin sea ms grande, la calidad mejorara en la fotografa. El intervalo de medidas
de resolucin ms adecuado es entre 100 y 200, contrario Ud. Podr cambiar a la medida
que desea,
Las opciones color de lienzo: nos dar tres opciones, blanco, Transparente o color
personalizado.

Manual Fireworks by wizardhaarp ~2~


ENTORNO DE TRABAJO DE FIREWORKS

4 5

1. En la ventana de documento se encuentra el lienzo. Aqu es donde se muestra el


documento de Fireworks y las imgenes creadas.

GUARDAR UN DOCUMENTO DE FIREWORKS (PNG)

Para exportar una imagen debe seguir uno de los siguientes procedimientos:

Mediante el men Archivo:

Seleccione la imagen que desea exportar.


Elija Archivo > Guardar.
Elija una ubicacin para el archivo de imagen que se exportar.
Introduzca un nombre de archivo. No es necesario que introduzca una extensin.
Haga clic en Guardar.

Manual Fireworks by wizardhaarp ~3~


2. En la parte superior de la pantalla hay una barra de
mens. La mayora de los comandos de Fireworks
son accesibles desde la barra de mens.

3. En la izquierda de la pantalla se encuentra la barra


de Herramientas. Si la barra de Herramientas no
est visible, elija Ventana > Herramientas. El panel
Herramientas contiene las herramientas para
seleccionar, crear y modificar diversos elementos
grficos y objetos web.

4. En la parte inferior de la pantalla se encuentra el


Inspector de propiedades. Si no est visible, elija
Ventana > Propiedades. El Inspector de
propiedades presenta las propiedades del objeto o
la herramienta seleccionados.

5. En la parte derecha de su pantalla se encuentran


los paneles de trabajo. Estos paneles se habilitan
dentro del men ventana, luego elija la opcin que
desea activar.
Una vez creado el Archivo nuevo de Fireworks.
Importaremos una imagen para empezar a trabajar
herramientas de seleccin

Cmo Importar una imagen?


1. Elija Archivo > Importar y desplcese a la carpeta donde tenga la imagen.
2. Seleccione el archivo de imagen y haga clic en Abrir.
3. Coloque el puntero de insercin en el lienzo y haga clic.
4. La imagen aparece seleccionada en el lienzo.

Manual Fireworks by wizardhaarp ~4~


CAPAS

Un documento puede estar compuesto por muchas capas y cada una contener muchos
objetos. En Fireworks, el panel Capas muestra una lista de las capas y los objetos contenidos
en cada capa.
Cada objeto de un documento reside en una capa. Es posible crear capas antes de dibujar o
aadirlas cuando se vayan necesitando. El lienzo est situado debajo de todas las capas.

Visualizacin de herramientas:
Dibuje un rectngulo, una elipse y un polgono.

La capa polgono se encuentra sobre los objetos elipse y rectngulo


Para mover capas utiliza la opcin Ctrl + flecha arriba, para enviar el objeto
seleccionado sobre los dems elementos.

Manual Fireworks by wizardhaarp ~5~


El orden de apilamiento de las capas y objetos se puede ver en el panel Capas. Se trata
del orden en que aparecen en el documento. Fireworks apila las capas por el orden en
que se crearon, colocando la ms reciente en la parte superior de la pila. El orden de
apilamiento determina la manera en que los objetos de una capa se superponen a los
de otras. Es posible reorganizar el orden de apilamiento de las capas, as como el de los
objetos dentro de las capas.

El nombre de la capa activa aparece resaltado en el panel Capas. Es posible expandir


una capa para ver una lista de todos los objetos que contiene. Los objetos se
muestran como miniaturas.

Las mscaras tambin se muestran en el panel Capas. Para editar una mscara, es
posible seleccionar su miniatura. En el panel Capas, tambin se puede crear
mscaras nuevas.

Los controles de la opacidad y de los modos de mezcla se encuentran en la parte


superior del panel Capas.

Para aadir una capa:

Haga clic en el botn Capa nueva/duplicada sin que haya ninguna capa seleccionada.
Elija Edicin > Insertar > Capa.
Elija Nueva capa en el men de opciones del panel Capas y haga clic en Aceptar.

Manual Fireworks by wizardhaarp ~6~


Para eliminar una capa:

En el panel Capas, arrastre la capa al icono de cubo de basura.


Seleccione la capa y haga clic en el icono de cubo de basura del panel Capas.

Manual Fireworks by wizardhaarp ~7~


HERRAMIENTAS DE SELECCIN
Para poder seleccionar algunos objetos es necesario conocer algunas herramientas.

La herramienta Puntero: Se utiliza para seleccionar objetos al hacer clic en


ellos o arrastrar el puntero para crear un rea de seleccin a su alrededor.

La herramienta Sub seleccin: Selecciona un solo objeto de un grupo o los


puntos de un objeto vectorial.

La herramienta Seleccionar detrs: Selecciona un objeto situado detrs de


otro.

Prctica:
1. Importe diferentes imgenes como se muestra en la figura.

2. Ordnelos utilizando la herramienta Puntero.


3. Ahora utiliza la herramienta Sub seleccin para modificar las medidas o tamao de
las imgenes.
4. Si la imagen esta debajo de otras imgenes y solo desea moverla, utiliza la
herramienta Seleccionar detrs.

HERRAMIENTAS DE TRANSFORMACION Y DISTORSION DE OBJETOS


Escala, Inclinar, Distorsionar, Escala de 9 divisiones.

Escala: Aumenta o reduce un objeto.

Manual Fireworks by wizardhaarp ~8~


Inclinar: inclina un objeto a lo largo del eje especificado.

Distorsin: desplaza los lados o los ngulos de un objeto en la direccin en que se


arrastra el tirador de seleccin estando la herramienta activa. Esto resulta til para crear un
aspecto tridimensional.

Escala de 9 divisiones: Permite deformar libremente el objeto.

Practica 1 (escala y rotacin)

Elija una imagen


Elija la herramienta Escala
Arrastre los tiradores de transformacin:
Para cambiar la escala del objeto horizontal y verticalmente, arrastre un tirador de
esquina. Para cambiar la escala del objeto horizontal o verticalmente, arrastre un
tirador lateral

Para rotacin del objeto mover el puntero del mouse en una esquina de los tiradores
de transformacin, y vea el siguiente cursor para girar.

Nota: Tambin es posible cambiar el tamao de los objetos seleccionados introduciendo las
dimensiones en el Inspector de propiedades.

Practica 2 (inclinar)
Elija una imagen
Active los tiradores de transformacin:
Elija la herramienta Inclinar
Arrastre un tirador para inclinar el objeto.
Haga doble clic en la ventana o pulse "Intro" para eliminar los tiradores de
transformacin.

Manual Fireworks by wizardhaarp ~9~


Practica 3 (Distorsin)

Elija una imagen


Active los tiradores de transformacin:
Elija la herramienta Distorsionar
Arrastre un tirador para distorsionar el objeto.
Haga doble clic en la ventana o pulse "Intro" para aplicar los cambios.

Practica 4 (Escala de 9 divisiones)

Elija una imagen


Active los tiradores de transformacin:
Elija la herramienta escala de 9 divisiones
Mover las lneas para indicar la distorsin.
Haga doble clic en la ventana o pulse "Intro" para aplicar los cambios.

Manual Fireworks by wizardhaarp ~ 10 ~


EXPORTACIN DE IMGENES

Para exportar una imagen debe seguir uno de los siguientes procedimientos:

Mediante el men Archivo:

Seleccione la imagen que desea exportar.


Elija Archivo > Exportar.
Elija una ubicacin para el archivo de imagen que se exportar.
Introduzca un nombre de archivo. No es necesario que introduzca una extensin.
Elija "Slo imgenes" en el men emergente "Tipo".
Haga clic en Guardar.

MAPA DE BITS

TRABAJO CON FIGURAS VECTORIALES

Dibujo de formas bsicas

Los cuadrados, rectngulos, crculos, valos, estrellas y


otros polgonos son muy fciles de dibujar con las
herramientas de formas bsicas.

Las herramientas de dibujo de formas bsicas se


encuentran en la seccin "Vector" del panel
Herramientas.

Cuando se utiliza una herramienta de dibujo o


pintura para crear un objeto, los atributos de trazo
y relleno actuales se aplican al mismo.

Practica 1 (Relleno y trazo)

Dibujar un rectngulo
Vea en el inspector de propiedades la opcin relleno

Seleccione un color de relleno


Presione Intro para finalizar.

Practica 2 (Trazo)

Dibujar un Ovalo

Manual Fireworks by wizardhaarp ~ 11 ~


Vea en el inspector de propiedades la opcin relleno
Seleccione la opcin color de trazo
Configure el ancho de trazo a 20
Presione Intro para finalizar

Practica 3 (Trazo y relleno degradado)

Dibujar una estrella


En el Inspector de Propiedades elija la opcin tipo de relleno
Ahora cambie la opcin a degradado

Elija el tipo de degradado

Elija el tipo de borde


Si desea cambiar los colores del degradado

Pulse el botn relleno y aparecer un nuevo cuadro.

Color o
muestra Opacidad

de color del color

Opacidad de color: nos permite que la muestra sea ms transparente

Manual Fireworks by wizardhaarp ~ 12 ~


Si desea cambiar el color solo pulse un clic sobre la muestra de color, elija el
color.
Si desea agregar ms muestras de color solo presione un clic donde desea
agregarlo.
Por ejemplo:

Dibujar un rectngulo con esquinas redondeadas

Elija la herramienta "Rectngulo redondeado", situada en el men emergente


de la herramienta Rectngulo.

Arrastre el ratn por el lienzo para dibujar el rectngulo.

Para cambiar la redondez de la figura mover los puntos de control color


amarillo.

Redondeo de cuadrados con el inspector de propiedades

Dibujar un rectngulo
Ver en el inspector de propiedades la opcin redondez, aumente el porcentaje de
redondez y vea el rectngulo.

Manual Fireworks by wizardhaarp ~ 13 ~


Fundido de texto

Dibuje un circulo
Seleccinelo y pinte el objeto
Utiliza la herramienta sub seleccin para modificar los nodos y moverlos.

En el Inspector de propiedades, elija la opcin Borde: Fundido


Modifique la cantidad a 30

Practica 1 (Botn traslucido)


Aplique relleno
Dibuje un rectngulo redondeado
Pinte en colores degradado lineal degradado
Duplique y reduzca la altura vea la imagen

Manual Fireworks by wizardhaarp ~ 14 ~


Fundido al 13% color blanco

Rectngulo con
Borde fundido al
45 %

Rectngulo con
Borde fundido al
71 %

HERRAMIENTA TEXTO

Esta herramienta nos permite aadir un texto, palabra o frase en cualquier parte de
nuestro documento.

Aplicacin:

Seleccione la herramienta texto y pulse un clic sobre el lienzo


Ahora digite el siguiente texto: Un caminante iba por los bosques, cuando la
luna llena alumbraba el sendero, miro las estrellas y vio lo hermoso que era
ser tan inmenso, hermoso y brillante como se vea desde all arriba,
entonces pens y sonri que cosas interesantes hay en el mundo, que
todava no estn descubiertas!

Seleccionado su texto ver las siguientes herramientas en el inspector de


propiedades.

Elija el tipo de letra, estilo de letra, tamao de fuente, color de fuente, negrita,
cursiva o subrayado.
Practica 1:

Seleccione su texto
Cambiar el tipo de letra a: Bernard MT Condensed Color: Amarillo tamao: 25

Manual Fireworks by wizardhaarp ~ 15 ~


Elija color de trazo: Negro

HERRAMIENTA LINEA

Nos permite dibujar lneas verticales y horizontales.

Para comenzar a dibujar, haga clic en la herramienta lnea.


Para dibujar una lnea recta, seale con el puntero el lugar donde desea que
empiece la lnea y arrastre para dibujarla.

Para aadir un segmento de lnea a una lnea seleccionada, seale con el puntero
el nodo final de la lnea seleccionada y arrastre para dibujarla.

Practica 2 (Titulo)

Seleccione la herramienta texto escriba la palabra Mountain


Cambie el tipo de letra, tamao de letra, color de letra a:

Manual Fireworks by wizardhaarp ~ 16 ~


Ahora escriba el siguiente texto Natura Green
Modifique las propiedades

La opcin espaciado entre caracteres deber estar en 300.


Agregar una lnea, cambie el tipo de lnea a:

Cree otros logotipos con texto:

UNIR UN TEXTO AL TRAZADO

Dibujar un trazado
Escriba un texto
Seleccione el texto y el trazado
Ir al men texto, elija la opcin Unir al trazado
El resultado ser:

Manual Fireworks by wizardhaarp ~ 17 ~


Dibujo de Trazados con pluma

Elija la herramienta "Pluma".


Haga clic en el lienzo para colocar el primer punto de esquina.
Desplace el cursor y haga clic para colocar el siguiente punto.
Contine trazando puntos. Segmentos rectos unirn el espacio entre ellos.
Realice una de las siguientes acciones para terminar el trazado, ya sea abierto o
cerrado:
Haga doble clic en el ltimo punto para terminar el trazado como trazado abierto.
Para cerrar el trazado haga clic en el primer punto que dibuj. Los puntos inicial y final
de un trazado cerrado coinciden.

Para dibujar un objeto con segmentos curvos:

Elija la herramienta Pluma.


Haga clic para poner el primer punto de esquina.
Sitese en el punto siguiente,
haga clic y arrastre para generar un punto de curva. Cada vez que se hace clic y se
arrastra.

Manual Fireworks by wizardhaarp ~ 18 ~


Fireworks extiende el segmento de lnea hasta el nuevo punto. Contine trazando
puntos.
Si hace clic y arrastra un punto nuevo, se produce un punto de curva; si slo hace clic,
se crea un punto de esquina.
Termine el trazado, ya sea abierto o cerrado.
Para la modificacin libre despus de dibujar, Utiliza la herramienta Sub seleccin y
modifique punto por punto.

Nota: Para crear curvaturas tambin puede utilizar el siguiente mtodo:


Dibuje con la herramienta pluma un trazado recto.

Luego Use la herramienta Sub Seleccin , presione un clic sobre un punto,


Ahora presione la tecla Alt mientras le da un clic y arrastre sobre el punto.
Vera que aparecer las tangentes de su trazado.
Tangentes

Manual Fireworks by wizardhaarp ~ 19 ~


Practica 1
Dibuje la siguiente Forma

Ahora convertir a curvas el siguiente punto.

Pintar de color Rojo sin borde.


Genere una Copia y voltearlo y arme la siguiente forma

Ahora compltelo dibujando las siguientes formas

Manual Fireworks by wizardhaarp ~ 20 ~


Cree las curvaturas, hasta que quede de la siguiente forma.

Arme las figuras.

Manual Fireworks by wizardhaarp ~ 21 ~


Ejercicios Propuestos

Identifique las figuras a crear, luego deforme cada figura, pinte segn vea
conveniente el relleno.

Descripcin de la herramienta pluma

Manual Fireworks by wizardhaarp ~ 22 ~


Herramienta estilo libre
Esta herramienta nos permite cambiar la forma las figuras vectoriales como trazados y
figuras del lienzo.

Lo primero que tenemos que hacer para entender bien la utilidad de esta
herramienta es dibujar en el lienzo una figura vectorial ya sea una figura poligonal
o un trazado vectorial.

Ya con esto lo primero que tenemos que hacer para utilizar esta herramienta es
seleccionar la herramienta de estilo libre del panel de herramientas.

Ahora veamos las propiedades de esta herramienta.

1. Tamao - definimos el tamao de la herramienta.


2. Presin - define la intensidad del trazo.
3. Vista previa nos permite ver exactamente como queda la figura mientras la
modificamos, pero si desactivamos esta opcin se ver la distorsin de este modo
hasta que soltemos el botn del ratn.

Herramienta Remodelar

La herramienta Remodelar rea permite ampliar el rea de todos los trazados.


Para utilizarla hacemos clic sobre el botn de la herramienta de remodelar trazados.

Manual Fireworks by wizardhaarp ~ 23 ~


Aplicacin:
1. Seleccione un objeto editable
2. Use la herramienta remodelar rea, y presione clic sin soltar al costado del rectngulo.
Lista vera que se mueve de forma circular el rea.

ENMASCARAMIENTO DE IMGENES

Como el nombre sugiere, las mscaras ocultan o muestran partes de un objeto o imagen.
Con cualquiera de las tcnicas de enmascaramiento se puede lograr muchos tipos de efectos
creativos en los objetos.

Como objeto de mscara se puede utilizar un objeto vectorial o un objeto de mapa de bits.
El uso de uno vectorial produce una mscara de vectores, mientras que uno de mapa de bits
genera una mscara de mapa de bits. Tambin se puede crear una mscara con varios
objetos u objetos agrupados.

Mscara de vectores aplicada usando el contorno de su trazado

Cuando se crea una mscara de vectores, el panel Capas muestra una miniatura con un icono
de pluma para indicar que se ha creado una mscara de este tipo.

Manual Fireworks by wizardhaarp ~ 24 ~


En el inspector de propiedades vera:

Aplicacin (utilizando el panel capas)


Dibuje un objeto

Ahora cortar el objeto (Ctrl + X)


Importar una imagen
En el panel capas clic en el botn aadir mascara

Una vez pulsada


aparecer la
siguiente figura

Ahora seleccionado la mscara presione (Ctrl + V) para pegar el corte anterior


Quedar as:

Forma de aplicacin (utilizando teclas)

Importe una imagen

Manual Fireworks by wizardhaarp ~ 25 ~


Dibuje una forma sobre la imagen
Seleccione la imagen y presione Ctrl + X,
Ahora seleccione la figura y presione Ctrl + Shift + V.

DESENFOCAR, PERFILAR Y DIFUMINAR IMGENES

La herramienta Desenfocar reduce el enfoque de las reas seleccionadas de una imagen.

La herramienta Perfilar mejora la nitidez de determinadas reas de una imagen.

La herramienta Difuminar mueve el color elegido en la direccin que arrastre la imagen.


Seleccione la herramienta Desenfocar, Perfilar o Difuminar.

Defina las opciones de pincel en el Inspector de propiedades:

Tamao Define el tamao de la punta del pincel.


Borde Especifica la suavidad de la punta del pincel.
Forma Define la forma cuadrada o redonda para la punta del pincel.
Intensidad Define la cantidad de desenfoque o perfilado.
Opciones de difuminado
Presin Define la intensidad del trazo.
Manchar color Permite difuminar con el color especificado al inicio de cada
trazo. Si esta opcin no est seleccionada, la herramienta utiliza el color que se
encuentre debajo del puntero de la herramienta.
Utilizar todo el documento Mancha con los datos de color de los objetos de
todas las capas. Si esta opcin no est seleccionada, la herramienta Difuminar
utiliza nicamente los colores del objeto activo.
Arrastre la herramienta por los pxeles que desee perfilar, desenfocar o difuminar.

Practica 1

Manual Fireworks by wizardhaarp ~ 26 ~


La herramienta Aclarar ilumina partes de una imagen

La herramienta Oscurecer disminuye la luz de partes de una imagen.

Use la herramienta Aclarar u Oscurecer para iluminar u oscurecer los pxeles de una
imagen. El uso de estas herramientas es similar al aumento o disminucin de la
exposicin a la luz cuando se revela una fotografa.

Seleccione la herramienta Aclarar para dar ms luz a partes de una imagen o la


herramienta Oscurecer para restarles luz.

Defina las opciones de pincel y la exposicin en el Inspector de propiedades.

La exposicin puede ajustarse entre 0% y 100%. Los valores altos consiguen efectos ms

fuertes.

Ajuste el intervalo en el Inspector de propiedades:

Sombras Cambia principalmente las partes oscuras de la imagen.


Resaltados Cambia principalmente las partes claras de la imagen.

Manual Fireworks by wizardhaarp ~ 27 ~


Medios tonos Cambia principalmente la gama intermedia por canal de la
imagen.
Arrastre el puntero por la parte de la imagen que desee aclarar u oscurecer.

Nota: para alternar de forma temporal entre la herramienta Aclarar y la herramienta


Oscurecer, mantenga presionada la tecla Alt (Windows).

Practica 2

La herramienta Reemplazar color pinta un color sobre otro.

En la seccin Mapa de bits del panel Herramientas,

Manual Fireworks by wizardhaarp ~ 28 ~


Seleccione la herramienta Reemplazar color. (Si la herramienta no se encuentra
visible, mantenga presionada la herramienta Sello hasta que aparezca un men
emergente).

En el cuadro Desde del Inspector de propiedades, haga clic en Muestra.

Haga clic en la paleta Desde para seleccionar el color, y elija un color del men
emergente para especificar el color que desea reemplazar.

Haga clic en la paleta A del Inspector de


propiedades y seleccione un color del men desplegable.

Defina el resto de atributos del trazo en el Inspector de propiedades:

Tolerancia Determina la gama de colores que se va a reemplazar (0 reemplaza


slo los colores de la paleta Desde; 100 reemplaza todos los colores similares a
la paleta Desde).
Fuerza Determina qu proporcin del color se reemplaza.
Colorear Reemplaza el color de la paleta Desde por el de la paleta A. Anule la
seleccin Colorear para mezclar parte del color de la paleta Desde con el de la
paleta A.

Arrastre la herramienta sobre el color que se va a reemplazar.

Manual Fireworks by wizardhaarp ~ 29 ~


FILTROS AUTOMATICOS

Los filtros automticos de Adobe Fireworks (anteriormente conocidos como efectos


automticos) son mejoras que se pueden aplicar a objetos vectoriales, imgenes de mapas
de bits y texto. Entre los filtros automticos, se incluyen biseles y relieves, sombras slidas,
sombras difuminadas e iluminados, ajustar color, desenfocar y perfilar. Los filtros
automticos se pueden aplicar a los objetos seleccionados directamente desde el Inspector
de propiedades.

Acerca de los filtros automticos


Fireworks actualiza estos filtros cuando se editan los objetos a los que se han aplicado. Despus
de aplicar un filtro automtico, es posible cambiar sus opciones en cualquier momento o
reorganizar el orden de los filtros para experimentar con un filtro combinado. Los filtros
automticos se pueden activar y desactivar, o eliminar en el Inspector de propiedades. Cuando
se elimina un filtro, el objeto o imagen recupera su aspecto anterior.

Men emergente Filtros automticos en el Inspector de propiedades

Algunos filtros (como Niveles automticos, Desenfoque gaussiano o Desperfilar


mscara) que eran filtros irreversibles o de conexin tambin estn ahora
disponibles como filtros automticos de Fireworks.
Es posible aadir filtros de conexin de terceros como filtros automticos o utilizar
estos filtros de forma tradicional mediante el men Filtros.

Manual Fireworks by wizardhaarp ~ 30 ~


Cuando el Inspector de propiedades se encuentre a media altura, haga clic en Editar
filtros o Aadir filtros para visualizar el men emergente Filtros automticos.
Nota: cuando se crea un nuevo relleno, ste adopta el color que aparece en el
cuadro Color de relleno del panel Herramientas.
Al personalizar los filtros automticos, experimente con la configuracin hasta
conseguir la apariencia que desea.

Ventana emergente para Bisel interior


A=Anchura de bisel
B=Preestablecido de
bisel de botn
C=Contraste
D=Suavidad
E=Angulo del bisel

Aplicar filtros automticos

Aplicar un filtro automtico a objetos seleccionados

1) En el Inspector de propiedades, haga clic en el botn ms (+) junto a la etiqueta


Filtros y, a continuacin, seleccione un filtro en el men emergente Agregar filtros
automticos.
2) El filtro se aade a la lista de filtros automticos del objeto seleccionado.

Para aplicar un filtro automtico que parezca que slo afecta


a una seleccin de pxeles dentro de una imagen, corte la
seleccin y pguela en el mismo lugar para crear una nueva
imagen de mapa de bits, seleccinela y aplique el filtro
automtico.

3) Si se abre un men emergente o un cuadro de dilogo, introduzca los valores para


el filtro y realice una de las acciones siguientes:

Si el filtro automtico tiene un


cuadro de dilogo, haga clic
en Aceptar.
Si el filtro automtico tiene un
men emergente, presione
Intro o haga clic en cualquier
punto del espacio de trabajo.

Manual Fireworks by wizardhaarp ~ 31 ~


4) Repita los pasos 1 y 2 para aplicar ms filtros automticos.

Nota: el orden en que se aplican los filtros automticos afecta al


resultado final. Si desea cambiar el orden, arrastre los filtros en
la lista.

ACTIVAR Y DESACTIVAR UN FILTRO AUTOMTICO APLICADO A UN OBJETO

Haga clic en la marca de verificacin situada junto al filtro en la lista de filtros del
Inspector de propiedades.

En el Inspector de propiedades, haga clic en el botn ms (+) junto a la etiqueta


Filtros, a continuacin, en el men emergente, elija Opciones > Todo activado u
Opciones > Todo desactivado.
GUARDAR LOS EFECTOS APLICADOS

Una vez aadido y editado un filtro automtico, haga clic fuera del men emergente de
configuracin o presione Intro.

Aplicar bordes biselados


Un borde biselado otorga al objeto un aspecto de relieve.

Rectngulo con bisel interior y con bisel exterior


1) En el Inspector de propiedades, haga clic en el botn ms (+) junto a la etiqueta
Filtros y, a continuacin, elija una opcin de bisel en el men emergente.
2) Edite la configuracin del filtro en el men emergente.
APLICAR RELIEVES

El filtro Relieve permite que una imagen, un objeto o un texto aparezcan elevados o
hundidos respecto al lienzo.

Manual Fireworks by wizardhaarp ~ 32 ~


Objeto con relieve hundido y con relieve elevado
1) En el Inspector de propiedades, haga clic en el botn ms (+) junto a la etiqueta
Filtros y, a continuacin, elija una opcin de relieve en el men emergente.
2) Edite los parmetros del filtro.
3) Si desea que el objeto original aparezca en el rea en relieve, seleccione Mostrar
objeto.

Nota: por motivos de compatibilidad con versiones anteriores, en


documentos ms antiguos, la opcin Mostrar objeto no est
seleccionada para los objetos que tienen aplicado el filtro
Relieve.

APLICAR SOMBRAS Y EFECTOS DE ILUMINADO

Elija entre una gran variedad de sombras y especifique el ngulo de la sombra para simular
que la luz brilla sobre el objeto.

Filtros Sombra, Sombra interior e Iluminado


Configuracin de filtros para las sombras

Las opciones disponibles varan en funcin del tipo de sombra.


Arrastre el deslizador ngulo para establecer la direccin de la sombra.
Arrastre el deslizador Distancia para establecer la distancia entre el objeto y su
sombra.
Para aplicar un color uniforme a la sombra, seleccione la opcin Color slido.
Para establecer el color de sombra, abra el men emergente del color y realice la
seleccin.
Arrastre el deslizador Opacidad para establecer el porcentaje de transparencia en la
sombra.
Arrastre el deslizador Suavidad para establecer la nitidez de la sombra.
Para ver una vista previa de la sombra, haga clic en la opcin Vista previa.
Para ocultar el objeto y mostrar solamente su sombra, seleccione Slo sombra.

Manual Fireworks by wizardhaarp ~ 33 ~


APLICAR SOMBRAS SLIDAS

1) En el Inspector de propiedades, haga clic en el botn ms (+) junto a la etiqueta


Filtros y, a continuacin, en Sombrear e iluminar y, por ltimo, en Sombra slida.
2) En el cuadro de dilogo Sombra slida, ajuste los parmetros del filtro.
3) Cuando finalice, haga clic en Aceptar.
APLICAR UNA SOMBRA O UNA SOMBRA INTERIOR

1) En el Inspector de propiedades, haga clic en el botn ms (+) junto a la etiqueta


Filtros y, a continuacin, elija una opcin de sombra en el men emergente.
2) Sombrear e iluminar > Sombra.
3) Sombrear e iluminar > Sombra interior.
4) Edite la configuracin del filtro en el men emergente.
APLICAR UN EFECTO DE ILUMINADO

1) Haga clic en el botn Aadir filtros del Inspector de propiedades y elija Sombrear e
iluminar > Iluminado.
2) Edite la configuracin del filtro en el men emergente:
Para establecer el color de iluminacin, haga clic en el cuadro del color.
Arrastre el deslizador Anchura para establecer la anchura del iluminado.
Arrastre el deslizador Opacidad para establecer el porcentaje de transparencia
del iluminado.
Arrastre el deslizador Suavidad para establecer la nitidez del iluminado.
Arrastre el deslizador Desplazamiento para especificar la distancia entre el
objeto y el efecto de iluminado.
APLICAR FILTROS INTEGRADOS Y DE CONEXIN DE PHOTOSHOP COMO FILTROS
AUTOMTICOS

Nota: el men Xtras de las versiones anteriores de Fireworks ha


pasado a llamarse Filtros en Fireworks 8 y versiones posteriores.
Las extensiones Xtra de Fireworks ahora se denominan filtros.

La aplicacin como filtros automticos de filtros incorporados y de conexin en el men


emergente Aadir filtros garantiza que el usuario pueda editarlos o eliminarlos de un objeto.
Use el men Filtros slo para aplicar los filtros y los filtros de conexin de Adobe Photoshop
cuando sepa con certeza que no habr que editar ni eliminar el filtro. Un filtro slo se puede
eliminar si el comando Deshacer est disponible.

Manual Fireworks by wizardhaarp ~ 34 ~


INSTALAR Y APLICAR FILTROS DE CONEXIN DE PHOTOSHOP

1) En el Inspector de propiedades, haga clic en el botn Aadir filtros y, a continuacin,


seleccione Opciones > Localizar filtros de conexin.
2) Abra la carpeta en la que se encuentran los filtros de conexin de Photoshop y haga
clic en Aceptar.
3) Reinicie Fireworks para cargar los filtros de conexin.

Nota: si mueve los filtros de conexin a otra carpeta, debe repetir


los pasos anteriores o seleccionar Edicin > Preferencias y hacer
clic en la ficha Filtros de conexin para cambiar la ruta de
acceso a los filtros de conexin. Despus debe reiniciar
Fireworks.

4) Para aplicar el filtro de conexin de Photoshop a un objeto seleccionado, en el


Inspector de propiedades, haga clic en el botn ms (+) junto a la etiqueta Filtros y,
a continuacin, seleccione un filtro del submen Opciones.

APLICAR EFECTOS DE CAPA DE PHOTOSHOP

Nota: si importa un archivo PSD, tambin puede editar efectos de


capa que ya existen en el archivo.

1) En el Inspector de propiedades, haga clic en el botn Aadir filtros y, a continuacin,


seleccione Efectos automticos de Photoshop.
2) Seleccione uno de los efectos en el panel de la izquierda e introduzca los cambios
en el panel de la derecha. Puede seleccionar varios efectos cada vez.

Aplicar filtros a objetos agrupados


Al aplicar un filtro a un grupo, se aplica a todos los objetos que ste contiene. Si se
desagrupan los objetos, cada objeto recupera los filtros que tuviera
individualmente.
Para aplicar un filtro a un objeto dentro de un grupo, seleccione slo dicho objeto
utilizando la herramienta Subseleccin.
Volver al principio

Edicin y personalizacin de filtros automticos

Modificacin de la configuracin de filtros automticos

Manual Fireworks by wizardhaarp ~ 35 ~


1. En el Inspector de propiedades, haga clic en el botn de
informacin situado junto al filtro que desea editar.
2. Ajuste los parmetros del filtro.
Los filtros no editables aparecen atenuados.
3. Haga clic fuera de la ventana o presione Intro.

Ordenar o eliminar filtros automticos

Ordenar filtros automticos


Es posible cambiar el orden de los filtros aplicados a un objeto. As se vara la
secuencia en que se aplican los filtros, lo cual puede originar cambios en el filtro
combinado. Los filtros del principio de la lista se aplican antes que los situados al
final.
En general, los filtros que modifican el interior de un objeto, como el filtro Bisel
interior, deben aplicarse antes que los que modifican el exterior. Por ejemplo, el
efecto Bisel interior debera aplicarse antes que los filtros Bisel exterior, Iluminado
o Sombra.
Para ordenar los filtros, arrastre un filtro a una posicin diferente de la lista en el
Inspector de propiedades.

Eliminar un filtro aplicado a un objeto seleccionado


En el Inspector de propiedades, seleccione el filtro que desee eliminar de la lista
de filtros y haga clic en el botn Eliminar filtros automticos.

Eliminar todos los filtros aplicados a un objeto seleccionado


En el Inspector de propiedades, haga clic en el botn ms (+) junto a la etiqueta
Filtros y, a continuacin, en el men emergente, elija Ninguno.

Crear filtros automticos personalizados


Los filtros automticos personalizados son en realidad estilos para los que slo se
ha seleccionado la opcin de propiedad Filtro. Para guardar una combinacin
especfica de parmetros de los filtros automticos, cree uno personalizado.

Crear un filtro automtico personalizado mediante el panel Estilos


1. Aplique los ajustes de filtros automticos a los objetos
seleccionados. Para obtener ms informacin,
consulte Aplicacin de filtros automticos.
2. Seleccione Nuevo estilo en el men de opciones del
panel Estilos.
3. Anule la seleccin de todas las propiedades excepto
Efecto, introduzca un nombre y haga clic en Aceptar.
Se aade un icono de estilo que representa el filtro
automtico al panel Estilos.
Nota: si elige alguna otra propiedad en el cuadro de dilogo Nuevo estilo,
el estilo no se aadir al men emergente Agregar filtros automticos del
Inspector de propiedades aunque s aparecer en el panel Estilos como un
estilo ms.

Manual Fireworks by wizardhaarp ~ 36 ~


Aplicar un filtro automtico personalizado a objetos seleccionados
En el panel Estilos, haga clic en el icono del filtro automtico personalizado.
Un filtro automtico personalizado se puede cambiar de nombre o eliminar de la
misma forma que cualquier otro estilo del panel Estilos. No es posible cambiar el
nombre de un filtro estndar de Fireworks ni eliminarlo.

Guardar filtros automticos como comandos


Guarde y reutilice un filtro creando un comando basado en l. El comando puede
utilizarse en el proceso por lotes.
1. Aplique los filtros al objeto.
2. Si el panel Historial no est visible, seleccione Ventana
> Historial.
3. Mantenga presionada la tecla Mays y haga clic en el
grupo de acciones que desea guardar como comando.
4. Siga uno de estos procedimientos:
Seleccione Guardar como
comando en el men de
opciones del panel Historial.
Haga clic en el botn Guardar
de la parte inferior del panel
Historial.
5. Introduzca un nombre para el comando y haga clic en
Aceptar para aadir el comando al men Comandos.
c

ESTILOS

Utilizacin de estilos
Para guardar y volver a aplicar un conjunto de rellenos, trazos, efectos y atributos de texto
Predefinidos, cree un estilo. Al aplicar un estilo, el objeto adopta todas sus caractersticas.
Fireworks Incluye muchos estilos predefinidos. Estos estilos se pueden cambiar y eliminar,
y es posible
Aadirles nuevas caractersticas. El CD-ROM de Fireworks y el sitio Web de Macromedia
incluyen muchos otros estilos predefinidos que se pueden importar a Fireworks. Tambin
es posible exportar estilos y compartirlos con otros usuarios de Fireworks, o importarlos de
otros documentos de
Fireworks.

Manual Fireworks by wizardhaarp ~ 37 ~


Practicas

Manual Fireworks by wizardhaarp ~ 38 ~


SMBOLOS

Los smbolos se pueden crear a partir de cualquier objeto, bloque de texto o grupo y despus
se pueden guardar en la ficha Biblioteca comn del panel Activos. Desde aqu, puede editar
el smbolo y colocarlo en sus documentos.

Crear un smbolo a partir de un objeto seleccionado

Seleccione el objeto y elija Modificar > Smbolo > Convertir en smbolo.


Introduzca un nombre para el smbolo en el cuadro Nombre.

Seleccione un tipo de smbolo.

Manual Fireworks by wizardhaarp ~ 39 ~


Para escalar el smbolo sin distorsionar su geometra, seleccione Activar guas de
escala en 9 divisiones. Consulte Escala de 9 divisiones.
Para guardar el smbolo para que pueda utilizarse en varios documentos, seleccione
la opcin Guardar en Biblioteca comn.
Haga clic en Aceptar para guardar el smbolo.
El objeto seleccionado se convierte en una instancia del smbolo, y el Inspector de
propiedades muestra las opciones de smbolo.

Prctica (Botones)
Dibujar los siguientes botones

Cambie de colores y modifique sus propiedades


Seleccione el primer botn ir al men Modificar > Smbolo > Convertir en smbolo
Escriba el nombre de smbolo btninicio, elija la opcin botn, y guardar en biblioteca
comn.

Presione el botn Aceptar.

Configuracin de Estados

Qu son los estados?

Manual Fireworks by wizardhaarp ~ 40 ~


Estados se denominaba fotogramas, En las animaciones, las capas sirven para organizar
los objetos que forman parte del decorado o del fondo de la animacin.

Representa el aspecto del botn en respuesta a un evento del ratn:

Estados de botn

Un botn puede tener hasta cuatro estados diferentes. Cada estado representa el
aspecto del botn en respuesta a un evento del ratn:

El estado Arriba es el estado predeterminado o aspecto "de reposo" del botn.

El estado Sobre es el nuevo aspecto con el que aparecer el botn al mover el


puntero sobre el mismo. Este estado avisa al usuario de que al hacer clic es probable
que se produzca una accin.

El estado Abajo es a menudo una imagen del botn con el aspecto de estar
"presionado", representa el botn despus de hacer clic sobre el mismo. Este estado
de botn representa normalmente la pgina Web actual en la barra de navegacin
con varios botones.

El estado Sobre y Abajo es el aspecto del botn al pasar el cursor sobre l cuando
est en el estado Abajo. Este estado de botn representa normalmente que el
puntero se encuentra en el botn correspondiente a la pgina Web actual en las
barras de navegacin con varios botones.

Uso del Editor de botones

Manual Fireworks by wizardhaarp ~ 41 ~


Practica (Animacin)
Seleccione Edicin > Insertar > Nuevo smbolo.
En el cuadro de dilogo Convertir en smbolo, escriba un nombre para el smbolo
nuevo.
Seleccione Animacin y haga clic en Aceptar.
En el panel de documentos, utilice las herramientas de texto o de dibujo para crear
un objeto nuevo. Se pueden dibujar objetos vectoriales o de mapas de bits.

Cambiar el movimiento o direccin de un smbolo


Un smbolo de animacin seleccionado tiene un cuadro delimitador nico y un
trazado de movimiento que indica la direccin en que se mueve el smbolo.

El punto verde del trazado de movimiento indica el punto de partida y el rojo el final.
Los puntos azules representan los estados. Por ejemplo, un smbolo con cinco
estados cuenta con un punto verde, tres azules y uno rojo en su trazado. Si el objeto
aparece en el tercer punto, el estado actual es el 3.

Para cambiar la direccin de movimiento se puede modificar el ngulo del trazado.

Manual Fireworks by wizardhaarp ~ 42 ~


Arrastre uno de los tiradores de inicio o de final de animacin del objeto a una
posicin nueva. Para restringir la direccin de movimiento a incrementos de 45,
mantenga pulsada la tecla Mays mientras arrastra.

Creacin de animaciones de retorcer y fundir

El comando Retorcer y fundir se puede utilizar para crear varias instancias de un


objeto que aparezcan o desaparezcan paulatinamente en un trazado retorcido.

Una vez creado el primer objeto, las instancias posteriores se crean


automticamente en funcin de las opciones establecidas en el cuadro de dilogo
Retorcer y fundir. Tambin se pueden animar los objetos creados utilizando la
opcin del cuadro de dilogo y guardar la animacin como archivo GIF.

Practica (Retorcer y fundir)


Cree o coloque un objeto en el lienzo. Por ejemplo, dibuje un crculo o coloque una
imagen en el lienzo.

Seleccione Comandos > Creativo > Retorcer y fundir.

En el cuadro de dilogo Retorcer y fundir, configure los parmetros segn sus


preferencias. Manipule las distintas opciones del cuadro de dilogo para
personalizar el efecto. Site el cuadro de dilogo de modo que se puedan pre
visualizar los cambios conforme se realizan.

Manual Fireworks by wizardhaarp ~ 43 ~


Pasos El nmero de instancias del objeto que se crea.
Opacidad La opacidad de los objetos que se crean.
Direccin La direccin en la que se crean los sucesivos objetos respecto del
primer objeto.
Paso atrs Cada objeto se mueve detrs del siguiente objeto del conjunto.
Animar Seleccione esta opcin si desea animar el conjunto de objetos creado.
Desenfocar A medida que aumente el valor de este campo, el efecto de
desenfoque se aplica comenzando desde el ltimo objeto creado hasta el primer
objeto.
Alteracin de tono Cambie el valor para modificar los colores de los objetos
creados.
Espaciado Al aumentar el valor, se incrementa el espacio entre los objetos
creados.
Rotacin Medida en la que rotan los objetos sucesivos.
Direccin ngulo en el que los objetos siguientes se alinean a s mismos en el
primer objeto.
Escala Escalabilidad de los objetos siguientes respecto del primer objeto.
Opacidad Transparencia de los objetos siguientes respecto del primer objeto.
Aleatorio Haga clic en Aleatorio si desea experimentar con un conjunto de
valores aleatorios seleccionados por el sistema.

Manual Fireworks by wizardhaarp ~ 44 ~


Vibracin Aade variaciones a la opcin seleccionada. El valor establecido
determina la cantidad de variacin.
Preestablecidos Seleccione el valor preestablecido que mejor se ajuste a sus
necesidades. Es una buena idea comenzar por un valor preestablecido y
configurar las distintas opciones segn sus requisitos. Tambin se puede
seleccionar Predeterminado para utilizar el conjunto predeterminado de
preferencias, o bien, seleccionar ltimo uso para emplear las preferencias
anteriores.
Pre visualizar Seleccione la vista previa si desea ver los cambios en el objeto
conforme establece las opciones en el cuadro de dilogo.
Nota: Si ha seleccionado la opcin Animar, el grfico desaparece del espacio de
trabajo tras hacer clic en el botn Aceptar. En el cuadro de dilogo Propiedades,
seleccione GIF Animado Web Snap 128 en el men de opciones de formato.

Presione F12 para pre visualizar la animacin en un navegador.

Nota: Los objetos creados no se pueden desagrupar del mismo modo en que se desagrupan
los objetos.

CREAR ZONAS INTERACTIVAS

Las zonas interactivas resultan convenientes cuando desea vincular reas de una imagen
con otras pginas Web, pero no necesita resaltar estas reas ni producir efectos de rollo ver
en respuesta a los movimientos o acciones del ratn.

Las zonas interactivas y los mapas de imagen tambin son ideales cuando el grfico en el
que ha insertado las zonas interactivas se exporta mejor como un nico archivo de imagen,
es decir, utilizando un mismo formato de archivo y la misma configuracin de optimizacin.

Las zonas interactivas pueden ser rectngulos, crculos o polgonos. Los polgonos son tiles
cuando se trabaja con imgenes intrincadas.

Es posible seleccionar un objeto e insertar en l la zona interactiva.

Manual Fireworks by wizardhaarp ~ 45 ~


Crear una zona interactiva rectangular o circular
Seleccione la herramienta Zona interactiva rectangular o Zona interactiva circular
en la seccin Web del panel Herramientas.

Arrastre la herramienta Zona interactiva para dibujar una zona interactiva sobre un
rea del grfico. Mantenga presionada la tecla Alt (Windows) u Opcin (Mac OS)
para dibujar a partir de un punto central.

Crear una zona interactiva con forma irregular

Elija la herramienta Zona interactiva poligonal.


Haga clic en la herramienta para trazar los puntos de vector, igual que si estuviese
dibujando segmentos de lnea recta con la herramienta Pluma. El relleno permite
definir el rea de la zona interactiva, sin importar si el trazado est abierto o cerrado.

Practica (Mapa de rastreo)

Busque un mapa de ubicacin y cpielo al nuevo lienzo.

Manual Fireworks by wizardhaarp ~ 46 ~


Con la herramienta Zona interactiva poligonal dibuje con clics, luego en el inspector de
propiedades seleccione vinculo, escriba a que pgina desea ir.
Presione F12 para visualizar el vinculo

CREAR MENS

Crear un men emergente sencillo


Seleccione una zona interactiva o divisin que corresponda al rea de activacin del men
emergente.

Siga uno de estos procedimientos:

Seleccione Modificar > Men emergente > Aadir men emergente.

Haga clic en el tirador de comportamiento de la divisin y elija Aadir men


emergente.

Haga clic en la ficha Contenido y, a continuacin, haga clic en Aadir men.

Haga doble clic en cada celda y especifique o seleccione la informacin adecuada de


texto, vnculo y destino. En los campos Vnculo y Destino, especifique informacin
personalizada o seleccione desde los mens mostrados. Al aadir texto en la ltima
lnea de la ventana se agrega una lnea vaca debajo de la misma.

Presione la tecla Tabulador para desplazarse entre celdas y las teclas de flecha
arriba y abajo para moverse por la lista de forma vertical.

Manual Fireworks by wizardhaarp ~ 47 ~


Repita los pasos 3 y 4 hasta aadir todos los elementos de men. Para eliminar un
elemento del men, haga clic en el botn Suprimir men.

Haga clic en Siguiente o Listo, o bien seleccione otra ficha.

En el rea de trabajo, la zona interactiva o divisin utilizada para crear el men


emergente muestra una lnea azul de comportamiento unida a un contorno del nivel
superior del men emergente.

Practica 1

Dibujar un botn

Seleccione el botn
Seleccione Modificar > Men emergente > Aadir men emergente.
Clic en Zona Interactiva

Rellene los siguientes datos

Manual Fireworks by wizardhaarp ~ 48 ~


Clic en siguiente

Clic en siguiente

Manual Fireworks by wizardhaarp ~ 49 ~


Clic en siguiente

El ejemplo se mostrara de la siguiente forma


Presione F12 para su visualizacin.

Manual Fireworks by wizardhaarp ~ 50 ~


Al poner el mouse sobre el boton aparecer el men emergente.

Practica 2

EJERCICIOS PROPUESTOS

Ejercicio 1

Creacin de botones

Manual Fireworks by wizardhaarp ~ 51 ~


Dibujar las siguientes figuras.

Redondear algunas de las figuras


Redondear en el panel propiedades, a 150%

Recortar las siguiente figuras


Dibujar un rectngulo que tape el circulo1
Vea las imgenes

Manual Fireworks by wizardhaarp ~ 52 ~


Ahora solo pinte usando el panel estilos de capa

Manual Fireworks by wizardhaarp ~ 53 ~


Manual Fireworks by wizardhaarp ~ 54 ~
Manual Fireworks by wizardhaarp ~ 55 ~

You might also like