DISE

1
DISEÑO Y PRODUCCIÓN DIGITAL Sesión 26 Módulo
III Herramientas de Producción para Medios
DigitalesHerramientas de captura / Herramientas
de edición Introducción al FireworksExtraído del
manual de Fireworks de Macromediahttp//www.macro
media.com/ Presenta Lic. Fernando Gutiérrez C.,
MATI Departamento de Comunicación Instituto
Tecnológico y de Estudios Superiores de
Monterrey, Campus Estado de México
2

• Introducción al Fireworks
•  
• Fireworks es una herramienta digital para diseñar
  y producir elementos gráficos para la web. Esta
  herramienta puede utilizarse para crear, editar y
  animar gráficos web, añadir interactividad
  avanzada y optimizar imágenes en entornos
  profesionales.
• En Fireworks es posible crear y modificar
  imágenes vectoriales y de mapa de bits en una
  sola aplicación. Todo es modificable en todo
  momento. Y el flujo de trabajo puede
  automatizarse para satisfacer las necesidades de
  cambio y actualización que de otra forma
  exigirían una enorme dedicación.

3

• Introducción al Fireworks
• Fireworks se integra con otros productos de
  Macromedia, como Dreamweaver, Flash, FreeHand y
  Director, y con otros editores HTML y
  aplicaciones gráficas de uso frecuente para
  ofrecer una solución web global. Los elementos
  gráficos de Fireworks pueden exportarse
  fácilmente con código HTML y JavaScript adaptado
  al editor de HTML que se utilice.
• Con Fireworks MX, la producción gráfica se
  integra en el proceso de desarrollo en un flujo
  de trabajo abierto y eficaz que reconoce y
  permite utilizar los formatos de archivo,
  aplicaciones y normas empleados.

4
En el centro de la pantalla se encuentra la
ventana de documento. En el centro de la ventana
de documento se encuentra el lienzo. Aquí es
donde se muestra el documento de Fireworks y las
imágenes creadas. En la parte superior de la
pantalla hay una barra de menús. La mayoría de
los comandos de Fireworks son accesibles desde la
barra de menús. En la izquierda de la pantalla
se encuentra el panel Herramientas. Si el panel
Herramientas no está visible, elija Ventana gt
Herramientas. El panel Herramientas contiene las
herramienta para seleccionar, crear y modificar
diversos elementos gráficos y objetos web.
5
En la parte inferior de la pantalla se
encuentra el Inspector de propiedades. Si no está
visible, elija Ventana gt Propiedades. El
Inspector de propiedades presenta las propiedades
del objeto o la herramienta seleccionados. Estas
propiedades pueden cambiarse. Si no se ha
seleccionado ningún objeto ni herramienta, indica
las propiedades del documento. El Inspector de
propiedades muestra dos o cuatro filas de
propiedades. Si está a media altura, es decir, si
sólo muestra dos filas, es posible hacer clic en
la flecha de ampliación del ángulo inferior
derecho para ver todas las propiedades.
6
En la derecha de la pantalla hay varios
paneles, como Capas y Optimizar. Éstos y otros
paneles pueden abrirse desde el menú Ventana.
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, menús, botones y otros
rasgos de la interfaz en todo el programa.
Desaparecen al retirar el puntero de los
elementos en cuestión.
7
Con Fireworks es posible crear y modificar dos
tipos de imágenes objetos vectoriales e imágenes
de mapa de bits. Un objeto vectorial es una
descripción matemática de una forma geométrica.
Los trazados de vectores se definen con puntos.
Su calidad no se degrada cuando se amplían,
reducen o cambian de escala. Por su parte, la
imagen de mapa de bits está compuesta por una
cuadrícula de píxeles de color. Las imágenes con
variaciones complejas de color, como las
fotografías, suelen ser imágenes de mapa de
bits. Así como otras aplicaciones ofrecen
herramientas para editar formas vectoriales o
imágenes de mapa de bits, Fireworks permite
trabajar con ambos tipos de elementos gráficos.
8
Diseño web en Fireworks Los diseñadores web
utilizan un proceso denominado división para
desmembrar los documentos web por varias razones.
En la web se descargan con más rapidez las
imágenes pequeñas, lo cual permite que los
usuarios vayan viendo una página progresivamente
en lugar de esperar a que se descargue toda una
imagen grande. Además, con la división es posible
optimizar las distintas partes del documento de
forma diferente. La división también es necesaria
para añadir interactividad.
9

• Acerca de las imágenes vectoriales
• Los elementos gráficos vectoriales describen
  imágenes mediante líneas y curvas, denominados
  vectores, que incluyen información de color y
  posición. Por ejemplo, la imagen de una hoja
  puede describirse con una serie de puntos, cuyo
  resultado es el contorno de la hoja. El color de
  la hoja lo determina el color del contorno o
  trazo y el color del área interior o relleno.
  Cuando se edita una imagen vectorial, se
  modifican las propiedades de las líneas y curvas
  que describen su forma. Las imágenes vectoriales
  son independientes de la resolución, lo que
  significa que es posible desplazar, cambiar el
  tamaño, alterar la forma y modificar el color de
  una imagen vectorial, así como visualizarla en
  dispositivos de salida de diferente resolución,
  sin que cambie la calidad de su aspecto.

10

• Acerca de las imágenes de mapa de bits
• Las imágenes de mapa de bits están formadas por
  puntos, llamados píxeles, organizados en una
  cuadrícula. La pantalla del ordenador es una gran
  cuadrícula de píxeles. En la versión de mapa de
  bits de la hoja, la imagen estaría determinada
  por la posición y el valor de color de cada píxel
  de la cuadrícula. Cada punto tiene asignado un
  color. Cuando se presentan con la resolución
  adecuada, los puntos encajan entre sí como las
  teselas de un mosaico y forman la imagen. Cuando
  se edita una imagen de mapa de bits, se modifican
  los píxeles, no las líneas y curvas. Las imágenes
  de mapa de bits dependen de la resolución, es
  decir, los datos que las definen están fijos en
  una cuadrícula que tiene un tamaño determinado.
  Cuando se aumenta el tamaño de un elemento
  gráfico de mapa de bits, sus bordes pueden quedar
  desiguales, porque los píxeles se redistribuyen
  en la cuadrícula. La visualización de un elemento
  gráfico de mapa de bits en un dispositivo de
  salida con menor resolución que la propia imagen
  también puede reducir su calidad.

11

• Dado que Fireworks exporta el contenido HTML en
  forma de tablas HTML, también determina la
  disposición del documento para HTML importado
  basándose en tablas HTML. Un archivo HTML debe
  contener al menos una tabla para que Fireworks
  pueda reconstruirlo.
• Al pegar en Fireworks un objeto copiado de otra
  aplicación, éste queda centrado en el documento
  activo. Puede utilizar el Portapapeles para
  cortar y pegar objetos y texto con cualquiera de
  los formatos siguientes FreeHand 7 o posterior,
  Illustrator, PNG, PICT (Macintosh), DIB
  (Windows), BMP (Windows), Texto ASCII, EPS, WBMP,
  TXT, RTF

12

• Para mayor información revisar el manual de
  Fireworks en al área de Material de Apoyo.