Práctica de Complementación
PERUCHIPsiglo21 MACROMEDIA FLASH 8 Flash es una herramienta de edición con la que los diseñadores y desarrolladores pueden crear presentaciones, aplicaciones y otro tipo de contenido que permite la interacción del usuario. Los proyectos de Flash pueden abarcar desde simples animaciones hasta contenido de vídeo, presentaciones complejas, aplicaciones y cualquier otra utilidad relacionada. En general, los fragmentos independientes de contenido creados con Flash se denominan aplicaciones, aunque se trate solamente de una animación básica. Se pueden crear aplicaciones de Flash con una amplia variedad de contenido multimedia que incluye imágenes, sonido, vídeo y efectos especiales. Dado el tamaño tan pequeño de sus archivos, Flash resulta especialmente ideal para crear contenido que se facilite a través de Internet. Para ello, utiliza en gran medida gráficos vectoriales. Este tipo de gráfico requiere mucha menos memoria y espacio de almacenamiento que las imágenes de mapa de bits, ya que se representan mediante fórmulas matemáticas en lugar de grandes conjuntos de datos. Las imágenes de mapa de bits son de un tamaño superior porque cada píxel requiere un fragmento de datos independiente que lo represente. Para crear una aplicación en Flash, se crean gráficos con las herramientas de dibujo y se importan elementos multimedia adicionales al documento de Flash. A continuación, se determina cómo y cuándo se utilizarán cada uno de esos elementos para crear la aplicación que se tiene en mente. Cuando se edita contenido en Flash, se trabaja en un archivo de documento de Flash. Estos documentos tienen la extensión de archivo .fla (FLA) y se componen de cuatro partes principales: •
El escenario es donde se muestran los gráficos, vídeos, botones y demás objetos durante la reproducción.
•
La línea de tiempo es donde el usuario indica a Flash cuándo desea que se muestren los gráficos y otros elementos del proyecto. También se utiliza para especificar el orden de capas de los gráficos en el escenario. Los gráficos de las capas superiores aparecen por encima de los gráficos de las capas inferiores.
•
El panel Biblioteca es donde Flash muestra una lista de los elementos multimedia del documento de Flash.
•
ActionScript es el código que permite añadir interactividad a los elementos multimedia del documento. Por ejemplo, se puede añadir código para que un botón muestre una nueva imagen cuando el usuario haga clic en el mismo. También se puede utilizar ActionScript para añadir lógica a las aplicaciones. Gracias a la lógica, la aplicación se comporta de distintas formas dependiendo de las acciones del usuario u otras condiciones. Flash incluye dos versiones de ActionScript, cada una adaptada a las necesidades específicas del editor. Para más información sobre la escritura de ActionScript, consulte Aprendizaje de ActionScript 2.0 en Flash en el panel Ayuda.
Flash incluye muchas funciones que la convierten en una herramienta con numerosas prestaciones sin perder por ello la facilidad de uso. Entre dichas funciones destacan la posibilidad de arrastrar y soltar componentes de la interfaz de usuario creados previamente, comportamientos integrados que permiten añadir fácilmente código ActionScript al documento y varios efectos especiales que pueden incorporarse a los objetos multimedia. Una vez que se ha terminado de editar el documento de Flash, se puede publicar a través del comando Archivo > Publicar. De este modo, se crea una versión comprimida del archivo con la extensión .swf (SWF). A continuación, se puede utilizar Flash Player para reproducir el archivo SWF en un navegador Web o como una aplicación independiente. Para obtener una introducción a Flash Player, consulte Flash Player. ENTORNO DE TRABAJO Al iniciar el programa aparece en el centro de la pantalla una ventana de bienvenida. Esta ventana siempre va a aparecer al iniciar el programa. Ofrece información sobre el programa y posibilidades de inicio ya predeterminadas.
Prof.: Himmer Oliver Peralta Luque
Práctica de Complementación
PERUCHIPsiglo21
Pero la interfaz de Flash sólo se activa al abrir un documento:
Si has usado antes versiones anteriores de Flash, u otros programas de la casa Macromedia (Dreamweaver, Fireworks, etc.), verás que la organización de la ventana de trabajo es muy parecida: en barras y paneles alrededor del área de trabajo. Todas estas partes, que ahora vamos ver rápidamente, las iremos utilizando a lo largo del curso repetidamente. Así que no te preocupes si ahora te abruman... al trabajar con ellas nos iremos familiarizando más. BARRA DE TITULO La barra de títulos de Macromedia flash se encuentra por encima de la ventana, en el se muestra primeramente el icono de Macromedia, seguido luego por el nombre del programa (que por defecto es Macromedia flash 8), luego el nombre del documento y mas a la derecha se visualizan los botones de control (minimizar, maximizar o restaurar y el botón cerrar). BARRA DE MENÚS. Como en cualquier otro programa, en la parte superior de la pantalla se desarrolla la Barra de Menús:
•
ARCHIVO: Junto con el menú de Edición, es un menú común en cualquier programa. Nos permite manejar el flujo de trabajo con los diferentes archivos. Desde menú abriremos los documentos de trabajo, los guardaremos y los publicaremos.
Prof.: Himmer Oliver Peralta Luque
Práctica de Complementación
PERUCHIPsiglo21 • • • • • • • • •
EDICIÓN: Al igual que en otros programas, desde este menú podremos realizar acciones de gestión y desplazamiento (Copiar, Cortar, Pegar...). VER: Se facilita el trabajo en la creación de una película Flash desde el punto de vista de cómo ver el área de trabajo. Incluye las opciones de ayuda al dibujo, como son las Reglas o la Cuadrícula. INSERTAR: hace referencia a todos los componentes que se pueden ir incluyendo en una película Flash; desde los símbolos, los fotogramas con diferentes cualidades o las escenas de que se compone la película final (es uno de los más usados). MODIFICAR: Desde este menú podremos alterar cualquier componente de la película... incluso la película en sí misma(es uno de los más usados). TEXTO: Nos permitirá controlar los diversos atributos aplicados al texto (no lo usaremos mucho). COMANDOS: Este nuevo menú administra la ejecución de acciones preprogramadas llamadas comandos. (En este curso no lo usaremos). CONTROL: Rige la reproducción de la animación. Más que este menú usaremos la barra de herramientas de mismo nombre que veremos más adelante. VENTANA: Este menú gobierna la visualización y organización de toda la interfaz del programa. Desde aquí puedes visualizar y ocultar cualquier panel o barra de herramientas que desees. AYUDA: Como cualquier otro por grama flash incluye un menú de ayuda. Al contrario de lo que ocurre en otros programas, la ayuda de Flash es realmente una ayuda muy útil cuando estamos perdidos o queremos introducirnos en el conocimiento de alguna parcela del programa.
BARRA DE HERRAMIENTAS 1- Panel y barras de herramientas Una de las partes más importantes de Flash es el panel de Herramientas (Ventana>Herramientas). Dentro de este Panel las herramientas se organizan por grupos: 1. El primer grupo nos ofrece las diferentes herramientas básicas con que contamos para crear y modificar cualquier dibujo en el área de trabajo. En este caso se ve activada la herramienta de Selección y Movimiento (esquina superior izquierda). 2. Éstas son las herramientas (ver) de ayuda para la visualización del área de trabajo 3. Éste grupo colores es el controlador de color de Flash. Dividido en el color de Contorno y de Relleno. Muy similar al de otros programas vectoriales como Freehand. 4. Al final del panel aparecerán las opciones de la herramienta que tengamos activada. En este caso las opciones de la herramienta de Selección y Movimiento.
Prof.: Himmer Oliver Peralta Luque
Práctica de Complementación
PERUCHIPsiglo21 Para utilizar cualquiera de las herramientas del panel seguiremos los pasos siguientes: • •
Picamos en la herramienta que queremos utilizar o bien tecleamos el carácter del teclado de la herramienta. Movemos el cursor a la escena y utilizamos la herramienta.
A parte de éstas, hay otras barras de herramientas, que "a priori" no están visibles, que pueden sernos de utilidad tenerlas en la pantalla de trabajo. Desde el menú Ventana podremos acceder a las Barras de Herramientas que incluyen la barra de Herramienta Principal, Estado y Controlador.
4. La Barra de Herramientas. Herramientas Básicas. La Barra de Herramientas contiene todas las Herramientas necesarias para el dibujo. Veamos cuáles son las más importantes y cómo se usan: •
Herramienta Selección (flecha): Es la herramienta más usada de todas. Su uso principal es para seleccionar objetos. Permite seleccionar los bordes de los objetos, los rellenos (con un sólo clic), los bordes (con doble clic), zonas a nuestra elección... Además, su uso adecuado puede ahorrarnos tiempo en el trabajo.
•
Herramienta Línea: Permite crear líneas rectas de un modo rápido. Las líneas se crean como en cualquier programa de dibujo, se hace clic y se arrastra hasta donde queramos que llegue la línea recta. Una vez creada la podemos modificar sin más que seleccionar situar el cursor encima de los extremos para estirarlos y en cualquier otra parte cercana a la recta para curvarla.
•
Herramienta Texto: Crea un texto en el lugar en el que hagamos clic. Sus propiedades se verán en el tema siguiente.
•
Herramienta Óvalo: La herramienta Óvalo permite trazar círculos o elipses de manera rápida y sencilla.
•
Herramienta Rectángulo: Su manejo es idéntico al de la Herramienta Óvalo, tan solo se diferencian en el tipo de objetos que crean.
Prof.: Himmer Oliver Peralta Luque
Práctica de Complementación
PERUCHIPsiglo21 •
Herramienta Lápiz: Es la primera Herramienta de dibujo propiamente dicho. Permite dibujar líneas con la forma que decidamos, modificando la forma de estas a nuestro gusto. El color que aplicará esta Herramienta se puede modificar, bien desde el Panel Mezclador de Colores o bien desde el sub panel Colores que hay en la Barra de Herramientas.
•
Herramienta Brocha: Su funcionalidad equivale a la del lápiz, pero su trazo es mucho más grueso. Se suele emplear para aplicar rellenos. Se puede modificar su grosor y forma de trazo.
•
Herramienta Cubo de Pintura: Permite aplicar rellenos a los objetos que hayamos creado. Al contrario que muchos otros programas de dibujo, no permite aplicar rellenos si la zona no está delimitada por un borde. El color que aplicará esta Herramienta se puede modificar, bien desde el Panel Mezclador de Colores o bien desde el subpanel Colores que hay en la Barra de Herramientas.
•
Herramienta Borrador: Su funcionamiento es análogo a la Herramienta Brocha. Pero su función es la de eliminar todo aquello que "dibuje".
•
Herramienta Lazo: Su función es complementaria a la de la Herramienta Flecha, pues puede seleccionar cualquier cosa, sin importar la forma, (la Herramienta Flecha sólo puede seleccionar objetos o zonas rectangulares o cuadradas). En contrapartida, la Herramienta Lazo no puede seleccionar rellenos u objetos (a menos que hagamos la selección a mano).
Al seleccionar esta Herramienta, en el Panel Opciones aparecen estas imágenes:
Esto, es la Herramienta Varita Mágica, tan popular en otros programas de dibujo. Permite hacer selecciones según los colores de los objetos. El tercer dibujo que aparece es este:
Permite hacer selecciones poligonales. •
Herramienta Pluma: Crea polígonos (y por tanto rectas, rectángulos...) de un modo sencillo. Mucha gente encuentra esta herramienta complicada, aunque es una de las más potentes que ofrece Flash. Su empleo consiste en hacer clic en los lugares que queramos definir como vértices de los polígonos, lo que nos asegura una gran precisión. Para crear curvas, hay que señalar los puntos que la delimitan y posteriormente trazar las tangentes a ellas. Con un poco de práctica se acaba dominando.
Prof.: Himmer Oliver Peralta Luque
Práctica de Complementación
PERUCHIPsiglo21 •
Herramienta Sub-seleccionador: Esta Herramienta complementa a la Herramienta Pluma, ya que permite mover o ajustar los vértices que componen los objetos creados con dicha herramienta.
•
Herramienta Bote de Tinta: Se emplea para cambiar rápidamente el color de un trazo. Se aplica sobre objetos, si tienen borde, cambia al color mostrado de dicho borde, por el mostrado en el Panel Mezclador de Colores (que coincide con el sub-panel Colores que hay en la Barra de Herramientas.)
•
Herramienta Cuentagotas: Su misión es "Capturar" colores para que posteriormente podamos utilizarlos. Para ver cómo funciona, aconsejamos ver la siguiente animación: La Barra de Herramientas. OpcionesAlgunas Herramientas poseen unas opciones especiales que facilitan y potencian su uso. Para acceder a estas utilidades, a veces no basta con hacer clic en la Herramienta correspondiente. La forma de acceder a este Submenú consiste en hacer clic en la línea o en el objeto que has dibujado.Entonces aparecerá (o se iluminará si ya estaba presente) un submenú como este: •
Ajustar a Objetos: Se usa para obligar a los objetos a "encajar" unos con otros, es decir, para que en caso de ser posible, sus bordes se superponga, dando la sensación de estar "unidos".
•
Suavizar: Convierte los trazos rectos en líneas menos rígidas.
• Enderezar: Realiza la labor inversa. Convierte los trazos redondeados en más rectilíneos.El Panel Mezclador de ColoresEl Panel Mezclador de Colores, como su nombre indica se usa para fabricar nuestros propios colores y para seleccionar los que más nos gusten.El Panel Muestras de ColorEl Panel Muestras de Color sirve para poder ver de un modo rápido y claro los colores de que disponemos, tanto sólidos (un solo color) como degradados (lineales o radiales). Además, cuando creemos un color mediante el Panel Mezclador de Colores, podremos agregarlo a nuestro conjunto de muestras mediante Agregar Muestra (que se encuentra en un menú desplegable en la parte superior derecha del Panel Mezclador de Colores). Una vez esté agregado el color, pasará a estar disponible en nuestro conjunto de muestras y podremos acceder a él rápidamente cada vez que trabajemos con nuestra película. Cada película tiene su propio conjunto de muestras y cada vez que la abramos para editarla, podremos usar las muestras que teníamos la última vez que trabajamos con dicha película. BARRA DE EDICIÓN En Flash 8 la Barra de Edición está localizada justo encima de la Línea de tiempo:
Nos da información sobre el zoom al que estamos viendo la escena y nos servirá también para recibir información de la escena en la que estamos y los elementos que tenemos en juego en ese momento. Sus diferentes aplicaciones las iremos viendo detenidamente en posteriores apartados.
Prof.: Himmer Oliver Peralta Luque
Práctica de Complementación
PERUCHIPsiglo21 BARRA PRINCIPAL
La barra de Herramientas Principal contiene iconos que nos permiten aplicar los comandos utilizados más a menudo, como por ejemplo Guardar, Copiar, Pegar, etc. Es aconsejable que tengamos esta barra siempre visible ya que nos va a ser útil con frecuencia. BARRA DEL CONTROLADOR
Esta barra de herramientas se define por los botones de Play, Rebobinar, Hacia delante, Hacia atrás, Stop, etc. con los que podremos trabajar con la vista preliminar de películas Flash. Los botones de esta barra sólo estarán activos si la película tiene una longitud de tiempo en la Línea de tiempo. Es decir, que la usaremos hasta la lección 4 donde empezaremos a trabajar con la Línea de tiempo. PANEL DE LÍNEA DEL TIEMPO. Éste es un panel crucial en el trabajo con flash. Nos ofrece la posibilidad de gestionar la estructura y longitud de nuestras películas, de nuestras animaciones en el tiempo. Desde este panel podremos organizar las escenas de nuestra película, la longitud de cada una de ellas y su contenido. La Línea de Tiempo representa una forma de ver los fotogramas de modo simplificado. Consta de 2 partes. 1)
Los Fotogramas (frames) que vienen delimitados por líneas verticales (formando rectángulos)
2)
Los Números de Fotograma que permiten saber qué número tiene asignado cada fotograma, cuánto dura o cuándo aparecerá en la película.
Además, en la parte inferior hay herramientas para trabajar con Papel cebolla e información sobre el Número de Fotograma actual (1 en la imagen), la Velocidad de los Fotogramas (12.0 en la imagen) y el Tiempo de película transcurrido (0.0s en la imagen).A nivel conceptual, la Línea de Tiempo representa la sucesión de Fotogramas en el tiempo. Es decir, la película Flash no será nada más que los fotogramas que aparecen en la Línea de tiempo uno detrás de otro, en el orden que establece la misma Línea de tiempo.
Nota: Un fotograma representa el contenido de la película en un instante de tiempo. Por tanto, una animación no es más que una sucesión de fotogramas. Todo esto se puede controlar desde la Línea de Tiempo, pero no todos los fotogramas tienen el mismo comportamiento ni se tratan igual. Veamos qué tipos de fotogramas hay y cuáles son sus rasgos. •
Las Capas
Prof.: Himmer Oliver Peralta Luque
Práctica de Complementación
PERUCHIPsiglo21 El concepto de Capa es fundamental para manejar Flash de forma eficiente. Dada la importancia de estas, se le dedicará un tema completo. Aún así, veamos a grandes rasgos qué son las capas. Una Capa se puede definir como una película independiente de un único nivel. Es decir, una capa contiene su propia Línea de Tiempo (con infinitos fotogramas). Los objetos que estén en una determinada capa comparten fotograma y por tanto, pueden "mezclarse" entre sí. Esto es interesante a menudo, pero otras veces es conveniente separar los objetos de modo que no interfieran entre sí. Para ello, crearemos tantas capas como sea necesario. El uso de múltiples capas además, da lugar a películas bien ordenadas y de fácil manejo (es conveniente colocar los sonidos en una capa independiente llamada "Sonidos", por ejemplo). Las ventajas y desventajas de usar capas se verá en el Tema 8. PANEL DE PROPIEDADES. Uno de los paneles más importantes cuando se trabajan con gráficos en Flash es el panel Propiedades. Desde este panel tenemos la posibilidad de modificar la propiedad de cualquier herramienta que esté activada o cualquier objeto que tengamos seleccionado en el escenario. Por lo tanto, el aspecto de este panel variará dependiendo de lo que tengamos seleccionado, ofreciéndonos sus propiedades para variarlas
ÁREA DE TRABAJO O ESCENARIO. El Escenario, situado en la parte central del programa, es el área de trabajo en forma rectangular donde se produce la película. Se puede trabajar tanto dentro como fuera de él, teniendo en cuenta que la visualización del resultado de lo que estamos haciendo y que publicaremos, se limita al interior de ese rectángulo o escenario
VENTANAS ACOPLABLES. Ventanas acoplables que representan las propiedades y efectos que se pueden aplicar a objetos o herramientas para realizar las animaciones. Entre estas se encuentran: la paleta de colores, características para deformación de objetos, selección de escenas, biblioteca de objetos, entre otras
Prof.: Himmer Oliver Peralta Luque
Práctica de Complementación
PERUCHIPsiglo21
Resumen: • • • • • • • •
Barra de título: en ella se encuentra el nombre del programa, el nombre del documento de trabajo y los botones de control Barra de menú: Área donde se encuentran las opciones de menús que controlan las funciones de la aplicación. Barra de herramientas contiene las herramientas de dibujo, edición y selección que permiten manipula el contenido de la película Linea de tiempo: muestra dos sectores, el colector de capas y la sección de fotogramas disponibles para la película. Escenario: representa el área donde se crearan las películas. Inspector de propiedades: muestra las propiedades del objeto que se está trabajando. Barras de desplazamiento: permite el desplazamiento por el escenario, tanto en forma vertical como horizontal. Paneles: conjunto de comandos que se encuentran agrupados según una determinada función.
Prof.: Himmer Oliver Peralta Luque
Práctica de Complementación
PERUCHIPsiglo21 PRUEBA EVALUATIVA 1.
Flash 8 fue concebido para crear páginas web estándares. a) b)
2.
El manejo de Flash requiere unos amplios conocimientos necesarios para crear animaciones vistosas. a) b)
3.
c)
Para cambiar el color de fondo de la película hay que hacerlo fotograma a fotograma. Para cambiar el fondo de la película basta modificar el valor Color de Fondo en el Panel Propiedades de Película. Para cambiar el color de fondo se pinta cada fotograma con el pincel y luego se hace todo lo demás encima.
Desde el Panel Info se puede cambiar el color de relleno de un objeto. Para girar un objeto 90º, debería ir al Panel Transformar. Los Zooms permiten acercar o alejar los objetos.
Verdadero. Falso.
Si en el Panel Zoom pone 50%, quiere decir que lo veo todo más grande que cuando pone 75%. a) b)
9.
Verdadero. Falso.
Si creo una película Flash y añado la Escena 2 y luego la Escena 3. El orden de ejecución de las escenas será el mismo que se empleó para crearlas. a) b)
8.
Verdadero. Falso.
¿Cuál de las siguientes afirmaciones es falsa?. a) b) c)
7.
Verdadero. Falso.
¿Cuál de estas 3 afirmaciones es correcta?. a) b)
6.
programación,
Flash no puede trabajar con textos, sólo trabaja con gráficos. a) b)
5.
de
Los fotogramas de la imagen podrían intercambiarse sin que se notase. a) b)
4.
Verdadero. Falso.
Verdadero. Falso.
Los fotogramas de las dos imágenes se diferencian en que en unos hay objetos y en los otros no. a) b)
Verdadero. Falso.
Prof.: Himmer Oliver Peralta Luque
Práctica de Complementación
PERUCHIPsiglo21 10.
Los fotogramas de la imagen tienen asociadas acciones, por eso se les marca con una bandera roja. a) b)
Verdadero. Falso.
11. El panel que contiene las utilidades necesarias para dibujar, pintar, etc se llama Barra de Herramientas. a) b)
Verdadero. Falso.
12. Flash 8 trabaja con colores puros de alta definición, lo que imposibilita su mezcla y por tanto el uso de más de 256 colores. a) b)
Verdadero. Falso.
13. Flash dispone del efecto Alfa, que añade transparencia a los colores. Efecto muy atractivo y vistoso. a) b)
Verdadero. Falso.
14. Las herramientas y tienen la misma función, salvo que la primera se emplea para objetos coloreados y la segunda para objetos sin color. a) b)
Verdadero. Falso.
15. La herramienta Lazo es capaz de seleccionar formas y trazados no posibles con la herramienta Selección. a) b)
Verdadero. Falso.
16. La herramienta Cubo de pintura se emplea únicamente para dar color al fondo de las películas. a) b)
Verdadero. Falso.
17. El Panel de colores se emplea para crear nuestros propios colores, mezclarlos a nuestro gusto y añadirles efectos tales como el Alfa. a) b)
Verdadero. Falso.
18. La herramienta Cuentagotas sirve para contar el número de colores diferentes que contiene una imagen. a) b)
Verdadero. Falso.
Prof.: Himmer Oliver Peralta Luque
Práctica de Complementación
PERUCHIPsiglo21 19. Las herramientas brocha. a) b)
y
se diferencian en que el lápiz dibuja más fino que la
Verdadero Falso.
20. Es posible en Flash 8 crear un color de relleno a partir de una imagen de mapa de bits previamente importada a nuestra película. a) b)
Verdadero. Falso.
Prof.: Himmer Oliver Peralta Luque