fireworks y dreamweaver

12
ENTORNO DE LOS EDITORES DERLY YULIETH MORENO PIEDRAHITA ANGELICA MARIA PUENTES AGUIRRE SENA TÉCNICO EN SISTEMAS

Upload: derly-y-angelica

Post on 08-Apr-2016

220 views

Category:

Documents


5 download

DESCRIPTION

Entorno gráfico de los editores.

TRANSCRIPT

Page 1: FIREWORKS Y DREAMWEAVER

ENTORNO DE LOS EDITORES

DERLY YULIETH MORENO PIEDRAHITA

ANGELICA MARIA PUENTES AGUIRRE

SENA

TÉCNICO EN SISTEMAS

IBAGUÉ-TOLIMA

2015

Page 2: FIREWORKS Y DREAMWEAVER

¿QUÉ ES FIREWORKS?

Es un software editor de mapas de bits (formato de imagen) y gráficos vectoriales.

BARRA DE MENÚ

Se encarga de organizar los comandos debajo de los menús.

1. Archivo: Abrir, guardar, importar, exportar.2. Edición: Cortar, copiar (vectores, código HTML) pegar(mascara, atributos,

dentro).3. Ver: Visualiza (Acercar, alejar, pantalla completa), oculta (guías, reglas y

cuadriculas).4. Seleccionar: Seleccionar, todo, anular, selección, superseleccionar,

subseleccionar, selección inverso, seleccionar similar, guardar selección. 5. Modificar: Editar animaciones, menús, máscaras, símbolos, Jpeg, crear

grupos y desagruparlos.6. Texto: Edición de textos (alineamiento, tamaño, estilo, fuente)7. Comandos: Acciones preestablecidas, crear nuestros propios grupos de

comandos.8. Filtros: Encontramos en su menú toda la galería de filtros disponibles.

Page 3: FIREWORKS Y DREAMWEAVER

9. Ventana: Muestra y oculta los paneles situados en la zona de acoplamiento de paneles.

10.Ayuda: Centro de asistencias y actualizaciones.

BARRA DE HERRAMIENTAS

Se identifican las herramientas para el objeto gráfico.

1. Seleccionar:

- Herramientas Puntero, subselección: Selección de objetos.

- Herramienta Escala: Formación de tamaño.

- Herramienta Recortar:Recorte.

2. Mapa de bits:

- Varita mágica: Seleccionar

- Herramienta Sello: Cambios fotográficos básicos

- Herramientas Lápiz o Pincel: pintar o dibujar objetos de mapas de bits.

- Herramientas Perfilar, desenfocar, aclarar, oscurecer o difuminar: Tratamiento selectivo de los píxeles de un mapa de bits.

3. Vector: Crear o editar trazados o formas vectoriales:

- La Pluma La Línea Rectángulo Elipse Polígono.

Page 4: FIREWORKS Y DREAMWEAVER

4. Web:

- Herramientas Zona interpretativa: Creación de interactividad web.

- Herramienta División: Creación de efectos visuales interactivos.

- Herramientas Ocultar-Mostrar Divisiones, Zonas interactivas: Mostrar u ocultar los componentes web en el lienzo.

5. Colores: Controlan los colores de relleno y trazo:

- Cubo de pintura: Dar color.

- Cuentagotas. Muestras de color.

- Degradado: Realizar gradaciones.

6. Ver: - Herramientas Zoom:

Acercar o alejar la imagen.- La mano: Desplazarse por

el documento- Pantalla Estándar- Cambiar tres vistas: Modo

pantalla completa con Menús, Modo de pantalla completa.

INSPECTOR DE PROPIEDADES

Es un panel que varía según el contexto y que muestra las propiedades de la selección actual, las opciones de la herramienta seleccionada o las propiedades del documento.

VISTAS DEL DOCUMENTO

 Son utilizadas para la optimización de nuestros trabajos.

1. Original: Vista predeterminada de Fireworks y la modificación de nuestros archivos.

2. Vista previa, 2 copias y 4 copias: Vista previa del diseño en diferentes formatos, en función de los ajustes del panel de Optimizar. Mientras se tenga cualquiera de estos 3, no se podrá seleccionar o cambiar objetos.

Page 5: FIREWORKS Y DREAMWEAVER

PANELES

Los paneles son controles flotantes que ayudan a modificar aspectos de elementos u objetos seleccionados en el documento.

1. El panel Optimizar: Permite gestionar el tamaño y el tipo de archivo, y trabajar con la paleta de colores del archivo o la división que vaya a exportarse.

2. El panel Capas: Organiza la estructura de un documento y contiene opciones para crear, eliminar y manipular capas.

3. El panel Biblioteca: Muestra el contenido de la carpeta Common Library, que contiene símbolos.

4. El panel Páginas: Muestra las páginas del archivo actual y contiene opciones para la manipulación de páginas.

5. El panel Fotogramas: Muestra los fotogramas del archivo actual y contiene opciones para la creación de animaciones.

6. El panel Historial: Incluye una lista de los nuevos comandos que puede deshacer y rehacer de forma rápida. El panel Formas contiene formas automáticas que no aparecen en el panel Herramientas.

7. El panel Estilos: Permite almacenar y volver a utilizar combinaciones de características de

Page 6: FIREWORKS Y DREAMWEAVER

objetos o elegir un estilo entre los almacenados.

8. El panel Biblioteca: Contiene símbolos gráficos, de botón y de animación. También es posible realizar cambios globales en ellas modificando solamente el símbolo.

9. El panel URL: Permite crear bibliotecas que contienen URL que se utilizan con frecuencia.

10. El panel Mezclador de colores: Permite crear colores nuevos y añadirlos a la paleta de colores del documento actual o aplicarlos objetos seleccionados.

11. El panel Muestras: Permite gestionar la paleta de colores del documento actual.

12. El panel Información: Proporciona datos sobre las dimensiones de los objetos seleccionados.

13. El 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.

14. El panel Buscar: Permite buscar y reemplazar elementos como texto,

URL, fuentes y colores en uno o varios documentos.

15. El panel Create Symbol Script: Automatiza la creación de archivos JavaScript para símbolos gráficos que se pueden personalizar.

16. El panel Alinear: contiene controles para alinear y distribuir objetos.

17. El panel Propiedades: Permite realizar cambios en las propiedades de una forma automática.

18. Panel Paleta de colores (en Otros): Posibilidad de 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.

19. Edición de imagen (en Otros): Organiza en un panel las herramientas y opciones utilizadas con frecuencia para la edición de mapas de bits.

20. Panel Trazado (en Otros): Ofrece acceso rápido a muchos comandos relacionados con trazados.

21. Caracteres especiales (en Otros): muestra los caracteres especiales que se pueden utilizar en bloques de texto.

Page 7: FIREWORKS Y DREAMWEAVER

¿QUÉ ES DREAMWEAVER?

Es un software basado en Adobe Flash (animación de fotogramas) que construye, desarrolla, diseña, edita sitios, videos y aplicaciones web.

BARRA DE MENÚ

Contiene las operaciones de Dreamweaver, agrupadas en menús desplegables.

Ejemplo: Insertar: Veremos las operaciones relacionadas con los diferentes elementos que se pueden insertar en Dreamweaver…

BARRA DE HERRAMIENTAS – ESTÁNDAR

Contiene iconos para ejecutar de forma inmediata algunas de las operaciones más habituales.

Page 8: FIREWORKS Y DREAMWEAVER

1. Copiar2. Cortar3. Pegar4. Abrir

5. Guardar6. Deshacer7. Rehacer8. Nuevo

BARRA DE HERRAMIENTAS DE DOCUMENTO

Contiene iconos para ejecutar de forma inmediata algunas otras operaciones habituales que no incluye la barra de herramientas estándar.

Muestra la Barra de título y operaciones como:

-Administrador de archivos - Depurador del servidor - Ayudas visuales - Validación del formato

BARRA DE ESTADO

Nos indica en cada momento en qué etiqueta HTML nos encontramos (<body>).

- Selección mano: para arrastrar la página.

- zoom : Por defecto siempre viene al 100%.

PANELES E INSPECTORES

La diferencia entre panel e inspector es que, en general, la apariencia y opciones de un inspector cambian dependiendo del objeto seleccionado.

Page 9: FIREWORKS Y DREAMWEAVER

1. Inspector de propiedades: Muestra y permite modificar las propiedades del elemento seleccionado que son usadas de forma más frecuente.

Ejemplo: Cuando el elemento seleccionado sea texto mostrará el tipo de fuente, la alineación, si está en negrita o cursiva, etc…

2. Barra de herramientas Insertar o panel de objetos: Permite insertar elementos en un documento sin la necesidad de recurrir al menú Insertar.

Los elementos están clasificados según su categoría: tablas, texto, objetos de formulario, etc.

GRACIAS.

Page 10: FIREWORKS Y DREAMWEAVER

REFERENCIAS BIBLIOGRÁFICAS…

http://karyfireworks.blogspot.com/2013/05/que-es-fireworks.html#

http://lctutorial.com/entorno-grafico-adobe-fireworks/

http://www.crearcrear.com/adobe-dreamweaver-descargable/

http://www.aulaclic.es/dreamweaver8/t_2_1.htm