Curso de macromedia flash desde cero

66
Curso de Macromedia Flash desde Cero Bienvenido/a al curso de Flash. Este curso abarca todos losconceptos básicos de Flash para aquellos que nunca han tocado laherramienta. También encontrarás trucos, consejos y formas rápidas deusar Flash para la creación de piezas interactivas para Internet. Nonecesitas ningún tipo de conocimiento previo. La versión usada en estecurso es Macromedia Flash 8. 1. Iniciando Flash 2. Descripción de las partes de Flash 3. Escenario 4. Herramientas 1. Herramienta Selección 2. Herramienta Lazo 3. Trazar Líneas 4. Dibujar con la pluma 5. Dibujar circulos y óvalos 6. Herramienta texto, filtros y efectos de texto 7. Dibujar cuadros rectángulos y polígonos. Crear símbolos. 8. Dibujar con el lápiz 9. Transformación libre 10. Herramienta Subselección 11. Transformar rellenos degradados 12. Bote de tinta 13. Cubo de pintura 14. Cuentagotas 5. Borrador 5. Línea de tiempo

description

Curso de macromedia flash desde cero

Transcript of Curso de macromedia flash desde cero

Page 1: Curso de macromedia flash desde cero

Curso de Macromedia Flash desde Cero

Bienvenido/a al curso de Flash. Este curso abarca todos losconceptos básicos de Flash para aquellos que nunca han tocado laherramienta. También encontrarás trucos, consejos y formas rápidas deusar Flash para la creación de piezas interactivas para Internet. Nonecesitas ningún tipo de conocimiento previo. La versión usada en estecurso es Macromedia Flash 8.

1. Iniciando Flash

2. Descripción de las partes de Flash

3. Escenario

4. Herramientas

1. Herramienta Selección

2. Herramienta Lazo

3. Trazar Líneas

4. Dibujar con la pluma

5. Dibujar circulos y óvalos

6. Herramienta texto, filtros y efectos de texto

7. Dibujar cuadros rectángulos y polígonos. Crear símbolos.

8. Dibujar con el lápiz

9. Transformación libre

10. Herramienta Subselección

11. Transformar rellenos degradados

12. Bote de tinta

13. Cubo de pintura

14. Cuentagotas

5. Borrador

5. Línea de tiempo

1. Trabajar con capas (Layers)

2. Fotogramas

3. Animaciones con aceleración y desaceleración

Page 2: Curso de macromedia flash desde cero

6. Escenas

7. Símbolos

8. Biblioteca (Library)

9. Colores (Color Swatches)

10. Mezclador de colores

11. Tipos de símbolos

12. Botones

13. Movie Clip (Clip de película)

14. Instancias

15. Configuración y propiedades de un FLA

16. Comportamientos (Behaviors)

17. Importar un gráfico y mezclas en bitmaps

18. Importar video

19. Accesos rápidos de teclado

1. Iniciando Flash

Al iniciar Macromedia Flash Professional 8 se muestra una pantalla que nos sugiere cómo empezar a trabajar.

La pantalla se divide en tres columnas y dos filas:

Page 3: Curso de macromedia flash desde cero

1. Open a Recent Item (Abrir un Documente Reciente)

Si hemos estado trabajando y guardado antes un documento, éste aparecerá en esta culumna.

2. Create New (Crear un nuevo documento)

* Flash document - Documento de Flash con extensión .fla.

* Flash Slide Presentation - Documento de diapositivas.

* Flash Form Application - Aplicación de un formulario.

* ActionScript File - Documento que contiene código ActionScript con extensión .as.

3. Create from Template (Crear un documento en base a una plantilla)

Vamos a comenzar

Creamos primero un nuevo documento Flash, para esto nos dirigimos hacia la segunda columna y hacemos click:

Flash nos muestra sus barras, paletas, paneles, línea de tiempo, etc.

Page 4: Curso de macromedia flash desde cero

2. Descripción de las partes de Flash

Page 5: Curso de macromedia flash desde cero

No se preocupen que cada una de las partes será explicada al detalle más adelante.

Ventana de documentos

El escenario está compuesto de varios elementos que constituyen una película.

El escenario es el área donde se representa cómo aparecerá el contenido que se publique.

La línea de tiempo, situada por encima del escenario, organiza y controla el contenido de un documento a través del tiempo en capas y fotogramas

Los paneles de Flash le ayudarán a trabajar con atributos y asignarlos al documento o a los objetos del escenario

Page 6: Curso de macromedia flash desde cero

El inspector de propiedades le permite ver y cambiar losatributos de un objeto seleccionado. El inspector de propiedades cambiapara mostrar información sobre la herramienta o elelemento con el quetrabaja, lo que permite acceder rápidamente a las funciones másutilizadas

3. Escenario

El escenario es el lugar donde se compone o diagrama el contenidode cada uno de los fotogramas que constituyen la película. Dichocontenido se crea ya sea al incluir objetos sobre él con lasHerramientas (Tools) o importando imágenes o vídeo.

Page 7: Curso de macromedia flash desde cero

En el escenario hay un círculo creado con la Herramienta de dibujo Circle (Círculo)

La cuadrícula, las guías y las reglas sirven para colocar con precisión el contenido en el escenario.

La cuadrícula

En el escenario podemos hacer uso de:

Menú >> Ver / Cuadrícula / Ver Cuadrícula

Page 8: Curso de macromedia flash desde cero

Se muestra con líneas cruzadas detrás del escenario, las cuales podemos modificar.

Para desactivar la cuadrícula del escenario, seguimos el mismo camino.

El Grid o Cuadrícula nos permitirá ubicar en forma precisa losobjetos que incluyamos al escenario. Para editar la Cuadrícula o Gridnos dirigimos hacia:

View / Grid / Edit Grid

O utilizamos las teclas rápidas:

[ Ctrl + Alt + G ]

Page 9: Curso de macromedia flash desde cero

Reglas o Rulers

Las reglas nos permiten medir el tamaño de los objetos. También nos permite arrastrar guías hacia el escenario.

View / Rulers

Las Guías

Ver / Guías / Mostrar Guías

View / Guides / Show Guides [ Ctrl + `]

Las guías nos sirven para dar una mayor exactitud de ubicación anuestros objetos en el escenario. Hacer click en alguna de las reglas yarrastrar hacia el escenario. Se verá las líneas de guías de colorverde.

Page 10: Curso de macromedia flash desde cero

ara editar las guías, presionamos las teclas rápidas:

[ Ctrl + Alt + Shift + G ]

Si deseamos borrar las guías del escenario.

Ver / Guías / Borrar guías

View / Guides / Clear Guides

4. Herramientas

Las herramientas o tools de Flash nos permitirán manipular y hacer cambios a nuestros objetos dentro del escenario.

Podemos encontrarlo en la barra de menú:

Ventana / Herramientas

Window / Tools

Con las teclas rápidas [Ctrl+F2] podemos visualizar u ocultar las herramientas.

Page 11: Curso de macromedia flash desde cero

Las Herramientas o Tools se dividen en cuatro partes:

1. Herramientas (Tools)

Con las herramientas podremos seleccionar objetos, dibujarlos, cambiar sus colores, borrarlos e insertar textos.

2. Vista (View)

Movemos el escenario con el cursor, o incrementamos la vista al escenario.

3. Colores (Colors)

Cambiamos los colores del relleno o borde de los gráficos.

4. Opciones (Options)

Cada Herramienta tiene opciones de modificaciones.

Descripción de las Herramientas o Tools con sus Teclas rápidas

Page 12: Curso de macromedia flash desde cero

Para acceder a cualquiera de las herramientas se puede presionar las teclas rápidas. Por ejemplo, para comenzar a dibujar una línea presionamos la tecla N. Para seleccionar la línea presionamos la tecla V y seleccionamos haciendo click sobre él.

4.1 Herramienta Selección

Ubicamos en la caja de Herramientas (Tools) la herramienta

Selección con el mouse o presionamos la letra (V)

Page 13: Curso de macromedia flash desde cero

Podemos seleccionar un objeto de varias formas, la siguiente es una de ellas:

Nos ubicamos sobre uno de los extremos del objeto, tecleamos (V) ypresionando el click izquierdo del mouse (1) comenzamos a arrastrar (2)basta el extremo diametralmente opuesto (3) y soltamos el click delmouse (4)

Para agrupar el gráfico:

Page 14: Curso de macromedia flash desde cero

• Seleccionamos el gráfico, luego presionamos las teclas Ctrl + G, entonces se agrupará la línea de borde del objeto y el relleno del mismo.

Para desagrupar el objeto:

• Seleccionamos el gráfico, luego presionamos las teclas Ctrl + Shift + G, de esta forma se desagruparán la línea de borde y el relleno del objeto.

Al dibujar cualquier gráfico como un rectángulo, éste tiene líneade borde y relleno. Y si queremos moverlo tenemos que agruparlo antes. De lo contrario, resultaría de esta forma:

Se separan la línea de borde con el relleno, haciendo tal vez lo que no deseábamos

Y si movemos una vez mas después de seleccionar resulta otro gráfico que tal vez no queríamos que se produzca.

Page 15: Curso de macromedia flash desde cero

Seleccionando un gráfico con líneas conectadas o el borde de un objeto.

Presionamos la tecla (V) y luego doble click sobre el borde del gráfico.

Seleccionando un gráfico, relleno y borde.

Presionamos la tecla (V) y luego doble click sobre el relleno.

Nota: Si estamos trabajando con otra herramienta, ydeseamos utilizar de forma temporal la herramienta de selección,entonces presionamos la tecla Ctrl.

4.2 Herramienta Lazo

Seleccionamos en la caja de Herramientas (Tools) la herramienta

Lazo o Lasso Tool con el mouse o presionamos la letra (L)

Podemos seleccionar un sector del objeto en forma de mano alzada y realizamos por ejemplo el cambio de color, podemos borrar ese sector, girarlo, desplazarlo, etc.

Page 16: Curso de macromedia flash desde cero

4.2 Herramienta Linea

Seleccionamos en la caja de Herramientas (Tools) la herramienta

Línea con el mouse o tecleamos la letra (N)

Aparecerán en el panel de propiedades (Properties) opciones para modificar la forma, el grosor y el color.

Page 17: Curso de macromedia flash desde cero

Automáticamente al seleccionar la Herramienta Línea, aparece el Inspector Propiedades:

Al dibujar la línea el Inspector de propiedades cambia a esta forma:

Page 18: Curso de macromedia flash desde cero

Nota: Presionando la tecla [Shift] y arrastrando el cursor del mouse podemos hacer líneas rectas o 45º:

Nota: Al presionar la tecla [Alt] y arrastrando el cursor del mouse, se alargará la línea simétricamente:

Podemos hacer gráficos de acuerdo a nuestros requerimientos. Por ejemplo si queremos hacer un triángulo de forma rápida:

1. Presionamos la tecla (N) Escogemos de la barra de herramientas.

2 Manteniendo presionada la tecla [Shift] dibujamos la primera y segunda línea.

3 Dejamos de presionar la tecla [Shift], y cerramos el triángulo

Page 19: Curso de macromedia flash desde cero

Para cambiar de forma a una línea tenemos dos formas:

Sin seleccionar la línea, pasamos el cursor junto a la línea, hasta que nos muestre lo siguiente:

Y podemos darle curva:

Sin seleccionar la línea asamos el cursor por ésta y aparece:

Movemos el extremo de la línea.

Page 20: Curso de macromedia flash desde cero

Soltamos el botón del mouse.

4.4 Dibujar con la pluma

Seleccionamos en la caja de Herramientas (Tools) la Herramienta

Pluma o Pen Tool con el mouse o tecleamos la letra (P)

Nos permitirá dibujar punto por punto, haciendo click en el escenario, también podemos darle curva a nuestro dibujo. En la barra de propiedades podemos modificar las esquinas, el color de la línea que dibujemos con esta herramienta. La línea puede tener un grosor máximo de 200 puntos.

El color de la línea puede ser fijo o degradado. Al estar dibujando podemos cambiar las propiedades según nuestro parecer.

Podemos dibujar libremente. La diferencia de la Herramienta Pluma con la Herramienta Línea es que tendremos puntos de conducción, que nos permitirá hacer curvas más pronunciadas, además de añadir más puntos de anclaje o nodos.

Page 21: Curso de macromedia flash desde cero

Dibujando objetos gráficos o símbolo gráfico.

Al seleccionar el ícono que ven a la derecha, lo que se dibuje enel escenario se convierte automáticamente en objeto...gráfico. (Ver abajo)

4.5 Dibujar circulos y óvalos

Page 22: Curso de macromedia flash desde cero

Seleccionamos en la caja de Herramientas (Tools) la herramienta

Círculo o Circle (Imágen Herramienta de Círculos) con el mouse o tecleamos la letra (O)

Dibujamos la figura.

Al pasar el cursor cerca de la circunferencia se puede modificar la forma del círculo.

Page 23: Curso de macromedia flash desde cero

Aparecerá el Inspector de Propiedades (Properties) en el cual podemos modificar el grosor del círculo, la forma de la línea y el color

Nota: Manteniendo presionada la tecla Shift podemos hacer círculos, además presionando la tecla Alt, podremos hacer óvalos alargando por un extremo. Manteniendo pulsadas las teclas Shift+Alt podremos hacerlos con el centro en donde esté situado el puntero en ese instante.

Creamos una circunferencia, pero utilizamos la opción Objeto Gráfico.

Page 24: Curso de macromedia flash desde cero

Con esto ya no tendremos problemas de afectar a las demás figuras al desplazarlos.

4.6 Herramienta texto, filtros y efectos de texto

Seleccionamos en la caja de Herramientas (Tools) la Herramienta Texto con el mouse o presionamos la letra (T)

Page 25: Curso de macromedia flash desde cero

Aparecerá la Caja de Propiedades (Properties), en el cual podemos agregar características del texto que necesitamos.

Existen tres tipos de texto:

* Static Text (Texto estático):

Este tipo de dato es tradicional, se le asigna cualquier tipo deformato. Al ser seleccionado el texto estático se ve rodeado por uncontorno azul.

* Dynamic Text (texto dinámico):

Este tipo de dato cambia conforme se le asignen nuevos valores asu variable. Al no ser seleccionado el texto dinámico se nota uncontorno punteado.

* Input Text (Introducción de texto):

Se les conoce como cajas de texto, se introducen datos en él para que sean procesados después.

A los textos dinámicos e introducción de texto se les permite agregar nombres de instancia.

El panel Inspector de Propiedades de la Herramienta Texto.

Page 26: Curso de macromedia flash desde cero

Texto Estático o Static Text

Tipografía:

Cambiamos el Tipo de Fuente. Por ejemplo: Times

New Roman

Tamaño de Fuente:

Por ejemplo: 8 puntos

Color de Fuente:

Teclas rápidas:

Page 27: Curso de macromedia flash desde cero

* [Ctrl + Shift + P] Plain, plano o normal.

* [Ctrl + Shift + B] Bold o negrita.

* [Ctrl + Shift + I] Italic o cursiva.

Alineación:

Hay cuatro opciones: Alineación a la izquierda por defecto, centro, derecha y justificado.

Opciones de formato:

- Indent (sangría) - Line spacing (Espacio entre líneas)

Ejemplo:

Separación de caracteres:

Page 28: Curso de macromedia flash desde cero

Posición del caracter:

Posición del caracter: - Normal. - Superscript o superíndice. –

Subscript o subíndic

Método de Renderización de Fuente:

Sobre FlashType:

FlashType es un nuevo texto renderizado que proporciona textoclaro, de calidad superior queda en la composición de Flash y en losarchivos de SWF publicados. FlashType mejora la legibilidad de textograndemente, particularmente cuando se da a los tamaños de la fuentemás pequeños. El anti-aliasing personalizado le permite especificar elespesor y agudeza de fuentes usadas en los campos del textoindividuales.

Usando FlashType pueden causar un retraso ligero cuando Flash cargalos archivos de SWF. Usted notará este retraso sobre todo si estáusando varios carácteres diferentes por ejemplo si pone (cuatro ocinco) dentro del primer fotograma de un documento de Flash. Hay queestar seguros del número de fuentes que usamos

Page 29: Curso de macromedia flash desde cero

con este método. Lasfuentes FlashType también pueden causar un aumento en el uso de memoriadel Player de Flash. Por ejemplo, usando cuatro o cinco fuentes puedenaumentar el uso de memoria por aproximadamente 4 MB.

Use Device Fonts:

Usando las fuentes de dispositivo.

Bit Map (No Anti-alias):

El Texto de Bitmap o mapa de bits apaga el Anti-Alias y noproporciona ningún alisamiento al texto. El texto que usa los bordesafilados se despliega, y los SWF resultantes aumenta de tamaño porquelos contornos de la fuente son incluidos en el SWF.

Anti-Alias:

Anti-aliasing es permitido para el Texto Estático, TextoDinámico y Texto de Entrada, si el usuario tiene Flash Player 7 ósuperior. Sólo se permite para el Texto estático si el usuario tieneuna versión más actual de Flash Player.

Anti-alias para la Animación o Anti-Alias for Animation creauna animación de texto más lisa. Esto es en parte posible porque Flashignora alineación e información del ajuste de espacio. EspecificandoAnti-alias para la Animación crea un archivo SWF más grande, porque loscontornos de la fuente son incluidos.

Fuentes dadas usando Anti-alias para la Animación están menoslegibles en los tamaños de la fuente más pequeños. por esta razón, serecomienda que usted use 10 punto o el tipo más grande al especificarAnti-alias para la Animación.

Page 30: Curso de macromedia flash desde cero

Anti-alias para la Legibilidad o Anti-Alias for Readabilityusa un nuevo artefacto del antialiasing que mejora la legibilidad defuentes, particularmente a los tamaños pequeños. EspecificandoAnti-alias para la Legibilidad crea un archivo SWF más grande, porquelos contornos de la fuente son incluidos. Para usar el Anti-alias parala Legibilidad se debe publicar

para Flash Player 8.

Anti-alias para la Legibilidad crea fuentes muy legibles para lostamaños pequeños. Sin embargo, anima pobremente, y puede causarproblemas de actuación. Si usted piensa animar el texto, use Anti-aliaspara la Animación.

Personalizado Anti-alias o Custom Anti-Aliasing (Sólo desdeFlash Professional 8) nos permite modificar las propiedades de lafuente. Las propiedades del anti-alias personalizadas son como sigue:

# La Agudeza o Sharpness determina la suavidad de la transición entre las esquinas del texto y el fondo.

# El espesor o Thickness determina cuan grueso es la fuenteanti-aliasing que aparece. Los valores más grandes de los caractereshará parecer más gruesos.

Especificando Personalizado Anti-alias o Custum Anti-Alias crea unarchivo SWF más grande, porque los contornos de la fuente sonincluidos.

Page 31: Curso de macromedia flash desde cero

Tamaño del objeto y coordenadas del texto en el escenario.

* W: Ancho

* H: Altura

* X: Posición con respecto a x en el escenario.

* Y: Posición con respecto a y en el escenario.

Hipervínculo:

En esta casilla escribimos un hipervínculo o URL. Es decir vincula el texto hacia una URL.

Además nos muestra opciones Destino o Target:

* _blank: Se muestra en una nueva página HTML.

* _parent: Se muestra la página principal HTML.

* _self: Se muestra en la misma página HTML.

* _root: Se muestra en la raíz de todo el HTML.

Seleccionable o Selectable:

Se puede seleccionar el texto estático en la película SWF o en Internet Explorer.

Page 32: Curso de macromedia flash desde cero

Filtros y efectos de texto

Estando en la Herramienta Texto, seleccionamos Texto Estático. Y vemos que existen los Paneles: Inspector Propiedades, Filtros y Parámetros.

Estando seleccionado el texto "Macromedia" En el Panel Filtros oFilters hacemos click sobre el icono , y nos aparece un menú contextualcon varias opciones.

Drop Shadow

Automáticamente nos muestra propiedades del filtro que podemos cambiar.

Page 33: Curso de macromedia flash desde cero

* Blur X, Y: Desvanecimiento de la sombra.

* Strength: Porcentaje de la sombra.

* Quality: Baja, Media y Alta.

* Color: Color de la sombra.

* Angle: Ángulo de la proyección de la sombra.

* Distance: Distancia de la sombra.

* Knockout: Nos muestra el texto en blanco con la sombra.

* Inner shadow: Sombra interior.

* Hide Object: Escondemos el objeto texto, sólo muestra la sombra.

Para dejar de ver el filtro por un momento podemos hacer clicksobre el símbolo de visto bueno. Aparecerá al lado del filtro el signode X.

Para agregar un filtro:

Para eliminar un filtro:

Blur

Page 34: Curso de macromedia flash desde cero

Glow

Al hacer click sobre la casilla de Knockout, aparece el texto en blanco.

Al hacer click sobre la casilla de Knockout e inner glow, aparece el texto en blanco pero la sombra es interior.

Page 35: Curso de macromedia flash desde cero

Bevel

Este efecto es muy bueno. Con las anteriores versiones de Flashteníamos que hacer este efecto con otros programas como (PhotoShop,Corel, etc.)

* Type: El efecto se verá en Inner o interior, Outer o exterior y Full o completo.

* Shadow: Color de sombra

* Highlight: Color de brillo.

Gradient Glow

Adjust Color

Page 36: Curso de macromedia flash desde cero

O Ajuste de Color:

* Brightness: Brillo

* Contrast: Contraste

* Saturation: Saturación

* Hue: Color

* Reset: Reinicia

Texto Dinámico o Dynamic Text

Un texto dinámico cambia conforme se le asignen nuevos valores a su variable. Al ser seleccionado el texto dinámico se nota un contorno punteado.

Page 37: Curso de macromedia flash desde cero

Botón Embed, opciones de caracter:

odemos seleccionar un grupo de caracteres que deseamos restringir en nuestra película.

También podemos incluir un grupo de caracteres que sólo utilizaránuestro texto dinámico en la película, es decir, podemos ver en elescenario otros caracteres pero no en el SWF, excepto los caracteresque hemos restringido.

Ejemplo: Escribimos en Include these characters, el siguiente texto "Números reales"; y en el escenario la frase "Texto dinámico con la opción Restringir" El resultado al presionar las teclas rápidas [Ctrl + Enter] que nos lleva a la película SWF sería:

Page 38: Curso de macromedia flash desde cero

Nota: Los filtros de Texto estático son iguales al del Texto dinámico. Revisar las páginas anteriores para ver la similitud.

Texto de entrada o Input Text (Introducción de texto)

Son cajas de textos, donde se introducen datos en él para que sean procesados después. A los Textos Dinámicos e Introducción de Texto se les permite agregar nombres de instancia.

En el Inspector de Propiedades aumenta una casilla Maximumcharacters o Máximo de caracteres a ingresar. Y no se encuentra la casilla Vínculo URL.

veremos más adelante como se utiliza cada unp de estos tipos de textos.

Nota: Los filtros de Texto estático, Texto Dinámico son iguales al del Introducción de Texto. Revisar las páginas anteriores para ver la similitud.

4.7 Dibujar cuadros rectángulos y polígonos. Crear símbolos.

Seleccionamos en la caja de Herramientas (Tools) la herramienta Rectángulo o polígono con el mouse o tecleamos la letra (R)

Page 39: Curso de macromedia flash desde cero

Aparecerá el Inspector de Propiedades (Properties) en el cual podemos modificar el grosor del cuadrado, rectángulo o polígono, la forma de la la línea y los colores.

Cap:

Usamos para definir las esquinas del gráfico.

Page 40: Curso de macromedia flash desde cero

La unión de los extremos del gráfico.

Al seleccionarlo podremos darle un radio (en puntos) a las esquinas del rectángulo

Ejemplo:

Con el botón Opciones (Options) se puede agregar el número de lados que necesitamos para nuestro polígono.

Page 41: Curso de macromedia flash desde cero

Ejemplo:

Convertir vectores a simbolos

Al convertir un gráfico a Botón o Clip de Película, podemos realizar maravillas.

1. Dibujamos una estrella.

2. Presionamos [F8] para convertir el gráfico a Botón.

3. Nos dirigimos hacia el panel Filters o Filtros.

Page 42: Curso de macromedia flash desde cero

4. Añadimos el efecto Bevel o ángulo oblículo.

Añadimos una luz degradada o Gradient Glow.

El resultado:

En las versiones anteriores era todo un trámite burocrático hacerestos efectos. Antes se realizaba con otros programas, estos efectospara añadirlo después en el escenario Flash.

4.8 Dibujar con el lápiz

Seleccionamos en la caja de Herramientas (Tools) la herramienta Lápiz con el mouse o tecleamos la letra (Y)

Page 43: Curso de macromedia flash desde cero

Aparecerá la Caja de Propiedades (Properties) en el cual podemos modificar el grosor del lápiz, la forma y el color.

* Opción Straighten (Enderezar) que nos permite convertir a figuras parecidas a los triángulos, óvalos, círculos, rectángulos, cuadrados * Opción Smooth (Suavizar) para que suavice los trazos que hagamos * Opción Ink (Tinta) es para dibujar libremente a manoalzada. Utilizando la tecla [Shift] nos permite hacer trazos verticalesy horizontales.

Ejemplo:

Page 44: Curso de macromedia flash desde cero

4.9 Transformación libre

Seleccionamos la caja de Herramientas (Tools) la herramienta Transformación Libre con el mouse o tecleamos la letra (Q)

Pasos:

Page 45: Curso de macromedia flash desde cero

Con las opciones de Transformación Libre encontramos los botones:

* Rotate o Screw: Rotar y atornillar, cambiar la forma del cuadrado por uno de sus extremos.

* Scale: Escala, cambiamos el tamaño en forma escalar, es igual que utilizar la tecla [Shift] y el mouse.

* Distort: Distorsionar la forma del cuadrado.

* Envelope: El sobre, cambia la forma en base a los nodos que se forman alrededor del cuadrado.

Utilizando la opción Envelope o Sobre, cambiamos la forma del cuadrado.

10. Herramienta Subselección

Page 46: Curso de macromedia flash desde cero

Seleccionamos la caja de herramientas, la herramienta subselección con el mouse o tecleamos la letra A.

Esto nos sirve para seleccionar y transformar los objetos a través de sus nodos.

Para verlo más facil, podemos hacer una línea. Seleccionamos la línea.

Page 47: Curso de macromedia flash desde cero

Escogemos uno de los extremos de la línea y lo arrastramos hacia abajo.

Con esta herramienta podemos variar la forma o corregir algunos detalles de nuestro diseño.

4.11 Transformar rellenos degradados

Seleccionamos en la caja de Herramientas (Tools) la herramienta Transformar

Relleno Transformar Relleno con el mouse o tecleamos la letra (F)

Podremos cambiar la ubicación del punto central.

Ejm: Hacemos un rectángulo.

Page 48: Curso de macromedia flash desde cero

Nos vamos a la caja de Colores (Colors) Y escogemos el color de relleno

En la parte de abajo encontramos los rellenos degradados.

Cambiamos el relleno a un color degradado (de negro hacia blanco en el centro)

Seleccionamos la opción Transformación de relleno y podremos modificar el punto central.

En la figura encontramos un icono que es un triángulo con la punta hacia abajo que nos indica el punto central del degradado, el cual podemos mover de lugar.

Page 49: Curso de macromedia flash desde cero

También se puede mover la dirección angular del degradado.

4.12 Bote de tinta

Seleccionamos en la Caja de Herramientas (Tools) la herramienta Bote de tinta o Ink Bottle Tool con el mouse, o tecleamos la letra (S)

Aparecerá la Caja de Propiedades (Properties) sobre el cual podemos modificar el grosor del lápiz, la forma y el color.

Primero debemos modificar el color, la forma o el grosor de la línea, luego tecleamos la letra (S) seleccionando el gráfico, y podemos ver

Page 50: Curso de macromedia flash desde cero

las modificaciones.

Ejemplo: Dibujamos un círculo, un cuadrado y una estrella.

La herramienta Bote de tinta permite cambiar el color, el grosor y el estilo de trazo de las líneas o los contornos de formas. Puede aplicar únicamente colores sólidos, pero no degradados ni mapas debits, a las líneas y los contornos de formas.

Utilizar la herramienta Bote de tinta en lugar de seleccionar cada una de las líneas. Facilita la modificación de los atributos de trazo de varios objetos de una sola vez.

Modificamos el color de los contornos, y sin seleccionar ninguno delos gráficos, con el mouse hacemos click sobre ellos y el contorno cambia de color.

4.13 Cubo de pintura

Seleccionamos en la caja de herramientas (Tools) la herramienta Cubo de pintura Cubo de pintura con el mouse o tecleamos la letra (K)

Page 51: Curso de macromedia flash desde cero

Aparecerá la Caja de Propiedades (Porperties) sobre el cual podemos modificar el color de relleno del gráfico.

Algunas opciones de la herramienta Cubo de pintura rellenan áreas que no están cerradas por completo.

Page 52: Curso de macromedia flash desde cero

Con la herramienta Cubo de pintura hacemos click sobre el área de la circunferencia incompleta, y se rellena.

4.14 Cuentagotas

Seleccionamos en la caja de Herramientas (Tools) la herramienta Cuentagotas (Eyedropper Tool) con el mouse o tecleamos la letra (I) Nos permite copiar atributos del borde o relleno del gráfico, que podremos utilizar para copiarlos a otros gráficos.

4.15 Borrador

Seleccionamos en la caja de Herramientas (Tools) la herramienta Borrador con el mouse o tecleamos la letra (E) Este herramienta nos permite borrar bordes y rellenos.

Las opciones nos permiten borrar:

* Erase normal: Borra borde y relleno.

Page 53: Curso de macromedia flash desde cero

* Erase Fills: Borra relleno solamente.

* Erase Lines: Borra bordes solamente.

* Erase Selected Fills: Borra rellenos seleccionados solamente.

* Erase inside: Borra el relleno solamente de un gráfico.

Nota: Da doble click sobre el Borrador para borrar lo que está en el escenario de una forma rápida.

Grifo (Faucet) : Al seleccionar este opción podremos borrar la línea o el relleno dando click sobre él.

6 Línea de tiempo

La línea de tiempo (Time Line) está constituida por Capas y Fotogramas. Las capas se encuentran al lado izquierdo de la línea de tiempo, y los fotogramas al lado derecho. En ellos se visualiza la construcción delas películas.

Page 54: Curso de macromedia flash desde cero

También está constituido por la Cabeza lectora, cuya función principal es la de señalar en el escenario el fotograma actual

Biblioteca (Library)

Todos los símbolos, archivos de audio, fotos, sonidos y componentes de Flash, se encuentran en la biblioteca.

Flash tiene la particularidad de compartir símbolos y objetos utilizados en otros documentos.

* Para abrir la biblioteca de otro documento que ya ha sido creado. Una de las formas es abrir el documento nuevo y grabamos con el nombre Biblioteca_Destino verás que automáticamente al presionar [Ctrl+L] la biblioteca se llama Biblioteca_Destino. Ahora, abrimos el otro que contiene la biblioteca con los símbolos que supondremos

Page 55: Curso de macromedia flash desde cero

se llame Biblioteca_Origen.

* Para movernos de documento en documento hacemos [Ctrl+Tab]

* En ambos documentos abrimos las bibliotecas [Ctrl+L]

* Simplemente de la biblioteca_origen arrastramos los símbolos o fólderes que queremos hacia la biblioteca_destino y ya está

La biblioteca está formada por dos paneles. La parte de arriba es la vista previa del símbolo que seleccionamos. El segundo, es la lista de los símbolos o folderes que contienen más símbolos.

Menú de la biblioteca

* New Symbol: Permite crear un símbolo nuevo vacío.

* New folder: Los fólderes son usados para administrar y organizar los símbolos y objetos que se encuentran dentro de la biblioteca o librería.

* New Font: Permite crear un símbolo de texto nuevo vacío.

Page 56: Curso de macromedia flash desde cero

* New Video: Permite crear un video vacío.

* Properties: Permite cambiar las propiedades de los símbolos.

* Delete: Elimina uno o varios símbolos seleccionados.

10. Colores (Color Swatches)

Cada archivo Flash contiene su propia paleta de colores, almacenada en el documento de Flash. Flash muestra la paleta de un archivo como muestras en los controles Color de relleno y Color del trazo y en el panel Muestras de color. La paleta predeterminada de colores es la paleta de 216 colores WebSafe. Para importar, exportar y modificar la paleta de colores de un archivo, utilice el panel Muestras de color. Puede duplicar colores, eliminar los de la paleta, cambiar la paleta predeterminada, volver a cargar la paleta WebSafe si la ha sustituido o bien ordenar la paleta de acuerdo con la matiz.

Presionando las teclas rápidas [Ctrl+F9] veremos el panel Muestras de color (Color Swatches)

Tipos de símbolos

Cada símbolo posee una Línea de Tiempo y un escenario exclusivos que incluyen capas. Al crear un símbolo, se elige el tipo de símbolo en función de cómo se desea utilizar dicho símbolo en el documento.

Se utiliza símbolos Gráficos (Graphics)para las imágenes estáticas y para crear animaciones reutilizables ligadas a la línea de tiempo principal. Los símbolos gráficos funcionan de manera sincronizada con la línea de tiempo principal. Los controles y sonidos interactivos no funcionan en la secuencia de animación de un símbolo gráfico.

Page 57: Curso de macromedia flash desde cero

Se utiliza símbolos de Botón (Button) para crear botones interactivos que respondan a las pulsaciones y desplazamientos del ratón, o a otras acciones a una instancia del botón.

Se utiliza símbolos de Clip de Película (Movie Clip) para crear piezas de animación reutilizables. Los clips de película tienen sus propias líneas de tiempo de varios fotogramas, independientes de la línea de tiempo principal. Se encuentran dentro de una línea de tiempo principal que contiene elementos interactivos como controles, sonidos e incluso otras instancias de clip de película. También pueden colocarse instancias de clip de película dentro de la línea de tiempo de un símbolo para crear botones animados.

Botones

os botones son clips de película interactivos de cuatro fotogramas, los cuales sirven para activar eventos que deseamos ejecutar.

Un botón es un símbolo, que en su línea de tiempo tiene cuatro fotogramas, que son:

* Reposo (Up): cuando el untero no está sobre él. * Sobre (Over): cuando el puntero se encuentra sobre el botón. * Presionado (Press): cuando se hace click con el ratón sobre el botón. * Zona Activa (Hit): Define el área que responderá al click del ratón. Esta área es invisible en la película. Si no se especifica un fotograma "Zona Activa" Flash tomará la imagen para el estado "Reposo" como fotograma de Zona Activa.

Para crear un botón se utilizan las teclas [ Ctrl + F8 ]

Page 58: Curso de macromedia flash desde cero

Si se desea activar cualquier fotograma del botón, se debe insertar fotograma clave para cada opción.

Crear un botón

1) Edición / Anular selección [ Ctrl + Shift + A ]

Para asegurarnos de no seleccionar nada en el escenario.

2) Insertar / Nuevo símbolo [ Ctrl + F8 ]

Ingresamos un nombre, por ejem.: Boton_1. Y en el comportamiento seleccionamos Botón.

3) Dibujamos el tipo de botón que deseamos, por ejemplo, un óvalo con degradado.

Page 59: Curso de macromedia flash desde cero

4) Clickeamos [ F6 ] en el fotograma "Sobre" y cambiamos el color del degradado a un color fijo.

5) Clickeamos [ F6 ] en el fotograma "Presionado", y cambiamos el relleno del ovalo.

6) Para verificar, regresamos a escenario. Ahora este botón es un símbolo, se encuentra en la Biblioteca o Librería, donde lo activamos con [ Ctrl + L ]

Page 60: Curso de macromedia flash desde cero

7) Sólo nos queda llevarlo al escenario arrastrando del la Biblioteca hacia el escenario.

Para habilitar o deshabilitar botones simples en el mismo escenario presionamos [Ctrl+Alt+B] o nos dirigimos hacia el menú: Control / Habilitar botones simples.

8) Para agregar Zona Activa, estando en el escenario damos click dos veces sobre el botón, el cual nos llevará hacia los fotogramas de estado del botón.

Damos click [F6] sobre el fotograma Zona Activa, dibujamos un rectángulo al costado del óvalo.

Page 61: Curso de macromedia flash desde cero

Al ejecutar, dirigirnos hacia el escenario. Presionamos [Ctrl+Alt+B] Veremos que se activa también el botón sobre el rectángulo invisible.

14. Movie Clip (Clip de película)

Se utiliza símbolos de Clip de Película (Movie Clip) para crear piezas de animación reutilizables. Los clips de película tienen sus propias líneas de tiempo de varios fotogramas, independientes de la línea de tiempo principal.

Presionamos la tecla rápida [F8] para Convertir a Símbolo y seleccionamos Movie Clip.

Al seleccionar el Modo Avanzado (Advanced) se despliega la pantallacon las casillas de selección. Nos indica la casilla Export forActionScript si requerimos exportar para ActionScript, exportar en el primer fotograma, etc. Registration: Ubicamos el nodo central de nuestro Movie Clip.