Documentos de Académico
Documentos de Profesional
Documentos de Cultura
Curso Fire
Curso Fire
Web de prcticas
Web de prcticas
Vamos a disear una web formada por una pgina principal y tres dependientes
de ella.
Animacin
Fondo
Barra de navegacin
Pgina 1
Curso de Fireworks
Web de prcticas
En el panel de herramientas Cmun > tablas: se abre ventana; elegir 1 fila, 1 columna, ancho 800
pxeles, Alto 400, borde 0 > Aceptar.
Pgina 2
Curso de Fireworks
Web de prcticas
Dentro de la tabla inferior creamos otra tabla de 3 columnas y 1 fila. Ancho 800, Alto 300, borde
0, Alinear > Centrado..
La columna de la izquierda le damos un ancho de 140 pxeles. Alineacin: Horz- izquierda; vertsuperior. Columna de la derecha le damos un ancho de 115 pxeles.
Pgina 3
Curso de Fireworks
Entorno de trabajo
Paneles
flotantes
Panel de
herramientas
Lienzo
Inspector de
propiedades
Pgina 4
Curso de Fireworks
Entorno de trabajo
En la derecha de la pantalla hay varios paneles, como Capas y Optimizar. stos y otros
paneles pueden abrirse desde el men Ventana. Son los paneles flotantes.
Desplace el puntero por los distintos elementos de la interfaz. Si mantiene el puntero el
tiempo suficiente sobre un elemento, aparece la ayuda emergente. Los mensajes de la
ayuda emergente identifican herramientas, mens, botones y otros rasgos de la interfaz en
todo el programa. Desaparecen al retirar el puntero de los elementos en cuestin.
a) Panel Herramientas
El panel Herramientas est organizado en seis categoras: Seleccionar, Mapa de
bits, Vector, Web, Colores y Ver.
Curso de Fireworks
Entorno de trabajo
Curso de Fireworks
Entorno de trabajo
varias
acciones
despus
de animacin. Es
fcil arrastrar
Curso de Fireworks
Entorno de trabajo
1. Haga clic en el icono del men de opciones del ngulo superior derecho del panel o grupo de paneles para
abrir el men.
2. Haga clic en la opcin que desee del men.
Haga clic con el botn derecho del ratn sobre el elemento seleccionado en la ventana
de documento.
Pgina 8
Curso de Fireworks
Documento nuevo
1. Elija Archivo > Nuevo.
Se abre el cuadro de dilogo Nuevo documento
2. Introduzca los valores de ancho y de alto del lienzo en pxeles, centmetros o pulgadas.
3. Seleccione el color del lienzo , y despus haga clic en Aceptar.
Para crear un documento nuevo con el mismo tamao que un objeto del Portapapeles:
Pgina 9
Curso de Fireworks
Seleccin de objetos
Para manipular los objetos del lienzo, primero es preciso seleccionarlos. Esta
regla es vlida para objetos vectoriales, trazados, puntos, bloques de texto, palabras,
letras, divisiones o zonas interactivas, instancias y objetos de mapa de bits.
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 Subseleccin 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.
La herramienta Exportar rea selecciona un rea para exportarla en un archivo aparte.
MAPA DE BITS
Los mapas de bits son imgenes compuestas de pequeos cuadrados de color
denominados pxeles que crean una imagen. Algunos ejemplos de mapas de bits son
fotografas, imgenes tomadas con un escner y elementos grficos creados con
programas de pintura.
Pgina 10
Curso de Fireworks
Mantenga pulsada la tecla Mays mientras arrastra la herramienta Recuadro o Recuadro oval para trazar un recuadro
cuadrado o circular. Para dibujar un recuadro desde su punto central, anule la seleccin de los dems recuadros activos
y despus mantenga pulsada la tecla Alt.
Pgina 11
Curso de Fireworks
Mantenga pulsada la tecla Mays para restringir los segmentos de la herramienta Lazo poligonal a incrementos de 45
grados.
Curso de Fireworks
Haga clic fuera de la seleccin actual con una herramienta Recuadro o Lazo.
Pulse la tecla Esc.
Elija Seleccionar > Anular seleccin.
1.
2.
3.
4.
5.
6.
Curso de Fireworks
Pgina 14
Curso de Fireworks
puede utilizarse para dibujar lneas rectas de un pxel, de estilo libre o fijo,
del mismo modo que se utilizara un lpiz real para dibujar lneas.
3. Para dibujar, arrastre el ratn. Para restringir el trazado a una lnea vertical, horizontal o
diagonal, mantenga pulsada la tecla Mays mientras arrastra el ratn.
Elija Avanzada y podremos fijar todas las propiedades y guardarlo como un trazo propio, o
aplicarlo a un trazo ya dibujado.
Pgina 15
Curso de Fireworks
1. Realice la seleccin.
2. Elija la herramienta Degradado.
3. Defina los atributos de relleno en el Inspector de propiedades.
4. Haga clic en la seleccin de pxeles para aplicar el relleno.
Pgina 16
Curso de Fireworks
Aplicacin 1:
Edicin de un logotipo.
. Proceso:
a) Hacer un rea rectangular y girar para cortar la esquina.
b) Con borrador cuadrado y tecla mayscula pulsada elimina las zonas
rectas.
c) Con borrador circular elimina el resto.
6. Crear un rea con Herramienta Recuadro oval encima de la anterior. Pulsar botn
derecho > Edicin > Cortar. Repetir proceso para crear rea circular.
Pgina 17
Curso de Fireworks
Pgina 18
Curso de Fireworks
Pgina 19
Curso de Fireworks
Pgina 20
Curso de Fireworks
2. Hacer clic en la miniatura del coche en escala de grises que aparece en el panel Capas.
3. Con la imagen del coche seleccionada, haz clic en el icono del men emergente de
opciones situado en el ngulo superior derecho del panel Capas.
Pgina 21
Curso de Fireworks
A la imagen seleccionada se le aade una mscara transparente vaca. Puede comprobar que
la mscara se ha aadido porque su miniatura se incorpora al panel Capas. El resaltado
amarillo alrededor de la miniatura de la mscara indica que est seleccionada.
Edicin de la mscara
Ahora se va a dar a la imagen de mapa de bits un aspecto transparente al aadir un
relleno degradado a la mscara.
Pgina 22
Curso de Fireworks
Pgina 23
Curso de Fireworks
Site el cursor en el que ser el punto central y mantenga pulsada la tecla Alt mientras arrastra
la herramienta de dibujo.
Para cambiar el tamao de una lnea, un rectngulo o una elipse seleccionadas, realice una de estas acciones:
Introduzca nuevos valores de anchura (An.) o altura (Al.) en el Inspector de propiedades o en el panel
Informacin.
Elija la herramienta Escala en la seccin Seleccionar del panel Herramientas y arrastre un tirador de
transformacin de una esquina. As el tamao del objeto cambia proporcionalmente.
En un rectngulo, arrastre un punto de una esquina.
Introduzca un valor entre 0 y 100 en el cuadro Redondez del rectngulo del Inspector de
propiedades y pulse Intro, o bien arrastre el deslizador emergente.
Pgina 24
Curso de Fireworks
Dibujo de polgonos
Con la herramienta Polgono se puede dibujar cualquier polgono equiltero, desde un
tringulo hasta un polgono de 360 lados.
Dibujo de estrellas
Con la opcin Estrella de la herramienta Polgono, se pueden dibujar estrellas con entre
3 y 360 puntas y toda la gama de ngulos de punta.
Para dibujar una estrella:
Pgina 25
Curso de Fireworks
Mostrar vista previa de la pluma muestra una presentacin preliminar del segmento de lnea que
se obtendra con el clic siguiente.
Mostrar puntos slidos muestra puntos slidos mientras se dibuja.
Haga doble clic en el ltimo punto para terminar el trazado como trazado abierto.
Elija otra herramienta para terminarlo como trazado abierto.
Nota: Cuando se elige cualquier herramienta de seleccin o de vector que no
sea la de Texto y, a continuacin, se vuelve a la herramienta Pluma, el
siguiente clic contina dibujando el objeto.
Para cerrar el trazado haga clic en el primer punto que dibuj. Los puntos inicial y final de un
trazado cerrado coinciden.
Pgina 26
Curso de Fireworks
4. 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.
Sugerencia: Es posible cambiar temporalmente a la herramienta Subseleccin para modificar la posicin
de los puntos y la forma de las curvas mientras se dibuja. Para ello, pulse la tecla Control mientras
arrastra un punto o un tirador de punto con la herramienta Pluma.
5. Realice una de las siguientes acciones para terminar el trazado, ya sea abierto o cerrado:
o Haga doble clic en el ltimo punto para terminar el trazado como trazado abierto.
o Elija otra herramienta para terminarlo como trazado abierto. Cuando se eligen
determinadas herramientas y, a continuacin, se vuelve a la herramienta Pluma, el
siguiente clic contina dibujando el objeto.
o Para cerrar un trazado, haga clic en el primer punto que traz. Los puntos inicial y
final de un trazado cerrado coinciden.
3. Arrastre el punto o utilice las teclas de flecha para moverlo a una nueva posicin.
Pgina 27
Curso de Fireworks
Por ejemplo, si arrastra el tirador de punto de la izquierda hacia abajo, el de la derecha subir.
Mantenga pulsada la tecla Alt mientras arrastra un tirador para moverlo de forma independiente.
Pgina 28
Curso de Fireworks
La herramienta Estilo libre empuja un segmento del trazado; el nuevo trazado refleja la deformacin
Indica que
La herramienta Estilo libre est utilizndose.
La herramienta Estilo libre est utilizndose y el puntero de ampliacin est preparado para tirar
del trazado seleccionado.
La herramienta Estilo libre est utilizndose y el puntero est tirando del trazado seleccionado.
La herramienta Estilo libre est utilizndose y el puntero de reduccin est activo.
La herramienta Remodelar rea est en uso y el puntero est activo. El rea comprendida entre el
crculo interno y el crculo externo representa la intensidad reducida.
Cuando el puntero est dentro, el trazado se puede ampliar. Cuando no est dentro, se
puede reducir. El tamao del puntero de reduccin o ampliacin puede cambiarse.
Para ampliar un trazado seleccionado:
3. Arrastre el trazado.
Para reducir un trazado seleccionado:
Mientras mantiene pulsado el botn del ratn, pulse 2 o la tecla de flecha derecha para
aumentar la anchura del cursor.
Mientras mantiene pulsado el botn del ratn, pulse 1 o la tecla de flecha izquierda para
reducir la anchura del cursor.
Para establecer el tamao del cursor y la longitud del segmento afectado, anule la
seleccin de todos los objetos en el documento e introduzca un valor de 1 a 500 en el
Pgina 29
Curso de Fireworks
cuadro de texto Tamao del Inspector de propiedades. Este valor indica el tamao en
pxeles del cursor.
Elija Modificar > Combinar trazados > Unin. El trazado resultante toma los atributos de trazo y relleno
del objeto situado ms atrs.
Pgina 30
Curso de Fireworks
Para crear un trazado cerrado que abarque el rea comn a todos los trazados cerrados seleccionados:
Elija Modificar > Combinar trazados > Intersectar. El trazado resultante toma los
atributos de trazo y relleno del objeto situado ms atrs.
Recorte de un trazado
Es posible recortar un trazado utilizando la forma de otro. El trazado situado ms
adelante define la forma del rea recortada.
Curso de Fireworks
1. Haga clic en el botn Aadir efectos del Inspector de propiedades y elija una opcin de
bisel en el men emergente:
o
o
Pgina 32
Curso de Fireworks
Aplicacin de relieve
El efecto Relieve permite que una imagen, un objeto o un texto aparezcan elevados o
hundidos respecto al lienzo.
1. Haga clic en el botn Aadir efectos del Inspector de propiedades y elija una opcin de
relieve en el men emergente:
o
o
1. Haga clic en el botn Aadir efectos del Inspector de propiedades y elija una opcin de
sombra en el men emergente:
o
o
Arrastre el control deslizante Distancia para definir la distancia de la sombra respecto al objeto.
Haga clic en el cuadro de color para abrir la ventana emergente y defina el color de la sombra.
Arrastre el deslizador Opacidad para definir el porcentaje de transparencia de la sombra.
Arrastre el deslizador Suavidad para establecer la nitidez de la sombra.
Arrastre el deslizador ngulo para definir la direccin de la sombra.
Seleccione Slo sombra para ocultar el objeto y mostrar slo la sombra.
1. Haga clic en el botn Aadir efectos del Inspector de propiedades y elija Sombrear e
iluminar > Iluminado.
2. Edite la configuracin del efecto en la ventana emergente:
o
o
o
Haga clic en el cuadro de color para abrir la ventana emergente y defina el color del resplandor.
Arrastre el deslizador Anchura para definir la anchura del resplandor.
Arrastre el deslizador Opacidad para definir el porcentaje de transparencia del resplandor.
Pgina 33
Curso de Fireworks
o
o
Introduccin de texto
Con la herramienta Texto
Texto unido a un trazado que pasa a otra lnea y repite la forma del trazado
Para colocar texto en un trazado:
Pgina 34
Curso de Fireworks
Haga doble clic en el objeto de texto unido a un trazado con la herramienta Puntero o Subseleccin.
Elija la herramienta Texto y seleccione el texto que desea editar.
Pgina 35
Curso de Fireworks
3. Dibujar un cuadrado (212 x 212) y girar 90. Con la Herramienta Rectngulo y pulsando
tecla Mayus, arrastra el ratn. Ajustar el ancho y alto en inspector de propiedades, si es
necesario.
Herramienta Escalar
, girar el cuadrado.
4. Dibujar el circulo (50 x 50). Con la herramienta Elipse y manteniendo pulsadas las teclas
Mayus-Alt, y desde el centro del lado arrastra el ratn. Dibujar el cuadrado (42 x 42) en el
otro lado.
5. Con el puntero
selecciona el cuadrado y pulsando Mayus selecciona el circulo. En
men Modificar Combinar trazados Perforar. Hacer lo mismo para los dos cuadrados.
Pgina 36
Curso de Fireworks
7. Dibujar elipse (An 184 ,Al 90 ; X 59,Y 151) . Con la herramienta Elipse y las teclas
Mayus-Alt desde el centro arrastra el ratn. Ajustar valores en el Inspector. Seleccionar
trazados y perforar.
Pgina 37
Curso de Fireworks
b) Banner.
1 Abrir nuevo documento tamao 760x 80 pxeles.
2. Dibuja el rectngulo en lado izquierdo. Con la herramienta rectngulo arrastra ratn. Ajusta
el tamao en el Inspector: An 276 X 0 ; Al 80 Y 0. Color B9FA92 . Sin lnea exterior.
6. Inserta el texto. Letra: Swiss721 Tamao: 21 Color: 006600 negrita. Separacin caracteres
88. Efecto sombra.Importar imagen de la caja de herramientas y colocar.
7. Dibujar los cuadrados pequeos (17x17). Seleccionar el cuadrado, botn derecho del ratn
Edicin Clonar. Desplazar el nuevo cuadrado pulsando las teclas flecha derecha. Repetir
tantas veces como cuadrados tenemos. A cada cuadrado asignar un tonalidad del verde.
9. Introduce los textos. Letra grande: Tipo = Swiss721 Tamao =56 Color borde= 66FF66,
Suavizado ntido, Efecto = sombra.
Letra mediana: igual pero tamao 21 y sin efecto sombra. Letra pequea: tamao 12.
Pgina 38
Curso de Fireworks
4. Dibujar el crculo ( 44x44). Con la Herramienta Elipse y manteniendo pulsada la tecla Alt ,
traza el circulo. Haz clic fuera del trazado. Con herramienta puntero selecciona y mueve a su
sitio.
6.Dibujar el cuadrado dentro del circulo. Con la Herramienta Rectngulo y pulsando tecla
Mays arrastra el ratn. Aplicar las propiedades.
An 12
Color relleno: 006600 slido
Color borde: ningno
Al 12
Borde suavizado
Efecto> Eye Candy 4000 LE >Bevel Boss
Efecto> Sombra
Pgina 39
Curso de Fireworks
Barras de navegacin
Las instancias de botn estn encapsuladas. Si arrastra una instancia de botn en el documento, se
desplazan todos los componentes y estados asociados, de modo que ya no es necesaria la complicada
edicin de varios fotogramas.
Un botn puede editarse de forma sencilla. Haga doble clic en la instancia del lienzo y podr modificarlo
en el Editor de botones o el Inspector de propiedades.
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 barras de navegacin con
varios botones.
El estado Sobre y Abajo es el aspecto del botn al pasar el cursor sobre l cuando est
Pgina 40
Curso de Fireworks
Barras de navegacin
Sobre la imagen del botn aparece un crculo en el centro y a la izquierda un icono de flecha. Indica que la seleccin en el espacio
de trabajo es una instancia del smbolo recin creado. Los smbolos son como copias maestras de las imgenes. Cuando se
cambia un smbolo, todas las instancias de ese smbolo en el documento cambian automticamente. Los smbolos residen en la
biblioteca.
Pgina 41
Curso de Fireworks
Barras de navegacin
3. Haga clic en la ficha Sobre de la parte superior del editor de botones y despus en el
botn Copiar grfico Arriba.
La imagen del botn se ha copiado desde la ficha Arriba. El estado Sobre de un botn es su aspecto cuando el puntero
pasa sobre l. Para que el usuario reciba informacin visual, se va a cambiar el color del rectngulo sobre el que aparece
el texto.
6. Haga clic en la ficha Abajo del editor de botones y despus en el botn Copiar grfico
Sobre.
La imagen del botn se copia de la ficha Sobre. El estado Abajo de un botn es su aspecto cuando el usuario hace clic
sobre l. Vamos a cambiar el color del rectngulo.
Estado abajo del botn
7. Haga clic en la ficha Sobre-Abajo del editor de botones y despus en el botn Copiar
grfico Sobre.
La imagen del botn se copia de la ficha Abajo. El estado Sobre-Abajo de un botn es el aspecto del botn al pasar el cursor sobre l cuando
est en el estado Abajo. En este caso no cambiamos el color del rectngulo
8. Haga clic en Listo en el editor de botones para aplicar los cambios al smbolo de botn.
9. Haga clic en la ficha Vista previa de la ventana de documento y compruebe los estados
del botn.
Las modificaciones del aspecto grfico como el color y tipo de trazo, el color y tipo de
relleno, forma del trazado y las imgenes
Efectos automticos, opacidad o el modo de mezcla aplicado a objetos independientes
dentro del smbolo de botn
Tamao y posicin del rea activa
Comportamiento principal de un botn
Pgina 42
Curso de Fireworks
Barras de navegacin
1. Siga uno de los procedimientos siguientes para abrir el botn en el Editor de botones:
o Haga doble clic en una instancia del botn en el espacio de trabajo.
o En el panel Biblioteca, haga doble clic en la vista previa del botn o en el icono
de smbolo que se encuentra junto al smbolo de botn.
2. Modifique las caractersticas grficas del botn y haga clic en Listo.
Los cambios se aplican a todas las instancias del smbolo de botn.
Un nombre de objeto de instancia, que aparece en el panel Capas y que se utiliza para
asignar nombres a las divisiones de la instancia de botn durante la exportacin
Efectos automticos, opacidad o el modo de mezcla aplicado a toda la instancia
Los caracteres de texto y su formato, como fuente, tamao, orientacin y color
Vnculo URL (tambin disponible como una propiedad a nivel de smbolo)
Texto alternativo (alt) con la descripcin de imagen
Marco destino (tambin disponible como una propiedad a nivel de smbolo)
Comportamientos adicionales asignados a una instancia mediante el panel
Comportamientos
La opcin Mostrar imagen Abajo despus de cargar del Inspector de propiedades para las
instancias de una barra de navegacin.
Para editar las propiedades de instancia de una nica instancia de smbolo de botn:
Pgina 43
Curso de Fireworks
Barras de navegacin
ficha rea activa del Editor de botones. Cada botn slo puede tener una divisin. Si dibuja una divisin
mediante una herramienta de divisin en el rea activa, la divisin anterior se sustituye por la nueva
divisin. Puede dibujar objetos de zona interactiva en la ficha rea activa, pero slo puede editar dichas
zonas interactivas en el Editor de botones.
Para editar una divisin o zona interactiva en el rea activa del smbolo de botn:
1. Siga uno de los procedimientos siguientes para abrir un smbolo de botn en el editor de
botones:
o Haga doble clic en una instancia del botn en el espacio de trabajo.
o En el panel Biblioteca, haga doble clic en la vista previa del botn o en el icono
de smbolo que se encuentra junto al smbolo de botn.
2. Haga clic en la ficha rea activa.
3. Siga uno de estos procedimientos:
o Utilice la herramienta Puntero para mover o modificar la forma de divisin y
desplazar una gua de divisin.
o Utilice cualquiera de las herramientas de divisin
o de zona interactiva para
dibujar la nueva rea activa.
1. Siga uno de los procedimientos siguientes para abrir el botn en el Editor de botones:
o
o
Pgina 44
Curso de Fireworks
Barras de navegacin
Para configurar el valor URL de una instancia de botn seleccionada en el espacio de trabajo, siga uno de los
procedimientos siguientes:
1. Siga uno de los procedimientos siguientes para abrir el botn en el Editor de botones:
o
o
vnculo.
_blank carga la pgina web en una ventana de navegador nueva sin
nombre.
_parent carga la pgina web en el conjunto de marcos relacionados o en la
Pgina 45
Curso de Fireworks
Barras de navegacin
se muestren imgenes. El texto Alt puede ser una propiedad de smbolo o de instancia. Es posible definir
el texto alternativo para un smbolo de botn o instancia en el Inspector propiedades.
Para definir el texto Alt de un smbolo o instancia de botn en el Editor de botones:
1. Siga uno de los procedimientos siguientes para abrir el botn en el Editor de botones:
o
o
2. En el Inspector de propiedades introduzca el texto que desee que aparezca como texto alt
en un navegador.
Nota: Si cambia el texto alt de un smbolo de botn no se cambiar el texto alt de las instancias
existentes de botn de dicho smbolo que ya tengan texto alt nico asignado. Esto tambin se produce en
las modificaciones realizadas en el destino de un smbolo de botn y el valor URL.
Clone dos o ms instancias del botn y coloque cada una a la derecha de la anterior.
Sugerencia: Como mtodo abreviado, pulse Alt mientras arrastra la instancia
seleccionada con el puntero para copiarla. Despus de colocar la nueva instancia
inmediatamente a la derecha de la instancia anterior, elija Editar > Repetir Duplicar
para crear y colocar automticamente otra copia de la instancia.
Pgina 46
Curso de Fireworks
Barras de navegacin
2. En el Inspector de propiedades, sustituya el texto del cuadro Texto por la palabra HOME
en maysculas. A continuacin pulse Intro.
El texto del botn cambia para reflejar la modificacin.
3. Cambie el texto de los tres botones restantes por VEHICLES, RATES y CONTACT
US, respectivamente.
Al hacer clic sobre el botn Home en un navegador web, se abrir una pgina
llamada index.htm.
3. Seleccione cada una de las instancias de botn e introduzca el vnculo.
1. Haga doble clic en cualquiera de las instancias del botn en el espacio de trabajo.
Se abre el editor de botones con el smbolo de botn y el texto originales en el espacio de trabajo. El smbolo de botn
original sigue intacto y muestra el texto original.
Cuando cambi el texto de cada botn en el espacio de trabajo simplemente edit las instancias del botn. Si aqu
modifica el aspecto del rectngulo o el texto, editar el smbolo original, por lo que los cambios se reflejarn en todas las
instancias del espacio de trabajo.
Curso de Fireworks
Barras de navegacin
Ahora el estado Sobre de cada botn es de otro color. Slo ha cambiado el smbolo de botn, pero el cambio se ha
aplicado a todas las instancias del botn en la barra de navegacin.
5. Haga clic en la ficha Original y haga doble clic en cualquier instancia del botn en el
espacio de trabajo. Esta vez va a cambiar el texto del smbolo de botn.
6. Seleccione el texto del botn en el editor de botones y elija otro tipo de letra como fuente
en el Inspector de propiedades. Haga lo mismo con cada estado del botn.
4. Asigne un valor URL a cada una de las instancias del botn restantes.
5. Elija Archivo > Vista previa en el navegador > Vista previa. Para comprobar los vnculos
de los botones, es preciso abrir la vista previa del documento en un navegador.
de estado Sobre del men, as como la orientacin vertical y horizontal del men.
Avanzado contiene opciones que determinan las dimensiones de celda, relleno y
La opcin Men coloca el men emergente en relacin con la divisin. La opcin Preestablecido lo incluye
en la parte inferior, inferior derecha, superior y superior derecha de una divisin.
El ajuste Submen coloca el submen emergente en la parte derecha o inferior derecha del men principal,
o debajo del mismo.
Pgina 48
Curso de Fireworks
Barras de navegacin
1. Seleccione una zona interactiva o divisin que ser el rea de activacin del
men emergente.
2. Siga uno de estos procedimientos para abrir el Editor de mens emergentes:
o Elija Modificar > Men emergente > Aadir men emergente.
o Haga clic en el tirador de comportamiento de la divisin y elija Aadir men
emergente.
3. Haga clic en una ficha Contenido.
4. Haga clic en el botn Aadir men para aadir un elemento vaco de men.
Pgina 49
Curso de Fireworks
Barras de navegacin
1. Abra la ficha Contenido del Editor de mens emergentes y cree elementos de men. Cree
los elementos de men que desee utilizar para el submen, colquelos directamente bajo
el elemento de men que activar el submen.
2. Haga clic para resaltar un elemento de men emergente que desee convertir en elemento
de submen.
3. Haga clic en el botn Sangrar men para designar el elemento como una opcin de
submen del elemento inmediatamente encima en la lista.
4. Para aadir el elemento siguiente del submen, resltelo y haga clic en el botn Sangrar
men.
Todos los elementos que estn sangrados de forma contigua en el mismo nivel componen un submen emergente.
5. De forma opcional, resalte un elemento de men o submen y haga clic en Aadir men
para insertar un nuevo elemento justo debajo del elemento resaltado.
6. Siga uno de estos procedimientos:
o Haga clic en Siguiente para ir a la siguiente ficha o elija otra ficha para continuar
con la creacin del men emergente.
o Haga clic en Listo para cerrar el Editor de mens emergentes.
Para crear un submen emergente dentro de un submen emergente:
Pgina 50
Curso de Fireworks
Barras de navegacin
1. Abra el men emergente que desee en el Editor de mens emergentes y haga clic en la
ficha Aspecto.
2. Elija Vertical u Horizontal en el men emergente Orientacin.
Pgina 51
Curso de Fireworks
Barras de navegacin
1. Abra el men emergente que desee en el Editor de mens emergentes y haga clic en la
ficha Aspecto.
2. Elija una opcin de Celdas:
HTML define el aspecto del men utilizando slo cdigos HTML. Esta configuracin produce pginas con el menor
tamao posible.
Imagen le permite seleccionar un estilo de imagen que se utilizar como fondo de celda. Esta configuracin produce
pginas de mayor tamao.
Nota: Puede aadir opciones a esta seleccin de estilos creando sus propios estilos de mens
emergentes.
1. Abra el men emergente que desee en el Editor de mens emergentes y haga clic en la
ficha Aspecto.
2. Elija un tamao preestablecido en el men emergente Tamao o introduzca un valor en el
cuadro de texto Tamao.
Nota: Si en la ficha Avanzado del Editor de mens emergentes se establece la anchura y altura de celda
en Automtico, el tamao del texto determina el tamao de los grficos asociados con el elemento de
men.
4. De forma opcional, puede hacer clic en un botn de estilo de texto como negrita o
cursiva.
5. Haga clic en un botn de justificacin para alinear el texto por la izquierda, la derecha o
centrarlo.
6. Elija un color de texto en el cuadro Color de texto.
Para establecer el aspecto de las celdas de men:
1. Abra el men emergente que desee en el Editor de mens emergentes y haga clic en la
ficha Aspecto.
2. Elija los colores del texto y de la celda para cada estado.
3. Si ha seleccionado Imagen como tipo de celda, elija un estilo grfico para cada estado.
4. Siga uno de estos procedimientos:
o Haga clic en Siguiente para ir hasta la ficha Avanzado o elija otra ficha para
continuar con la creacin del men emergente.
o Haga clic en Listo para cerrar el Editor de mens emergentes.
Curso de Fireworks
Barras de navegacin
2. Haga doble clic en el cuadro de texto del ngulo superior izquierdo (slo Windows).
2. Escriba North America en el cuadro de texto y pulse Intro.
El siguiente cuadro de texto se resalta para que introduzca otra opcin.
Pgina 53
Curso de Fireworks
Barras de navegacin
2. Para comprobar el men emergente, elija Archivo > Vista previa en el navegador > Vista
previa en [el navegador que prefiera] para abrir la vista previa del documento en un
navegador.
Nota: La vista previa de los mens emergentes debe abrirse en un navegador; no
son visibles con la ficha Vista previa de Fireworks.
Cuando el documento se abra en el navegador, desplace el puntero sobre la imagen de
Worldwide Airports. Aparece el men emergente creado.
Pgina 54
Curso de Fireworks
Barras de navegacin
Pgina 55
Curso de Fireworks
Barras de navegacin
Pgina 56
Curso de Fireworks
Barras de navegacin
4. Haga doble clic en el campo Texto de la nueva entrada y escriba Latin/South America.
Haga clic en cualquier punto fuera del campo Texto para aplicar la entrada.
9. Haga clic otra vez en el botn Aadir men y cree una nueva entrada para Canada.
Acaba de crear un submen que aparecer cuando desplace el puntero sobre la entrada North
America en un navegador.
Pgina 57
Curso de Fireworks
Barras de navegacin
10. Asigne valores URL a todas las entradas nuevas. Tambin puede eliminar el vnculo de
North America, porque los usuarios elegirn opciones en el submen.
11. Haga clic en Listo para cerrar el editor de men emergente y despus visualice los
cambios del men emergente en un navegador.
Pgina 58
Curso de Fireworks
2. Seleccionar todos los componentes y agrupar. Herramienta puntero traza un recuadro que
abarque todo el dibujo > Men modificar > grupo. (Tambin Ctrl- G).
3. Convertir en smbolo. Men Modificar > Smbolo > Convertir en smbolo ( F8)
4. En la ventana de Propiedades de smbolo asignar un nombre al botn. En tipo > Botn >
Aceptar.
7. Haga clic en la ficha Sobre de la parte superior del editor de botones y despus en el botn
Copiar grfico Arriba. Modificar el aspecto.
Dibujar con la Herramienta Pluma el trazo interior del circulo.
Rectngulo
redondeado
Color: FF9A00
Color: 003000
Grosor: 3
Efectos: Eye Candy > Bevel Boss
Sombra
8. Haga clic en la ficha Abajo del editor de botones y despus en el botn Copiar grfico Sobre.
Rectngulo
redondeado
Color: FFFF99
Pgina 59
Curso de Fireworks
9. Haga clic en la ficha Sobre-Abajo del editor de botones y despus en el botn Copiar grfico
Sobre. Mantenemos el aspecto.
10. Haga clic en la ficha rea Activa del editor de botones. Modificar el tamao y hacer
coincidir con el tamao del rectngulo redondeado.
11. Ver el resultado en el navegador (F12) o vista previa.
13. En el Inspector de propiedades asignar los valores apropiados.
botn
Elija Editar > Clonar . Sobre el botn original aparece una nueva instancia de botn.
3. Mantenga pulsada la tecla Mays mientras pulsa repetidamente la tecla de flecha derecha
para desplazar la nueva instancia hacia la derecha. Repetir el proceso hasta obtener los
botones deseados.
4. En el Inspector de propiedades, sustituya el texto del cuadro Texto por el nombre de cada
botn. A continuacin pulse Intro.
Curso de Fireworks
Historia
Historia
Aventuras
Novela
Poesa
Pgina 61
Curso de Fireworks
10. Para comprobar el men emergente, elija Archivo > Vista previa en el navegador > Vista
previa en [el navegador que prefiera] para abrir la vista previa del documento en un
navegador.
Nota: La vista previa de los mens emergentes debe abrirse en un navegador; no son visibles con la ficha
Vista previa de Fireworks.
15. Elegir Imagen como tipo de celda y Men vertical como alineacin.
16. Elija Arial, Helvetica, sans-serif como fuente y 12 como tamao de fuente.
17. En la seccin Estado Arriba, defina el color del texto en 903000. Despus haga clic en el
cuadro de color de celda, color A5E3BD. En Estilo elegir uno cualquiera.
18. En la seccin Estado Sobre, defina el color del texto en negro y haga clic en el cuadro de
color de celda, color FFB2FF. En Estilo elegir el mismo de antes.
19. Haga clic en el botn Siguiente. Aparece la ficha Avanzado.
20. Podemos modificar distintos elementos para ver el efecto sobre el men emergente.
Pgina 62
Curso de Fireworks
22. Introducir 3 en los cuadros X e Y de Posicin del men y despus haga clic en Listo.
Nota: La posicin de un men emergente tambin puede cambiarse arrastrando su contorno por el
espacio de trabajo.
Pgina 63
Curso de Fireworks
Animaciones
4. ANIMACIONES.
Creacin de una animacin
En Fireworks las animaciones se crean mediante la asignacin de propiedades
a objetos denominados smbolos de animacin. La animacin de un smbolo se
divide en fotogramas, que contienen las imgenes y objetos que componen
cada etapa de la animacin. Una animacin puede contener ms de un smbolo
y cada uno de ellos puede realizar una accin diferente. Los distintos smbolos
pueden tener un nmero diferente de fotogramas. La animacin termina
cuando acaba la accin de todos los smbolos.
Para crear una animacin mediante smbolos en Fireworks:
Curso de Fireworks
Animaciones
Pgina 65
Curso de Fireworks
Animaciones
1. Seleccione el objeto.
2. Elija Modificar > Animar > Animar seleccin.
3. Introduzca el valor deseado en el cuadro de dilogo..
Aparecen controles de animacin en el recuadro delimitador del objeto y
se aade una copia del smbolo a la biblioteca.
Pgina 66
Curso de Fireworks
Animaciones
Pgina 67
Curso de Fireworks
Animaciones
Derecha e Izquierda son las direcciones en que rota el objeto. Derecha equivale
al sentido de las agujas del reloj e Izquierda indica el sentido contrario a las
agujas del reloj.
Para cambiar las propiedades de smbolo de animacin:
Pgina 68
Curso de Fireworks
Animaciones
Utilizacin de fotogramas
Las animaciones se construyen a partir de la creacin de varios fotogramas. El
contenido de cada uno de ellos puede verse en el panel Fotogramas. El panel
Fotogramas permite crear y organizar los fotogramas. Se puede asignar un
nombre a cada fotograma, reorganizarlos, establecer de forma manual los
tiempos de animacin y mover objetos de un fotograma a otro.
Pgina 69
Curso de Fireworks
Animaciones
Curso de Fireworks
Animaciones
3. Pulse Intro o haga clic fuera de la ventana emergente Propiedades de fotograma para
cerrarlo.
Curso de Fireworks
Animaciones
Pgina 72