Trabajo de Fireworks

18

description

INVESTIGACION DE FIREWORKS CS5 Y SUS HERRAMIENTAS Y FUNCIONES

Transcript of Trabajo de Fireworks

Page 1: Trabajo de Fireworks

5/16/2018 Trabajo de Fireworks - slidepdf.com

http://slidepdf.com/reader/full/trabajo-de-fireworks 1/18

Page 2: Trabajo de Fireworks

5/16/2018 Trabajo de Fireworks - slidepdf.com

http://slidepdf.com/reader/full/trabajo-de-fireworks 2/18

Adobe Fireworks 

Adobe Fireworks es una herramienta para desarrolladores web que permite diseñar,

editar y optimizar gráficos para Internet. Destinado para el manejo de gráficos vectorialesy que ofrece un ambiente eficiente tanto para la creación rápida de sitios web e interfaces

de usuario.

 Versiones 

Page 3: Trabajo de Fireworks

5/16/2018 Trabajo de Fireworks - slidepdf.com

http://slidepdf.com/reader/full/trabajo-de-fireworks 3/18

 

1998: Macromedia Fireworks

1999: Macromedia Fireworks 2

2000: Macromedia Fireworks 32001: Macromedia Fireworks 4

2002: Macromedia Fireworks MX (v6.0)

2004: Macromedia Fireworks MX 2004 (v7.0)

2005: Macromedia Fireworks 8

2007: Adobe Fireworks CS3 (v9.0)

2008: Adobe Fireworks CS4 (v10.0)

2010: Adobe Fireworks CS5 (v11.0)

2011: Adobe Fireworks CS5.1 (v11.1

ADOBE FIREWORKS CS3 (V.90)

Es una exclusiva herramienta de edición de imágenes vectoriales y de mapa de bits,

proporciona el entorno más eficaz para el diseño de sitios Web e interfaces de usuario, y

la creación y optimización de imágenes para la Web. Fireworks CS3 ofrece flexibilidad para

editar imágenes vectoriales o de mapa de bits, una biblioteca común de activos

predefinidos, así como integración con Adobe Photoshop CS3, Adobe Illustrator CS3,

Adobe Dreamweaver CS3 y Adobe Flash CS3 Professional, lo que permite ahorrar tiempo.

Novedades de Fireworks CS3

Creación de símbolos sofisticados

Esta versión de Fireworks introduce funciones de símbolos nuevas y otras mejoradas.

Podrá crear símbolos gráficos que pueden ajustarse a escala de forma inteligente y utilizar

atributos específicos para ellos mediante un archivo JavaScript (JSF). Imite una interfaz de

usuario rápidamente arrastrando estos símbolos al documento y editando los parámetros

asociados mediante el panel Propiedades de símbolo.

Ajuste de escala de símbolos de forma inteligente

Tradicionalmente, cuando se aplica una transformación a escala a un símbolo, se

transforma el objeto completo como una sola unidad. Con determinados tipos de objetos,

especialmente con formas geométricas que tienen ángulos con estilos, el resultado es un

símbolo que aparece distorsionado.

Page 4: Trabajo de Fireworks

5/16/2018 Trabajo de Fireworks - slidepdf.com

http://slidepdf.com/reader/full/trabajo-de-fireworks 4/18

Fireworks CS3 introduce una nueva función automática denominada escala de 9

divisiones, que permite ajustar a escala los símbolos vectoriales o de mapa de bits de

forma inteligente. Un grupo de guías que aparecen sobre la imagen permiten definir con

exactitud cómo se ajusta a escala cada parte del símbolo.

Uso de un solo documento de varias páginasEn un continuo esfuerzo por mejorar los flujos de trabajo de diseño de sitios Web,

Fireworks CS3 facilita la generación de prototipos complejos de varias páginas utilizando

un solo archivo PNG. Cada página contiene su propia configuración de lienzo, tamaño,

color, resolución de imagen y guías. Estas configuraciones se pueden definir para cada

página o de forma global para todas las páginas del documento.

Fireworks lleva el concepto multipágina aún más lejos y permite aplicar las capas a una

sola página o bien compartirlas entre varias.

Creación de presentaciones de diapositivas basadas en Flash

Cree automáticamente una presentación de diapositivas. El comando Create Slideshow

permite crear presentaciones de diapositivas de Flash sin necesidad de conocer cómo

funciona esta aplicación. Basta con seleccionar una carpeta con imágenes, añadir las

opciones de diapositivas (como las transiciones), seleccionar un reproductor de álbumes

de Fireworks

(una plantilla de Flash) para el resultado final y procesar por lotes la imagen en miniatura y

las imágenes a tamaño completo

optimizadas para la Web.

Capas jerárquicas

La estructura de las capas de un documento puede ser tan sencilla o tan compleja como se

necesite y todas las capas jerárquicas se conservan. Al crear un nuevo archivo, todos loselementos se organizan en el mismo nivel, de forma no jerárquica. Pueden crearse nuevas

subcapas y colocar en ellas elementos o bien cambiar elementos de una capa a otra en

cualquier momento. También se pueden crear varias subcapas y agruparlas.

Utilización de archivos de Photoshop

Con Fireworks CS3, puede importar directamente archivos nativos desde Photoshop.

Adobe alcanza un nuevo nivel de funcionalidad, redefiniendo el concepto de integración.

Ahora, los componentes de diseño y las imágenes de Fireworks pueden guardarse como

archivos nativos de Photoshop y abrirse en Photoshop o Fireworks CS3 sin perder la

información de las capas.

Importación de archivos de Fireworks a Adobe Flash

Ahora, puede mover contenido de Fireworks CS3 a Flash CS3 Professional rápidamente

con solo copiar y pegar, o bien importar directamente un archivo PNG de Fireworks. La

estructura importante se conserva, con varias páginas, capas compartidas, capas

 jerárquicas, fotogramas, ajustes de escala de 9 divisiones y muchos efectos. Nunca ha sido

tan fácil crear prototipos en Fireworks y desarrollar en Flash.

Page 5: Trabajo de Fireworks

5/16/2018 Trabajo de Fireworks - slidepdf.com

http://slidepdf.com/reader/full/trabajo-de-fireworks 5/18

 

Integración con FLEX para diseños RIA

Los diseñadores utilizan cada vez tecnologías más innovadoras, por lo que el uso de

herramientas más eficaces y la integración es ahora más importante que nunca. Fireworks

CS3 puede ayudar en el desarrollo de aplicaciones de Internet de próxima generación,

conocidas como aplicaciones RIA, ya que permite exportar activos de bibliotecas comunescomo componentes conocidos para su uso en Adobe Flex Builder. El estilo y la posición

absoluta se conservan también.

Y lo mejor es que el usuario no tiene que preocuparse de nada; Fireworks exporta el

código Flex (MXML) necesario. Ahora es muy fácil crear el diseño de una aplicación Flex en

Fireworks, aprovechando los activos de biblioteca común como MXML para cargarlos en

Flex Builder.

Utilización de archivos de Illustrator

Abra archivos de Illustrator en Fireworks conservando las capas jerárquicas, patrones,

imágenes vinculadas, atributos de texto o transparencia, entre otras características.

Fireworks también contiene opciones de exportación para exportar a Adobe Ilustrator 8.0.

Adobe Bridge

Simplifique la gestión de archivos en Fireworks y en Adobe Creative Suite con Adobe

Bridge, el explorador de archivos de próxima generación. Localice, etiquete, procese y

desplácese por las imágenes de forma eficaz. Si utiliza Bridge y Fireworks combinados,

aprovecha la ventaja de los metadatos XMP en sus archivos. Adobe XMP (Extensible

Metadata Platform) es una tecnología que facilita al usuario la incorporación de

información de archivo a los archivos guardados en formato PNG, GIF, JPEG, Photoshop y

TIFF, y permite el intercambio de metadatos entre el software de Adobe y otros sistemasque admiten el estándar de metadatos XMP.

ADOBE FIREWORKS CS4 (V10.0)

Novedades de Fireworks CS4

Mejora del rendimiento y la estabilidad

Puede trabajar de forma más rápida e inteligente con las mejoras generales de

rendimiento de Fireworks, desde abrir y guardar archivos hasta la actualización de

símbolos y las operaciones con numerosos mapas de bits y vectores.

Nueva interfaz de usuario

Podrá cambiar de otras aplicaciones de Creative Suite (como Photoshop, Illustrator y

Flash) gracias al diseño sencillo y familiar de la interfaz de usuario universal.

Page 6: Trabajo de Fireworks

5/16/2018 Trabajo de Fireworks - slidepdf.com

http://slidepdf.com/reader/full/trabajo-de-fireworks 6/18

 

Diseños basados en CSS

Diseñe páginas Web completas en el potente entorno gráfico de Fireworks y exporte en

un paso los diseños basados en CSS compatibles con los estándares para la Web, junto con

las hojas de estilos externas. Empiece con uno de los seis diseños más comunes e integre

gráficos de primer plano y de fondo con la detección automática de margen y relleno.Incluya símbolos HTML sofisticados en los diseños de Fireworks para especificar

cabeceras, vínculos y propiedades de formato y obtener un control CSS preciso.

Exportación a PDF

Puede generar documentos PDF de alta fidelidad, interactivos y seguros a partir de

componentes de diseño de Fireworks para una comunicación mejorada con el cliente.

Motor de texto de Adobe

Permite generar diseños de texto superiores con las funciones mejoradas de introducción

de texto del Motor de texto de Adobe, conocido para los usuarios de Photoshop e

Illustrator, y ahora disponible en Fireworks. Podrá importar o copiar y pegar caracteres de

doble byte de Adobe Illustrator o Photoshop sin perder fidelidad. La inclusión de texto

flotante en un trazado proporcionará mayor impacto en los logotipos de texto.

Estilos automáticos

Aplique a un objeto o texto de Fireworks estilos de diseño profesional o de su propia

colección personal. Actualice los efectos, colores y atributos de texto aplicados

modificando un solo origen de estilo.

Mejoras del espacio de trabajo

Se proporcionan guías inteligentes para un posicionamiento y una medida rápidos yprecisos de las guías y elementos del lienzo: una visualización previa le permite conocer la

posición en el lienzo mientras arrastra las guías hasta la posición adecuada. La edición

directa de símbolos permite una mejora precisa del símbolo en contexto con el resto del

diseño; la herramienta de expansión Escala de 9 divisiones ahora se aplica a cualquier

objeto del lienzo, no sólo a los símbolos.

ADOBE FIREWORKS CS5 ( 11.0)

Page 7: Trabajo de Fireworks

5/16/2018 Trabajo de Fireworks - slidepdf.com

http://slidepdf.com/reader/full/trabajo-de-fireworks 7/18

 

Novedades de Fireworks CS5

Mejora del rendimiento y la estabilidad

Numerosas mejoras en las herramientas más utilizadas en Fireworks que ayudan a

aumentar la eficacia de trabajo.

Rendimiento general más rápido.

Mayor control sobre la ubicación de píxeles de elementos de diseño.

Herramienta de trazado compuesto actualizada.

Precisión de píxeles

La precisión de píxel mejorada garantiza que el diseño resulte limpio y nítido en cualquier

dispositivo. Podrá corregir con facilidad y rapidez los elementos de diseño que no

aparezcan en un píxel completo.

Integración con Adobe Device CentralCon el uso de Adobe Device Central, es posible seleccionar perfiles para móviles u otros

dispositivos y posteriormente iniciar un flujo de trabajo automatizado para crear un

proyecto de Fireworks. El proyecto dispone de la resolución y el tamaño de pantalla del

dispositivo de destino. Una vez completado el diseño, se puede obtener una vista previa

en distintas condiciones utilizando las capacidades de emulación de Device Central.

También se pueden crear perfiles de dispositivo personalizados.

Gracias a la integración con Adobe Device Central, se obtienen flujos de trabajo de diseño

móvil mejorados, incluyendo la emulación de diseños interactivos.

Flujos de trabajo admitidos con Flash Catalyst y Flash Builder

Podrá crear interfaces de usuario avanzadas y contenido interactivo utilizando los nuevos

flujos de trabajo entre Fireworks y Flash Catalyst. Diseñe en Fireworks y seleccione

objetos, páginas o documentos completos para exportar mediante FXG, un nuevo formato

de gráficos basado en XML para las herramientas de la Plataforma Adobe Flash.

Podrá exportar sus diseños con eficacia a Flash Professional, Flash Catalyst y Flash Builder

mediante un script ampliable y personalizable.

Mejoras en extensibilidad

Podrá experimentar un mayor control al trabajar con otras aplicaciones: API mejorada

compatible con scripts de exportación ampliables por el usuario, proceso por lotes ycontrol avanzado sobre el formato de archivo FXG.

Uso compartido de muestras en el conjunto

Se obtendrá un mejor control sobre la precisión de color utilizando la capacidad de

Fireworks para compartir muestras de forma adecuada entre las aplicaciones de Creative

Suite. La capacidad para compartir el formato de archivo ASE potencia el intercambio de

color unificado entre los diseñadores, incluyendo los que utilizan Adobe Kuler.

Page 8: Trabajo de Fireworks

5/16/2018 Trabajo de Fireworks - slidepdf.com

http://slidepdf.com/reader/full/trabajo-de-fireworks 8/18

 

ESPACIO DE TRABAJO DE ADOBE FIREWORKS CS5

Información general del espacio de trabajo de Fireworks

Al abrir un documento en Adobe® Fireworks® por primera vez, el espacio de trabajo

incluye el panel Herramientas, el Inspector de propiedades, los menús y otros paneles. El

panel Herramientas, situado a la izquierda de la pantalla, contiene varias secciones de

herramientas de distintos grupos, como mapa de bits, vector y Web. De forma

predeterminada, el Inspector de propiedades aparece en la parte inferior del documento y

al principio muestra las propiedades del mismo. Después cambia para mostrar las

propiedades de la herramienta o el objeto seleccionados mientras se trabaja con el

documento. Los paneles están inicialmente acoplados en grupos a lo largo de la parte

derecha de la pantalla. La ventana de documento aparece en el centro de la aplicación.

Página de inicio

Al iniciar Fireworks sin abrir ningún documento, aparece la página de inicio de Fireworks

en el entorno de trabajo. La página de inicio le ofrece un acceso rápido a los tutoriales de

Fireworks, archivos recientes y Fireworks Exchange, en el que puede añadir nuevas

capacidades a algunas funciones de Fireworks. Para desactivar la página de inicio, haga clic

Page 9: Trabajo de Fireworks

5/16/2018 Trabajo de Fireworks - slidepdf.com

http://slidepdf.com/reader/full/trabajo-de-fireworks 9/18

en no volver a mostrar este mensaje, cuando se abra la página Inicio.

Acerca de los paneles de Fireworks

Los paneles son controles flotantes que ayudan a modificar aspectos de elementos u

objetos seleccionados en el documento. Con los paneles se puede trabajar en estados,

capas, símbolos, muestras de color y otros. Los paneles pueden arrastrarse por separado,

por lo que es posible agrupar los paneles en función de las necesidades propias.

Panel Optimizar Permite gestionar los ajustes que controlan el tamaño y el tipo de los

archivos así como trabajar con la paleta de colores del archivo o la división.

Panel Capas Organiza la estructura de un documento y contiene opciones para crear,

eliminar y manipular capas.

Panel Biblioteca común Muestra el contenido de la carpeta de biblioteca común Common

Library, que contiene símbolos. Es fácil arrastrar instancias de estos símbolos desde el

panel Biblioteca de documentos hasta el documento.Panel Páginas Muestra las páginas del archivo actual y contiene opciones para la

manipulación de páginas.

Panel Estados Muestra los estados del archivo actual y contiene opciones para la creación

de animaciones.

Panel Historial Incluye una lista de los comandos de uso reciente que puede deshacer y

rehacer de forma rápida. Además, es posible seleccionar varias acciones y después

guardarlas y volver a usarlas como comandos.

Panel Formas automáticas Contiene formas automáticas que no aparecen en el panel

Herramientas.

Panel Estilos Permite almacenar y volver a utilizar combinaciones de características de

objetos o elegir un estilo entre los almacenados.

Panel Biblioteca de documentos Contiene símbolos gráficos, símbolos de botón y

símbolos de animación que ya están en el documento actual de Fireworks. Es fácil

arrastrar instancias de estos símbolos desde el panel Biblioteca de documentos hasta el

documento. También es posible realizar cambios globales en ellas modificando solamente

el símbolo.

Panel URL Permite crear bibliotecas que contienen direcciones URL que se utilizan con

frecuencia.

Panel Mezclador de colores Permite crear colores para añadirlos a la paleta de colores del

documento actual o aplicarlos a los objetos seleccionados.

Panel Muestras Gestiona la paleta de colores del documento actual.Panel Información Proporciona datos sobre las dimensiones de los objetos seleccionados

y las coordenadas del cursor conforme se mueve por el lienzo.

Panel Comportamientos Permite controlar los comportamientos, que determinan la

reacción que se produce en las zonas interactivas o las divisiones al mover el ratón.

Panel Buscar Permite buscar y reemplazar elementos como texto, URL, fuentes y colores

en uno o varios documentos.

Panel Alinear Contiene controles para alinear y distribuir objetos en el lienzo.

Page 10: Trabajo de Fireworks

5/16/2018 Trabajo de Fireworks - slidepdf.com

http://slidepdf.com/reader/full/trabajo-de-fireworks 10/18

Panel Propiedades de forma automática Permite cambiar las propiedades de una forma

automática tras insertarla en un documento.

Panel Paleta de colores (Ventana > Otros) Permite crear e intercambiar paletas de

colores, exportar muestras de color ACT, explorar distintos esquemas de color y acceder a

los controles más utilizados para elegir los colores.

Edición de imagen (Ventana > Otros) Organiza en un panel las herramientas y opcionesutilizadas con frecuencia para la edición de mapas de bits.

Panel Trazado (Ventana > Otros) Ofrece acceso rápido a muchos comandos relacionados

con trazados.

Caracteres especiales (Ventana > Otros) Muestra los caracteres especiales que se pueden

utilizar en bloques de texto.

Propiedades de símbolo Permite gestionar las propiedades personalizables de los

símbolos gráficos.

PALETA DE HERRAMIENTAS DE ADOBE FIREWORKS CS5

El panel Herramientas está organizado en seis categorías:

Seleccionar

Flecha (Pointer tool): Esta herramienta es la más utilizada ya que con ella movemos y

seleccionamos los objetos presentes en nuestras creaciones.

Page 11: Trabajo de Fireworks

5/16/2018 Trabajo de Fireworks - slidepdf.com

http://slidepdf.com/reader/full/trabajo-de-fireworks 11/18

 

Subselección (Subselection tool): La "flechita blanca" nos permite echar a volar nuestra

imaginación ya que nos permite modificar los vectores a nuestro antojo.

Page 12: Trabajo de Fireworks

5/16/2018 Trabajo de Fireworks - slidepdf.com

http://slidepdf.com/reader/full/trabajo-de-fireworks 12/18

 Escala (Scale tool): Con esta opción podemos transformar libremente los objetos,cambiando sus tamaños o rotándolos.

Corte (Crop tool): Si hay queremos seleccionar sólo una zona de la imagen para eliminar el

resto, esta es la herramienta que necesitamos.

Page 13: Trabajo de Fireworks

5/16/2018 Trabajo de Fireworks - slidepdf.com

http://slidepdf.com/reader/full/trabajo-de-fireworks 13/18

 

Mapa de bits

Selección (Marquee tool): Permite seleccionar cualquier zona de nuestra imagen

encuadrada en alguna figura geométrica, como rectángulos o círculos.

Lazo (Lasso tool): Al contrario que la opción anterior, el lazo permite seleccionar zonas de

los mapas de bits libremente. Debido a esto, requiere una gran precisión para realizar una

selección correcta.

Varita mágica (Magic wand tool): Con esta herramienta podemos seleccionar zonas

específicas de un bitmap, delimitadas por la presencia de colores similares, sólo con hacer

un clic.

Lápiz (Pencil tool): Si dibujar se trata, esta opción nos permite crear gráficos a pulso, como

si estuviéramos en el jardín infantil.

Goma de borrar (Eraser tool): Elimina cualquier zona de nuestro mapa de bit.

Blur tool: Si queremos que algún punto de nuestra imagen se vea desenfocado, esta es la

opción que debemos escoger.

Cuentagotas (Eyedropper tool): Tal como si se tratara de un gotero, esta herramienta

"succiona" colores que están presentes en nuestro mapa de bit, para posteriormente

aplicarlo en otra zona usando herramientas de dibujo.

Tarro de pintura (Paint bucket tool): Literalmente es vaciar un pote de pintura sobre

alguna zona de color o selección previa.

Page 14: Trabajo de Fireworks

5/16/2018 Trabajo de Fireworks - slidepdf.com

http://slidepdf.com/reader/full/trabajo-de-fireworks 14/18

 

Vector

Línea (Line tool): Si queremos crear líneas rectas, esta es la herramienta indicada.

Rectángulo: Esta herramienta crea figuras geométricas como círculos o cuadrados. Para

cambiar las formas, debemos presionar el puntero del mouse sobre el botón para que se

desplieguen otras opciones.

Texto (Text tool): Da la posibilidad de agregar palabras o frases a nuestras imágenes

(descripciones, nombres, etc.).

Free form tool: Esta herramienta permite crear trazos con la forma que deseemos pero

requiere mucha precisión.

Page 15: Trabajo de Fireworks

5/16/2018 Trabajo de Fireworks - slidepdf.com

http://slidepdf.com/reader/full/trabajo-de-fireworks 15/18

 Cuchillo (Knife tool): El cuchillo permite cortar un trazo en varios puntos, dejando

nuestros vectores como elementos más sencillos de modificar.

Pluma (Pen Tool): Las herramientas permiten dibujar trazados con bordes suaves.

Web

Page 16: Trabajo de Fireworks

5/16/2018 Trabajo de Fireworks - slidepdf.com

http://slidepdf.com/reader/full/trabajo-de-fireworks 16/18

 

Ocultar divisiones y zonas interactivas: Herramienta que sirve para ocultar la visibilidad

de todo el documento incluyendo las guías de división.

Herramienta División: Nos sirve para realizar las divisiones de nuestros sitios web.

Colores

Bote de pintura (Paint Bucket Tool): Esta herramienta es muy sencilla de utilizar y es muy

útil para aplicar a zonas amplias un color determinado. Siempre actúa sobre los pixeles

con características semejantes.

Cuentagotas (EyeDroper Tool): Herramienta le permite tomar un color y colocarlo como

predeterminado en Color Frontal o Color de Fondo según lo desee.

Black & White, Swap Colors: No es más que regresar a los colores default, y swap color, es

para cambiar de fill a stroke y viceversa hablando de colores.

Ver

Page 17: Trabajo de Fireworks

5/16/2018 Trabajo de Fireworks - slidepdf.com

http://slidepdf.com/reader/full/trabajo-de-fireworks 17/18

 

Mano (Hand Tool): La herramienta mueve una imagen dentro de su ventana.

Zoom Tool: La herramienta aumenta o reduce la visualización de una imagen.

Modo Pantalla estándar: Se trata de la vista de ventana de documento predeterminada.

Modo Pantalla completa  con menús: Vista de ventana de documento maximizada

dispuesta contra un fondo gris. Son visibles los menús, las barras de herramientas, las

barras de desplazamiento y los paneles.

Modo Pantalla completa: Vista de ventana de documento maximizada dispuesta contra

un fondo negro. No hay menús, barras de herramientas ni barras de título visibles

Sopa de Letrashttp://www.educaplay.com/es/recursoseducativos/608499/fireworks_sopa_de_letras.ht

Crucigramahttp://www.educaplay.com/es/recursoseducativos/608494/crucigrama_fireworks.htm 

Prezi

http://prezi.com/_hxg3gx1admh/fireworks/