MACROMEDIA DIRECTOR - Universidad de Valladolid

22 downloads 170 Views 1MB Size Report
Dpto. Informática. Escuela Universitaria Politécnica. Universidad de Valladolid. - 1 -. MACROMEDIA DIRECTOR. 1. INTRODUCCIÓN A DIRECTOR ...
Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid

MACROMEDIA DIRECTOR 1

INTRODUCCIÓN A DIRECTOR ___________________________________________________3

2

EL INTERFAZ DE DIRECTOR ____________________________________________________3 2.1 EL EDITOR CAST: EL REPARTO ____________________________________________4 2.1.1 EL TRABAJO EN LA VENTANA DE CAST __________________________________5 2.1.2 Creación y gestión de repartos_______________________________________________6 2.1.3 Obtener miembros de reparto _______________________________________________7 2.1.4 Trabajo con miembros del reparto ____________________________________________7 2.2 EL EDITOR SCORE: LA PARTITURA ________________________________________8 2.2.1 Introducción_____________________________________________________________8 2.2.2 El trabajo con la ventana Score ______________________________________________8 2.3 LOS DEMÁS EDITORES ___________________________________________________10 2.3.1 LA VENTANA PAINT___________________________________________________10 2.3.2 LA VENTANA VECTOR SHAPE __________________________________________15 2.3.3 EL EDITOR DE TEXTOS ________________________________________________17 2.4

LA BARRA DE HERRAMIENTAS ___________________________________________22

2.5

LA PALETA DE HERRAMIENTAS FLOTANTE _______________________________23

2.6 LA PALETA BIBLIOTECA (LIBRARY PALETTE)_____________________________24 2.6.1 LOS INSPECTORES ____________________________________________________24 2.6.2 EL PROPERTY INSPECTOR _____________________________________________24 2.7 LOS MENÚS EMERGENTES________________________________________________25 2.7.1 LA BARRA DE MENÚS _________________________________________________25 3

LOS SPRITES Y EL STAGE ______________________________________________________26

4

LOS BEHAVIORS (COMPORTAMIENTOS) ________________________________________28

5

RECURSOS EXTERNOS A DIRECTOR ____________________________________________33

6

ACTIVIDADES PRÁCTICAS _____________________________________________________35 6.1

ANIMACIÓN BÁSICA______________________________________________________35

6.2

TRANSICIONES ENTRE CORTINAS ________________________________________36

6.3

NAVEGACIÓN BÁSICA ____________________________________________________38

6.4 EFECTOS EN LA NAVEGACIÓN____________________________________________40 6.4.1 Añadir un botón _________________________________________________________40 6.4.2 Film Loop _____________________________________________________________40 6.4.3 Utilizar varias películas ___________________________________________________41 6.4.4 Cambiar el cursor________________________________________________________41 6.4.5 Finalizar la película ______________________________________________________42 6.4.6 Texto flotante___________________________________________________________43 6.5

TEXTO ___________________________________________________________________43

6.6 CONTROL DE SONIDO ____________________________________________________47 6.6.1 Poner un fondo musical a la película _________________________________________47 6.6.2 Dar sonido a los objetos de la película _______________________________________47 6.6.3 Parar la música _________________________________________________________47 6.7

CONTROL DE VIDEO _____________________________________________________48

-1-

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid 6.7.1

Incluir un fichero de vídeo en la película _____________________________________48

-2-

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid

1

INTRODUCCIÓN A DIRECTOR

El funcionamiento de Director se puede entender muy bien a través de una metáfora (entendiendo ésta como la realidad que imita el programador/diseñador a la hora de realizar la aplicación) que se ajusta al mundo del contenido multimedia: el cine y la animación. Cuando se trabaja en cine o televisión, se deben integrar sonidos con imágenes, movimientos que se realizan en el escenario, transiciones y efectos especiales. Como veremos, incluso la terminología de Director imita a la del cine. De este modo, a un archivo de Director (extensión .dir) se le llama movie (película). La ventana donde se reproduce la animación o la aplicación interactiva final se llama Stage (escenario). Los Sprites o canales, que son los actores de la película, tienen distintos Behaviors (comportamientos) que dependen de unos Scripts o guiones. A los diferentes recursos utilizados en el programa se les denomina Cast members o miembros de reparto. Las ubicaciones generales y la coreografía de los sprites se pueden observar y controlar con el Score o partitura, que se asemeja a la partitura de un animador. Al igual que ocurre con una celda de animación tradicional, los sprites se dibujan en el Stage utilizando distintos Inks o tinteros. En el rodaje de una película, el actor y todo el equipo implicado en una escena, necesitan de señales externas que les indiquen cuando deben realizar su función para que todo quede perfectamente coordinado. Estas señales se traducirían en el famoso “luces, cámara, ¡acción!”, el diálogo de otro actor, la caída de un objeto… etc. Análogamente, en Director se necesitan los denominados eventos, acciones externas que desencadenan una acción en el programa y que pueden ser un evento del ratón, del teclado, del reloj ó de otro actor ó miembro del reparto. Antes de ponerse a trabajar con Director, al igual que ocurre antes de ponerse a dirigir una película, es necesario tener claro lo que se va a hacer y tenerlo todo bien definido en un guion. Éste guion será una descripción lo más minuciosa posible de lo que se quiere hacer en la película y también podrá incluir la secuencia de actores, escenarios, comportamientos… etc. Habrá que tener en cuenta en la realización de éste guion las restricciones espaciales y temporales que limitan el proyecto. El escenario supone una limitación espacial, el tempo supondrá la limitación temporal, y por último el fotograma o frame supondrá la limitación espacio-temporal. Una película de cine se desarrolla a 25 fotogramas por segundo, mientras que una animación de Director puede desarrollarse a la velocidad que desee el creador/programador, considerando normal un rango de 15 a 30 fps (frames por segundo).

2

EL INTERFAZ DE DIRECTOR

El interfaz se refiere al entorno de trabajo, el cual habrá que conocer a la perfección tanto en la producción de una película como en el desarrollo de una aplicación. En el cine el entorno de trabajo está compuesto por escenario, acústica, iluminación de la sala, elementos del escenario, atrezzo… etc. Análogamente, el mundo multimedia consta de una sala de representación que sería el programa utilizado y de unas

-3-

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid estructuras adicionales que son los cuadros de diálogo, las ventanas, los elementos del menú y otros elementos que configuran el programa. Director es un programa complejo. Esta complejidad es el resultado del papel de Director como programa integrador. Su función principal es la de unificar diferentes elementos en un solo formato. Cada uno de estos elementos tiene sus propias características y requiere tratamiento especial. La mayoría de las ventanas de Director se dividen en dos categorías: -

-

Los cuadros de diálogo modales exigen una atención inmediata y no le dejarán realizar ninguna otra operación hasta que no los cierre. Estos cuadros de diálogo responden a preguntas del tipo: “¿cómo/cuánto?”, “¿cómo debo importar imágenes?”, “¿cuánto debería reducir el tamaño del archivo?”… etc. Los editores no modales normalmente controlan la acción de la película ó permiten acceder a los recursos de edición. Los editores tratan el “qué” de las cosas: ¿qué elementos debo utilizar?, ¿qué aspecto tienen?... etc.

En la primera sesión que se abre en Director tras instalarlo aparecerán cuatro ventanas, de las cuales dos son editores (las ventanas Score y Cast). 2.1

EL EDITOR CAST: EL REPARTO

Introducción La ventana cast contiene los gráficos y el texto que se usarán en cada uno de los sprites, así como los sonidos, el vídeo digital, las transiciones, los scripts, y cualquier otro recurso que se utilice en Director. A cada uno de estos recursos se les denomina cast member o miembro de reparto. El cast se divide en casillas numeradas y los miembros de reparto ocupan estas casillas secuencialmente según son creados ó importados. Una manera de diferenciar los cast members de los sprites es volviendo a la metáfora de la representación teatral. Para una actuación en un teatro, se necesitará tener a unos actores que representen el papel de los diferentes personajes, y a unos técnicos que lleven a cabo las tareas de control de la iluminación, el sonido, y los efectos especiales necesarios en la representación. El sprite es el papel o la función que el actor o el técnico deberá realizar. Los cast members son los propios actores y técnicos que van a realizar esas tareas necesarias para sacar adelante la representación. Un miembro de reparto puede ser externo ó interno, creado con Director ó con un programa específico. A su vez, los casts pueden ser externos ó internos. La condición interno/externo de un miembro de reparto depende del modo que se accede al mismo. Será interno cuando el miembro esté almacenado en un cast de Director, ya sea éste externo ó interno; y será externo cuando lo almacenado en el cast sea un link al archivo, no el miembro como tal. Emplear miembros externos

-4-

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid puede ralentizar la película en tiempo de ejecución, mientras que emplear miembros internos puede ralentizar la película en tiempo de carga. Un miembro de reparto puede crearse con los editores incluidos en Director. De este modo, pueden crearse tres tipos de elementos según el editor empleado: editor de texto, de gráficos vectoriales ó de bitmaps. Todos los tipos de elementos admitidos por Director pueden crearse con una aplicación externa (como Word para los textos ó Photoshop para los bitmaps) y luego ser importados a un cast de Director. Director incluye por defecto un cast interno en todas las películas que se realicen, y además de éste pueden crearse todos los cast externos que se vea conveniente. Un cast externo se guarda como un archivo independiente con extensión “.cst”. Utilizar casts externos puede dar más velocidad a la película cuando la cantidad de imágenes, textos y otros elementos multimedia sea enorme, además también acelerará el tiempo de carga de la misma. 2.1.1

EL TRABAJO EN LA VENTANA DE CAST

Se activa mediante la opción Window>Cast o las teclas de acceso rápido . Nos encontramos los siguientes iconos, de izquierda a derecha y de arriba hacia abajo: -

-

Choose Cast: seleccionar entre los casts que pudiera haber en la película ó crear uno nuevo. Cast View Style: List View opcional que permite ver las propiedades de cada uno de los miembros de reparto en una lista que puede ser personalizada por el usuario. Previous/Next Cast Member: seleccionar de forma secuencial los cast members hacia delante o hacia atrás. Drag Cast Member: mover los miembros de reparto: o seleccionar el actor o activar el botón o seleccionar el destino o arrastrar el cuadrado a la nueva casilla Cast Member Name: cuadro de texto para el nombre del cast member. Cast Member Script : modificar el script del cast member. Cast Member Properties : para ver las propiedades del cast member. Dependiendo de su tipo tendrá unas propiedades u otras.

-5-

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid 2.1.2

Cast Member Number: cuadro con el número de cast member. Casilla numerada que contiene el cast member. Además permite ver un previo, el tipo y si tienen asociado un comportamiento. Existen mil casillas de éste tipo para contener miembros de reparto por cada cast. Scrollings para moverse a través del cast. Creación y gestión de repartos

A la hora de programar una película, hay que gestionar múltiples actores de muy diversos tipos. Para mejorar la organización de dichos actores en la película, pueden utilizarse diferentes repartos. Así, puede dedicarse un reparto para los textos, otro para las imágenes, otro para los vídeos etc... O bien dedicar un cast diferente para cada escena de la película. Se puede crear un nuevo reparto con la opción File>New>Cast, mediante las teclas rápidas , ó bien mediante el icono correspondiente en la ventana de reparto. En el cuadro de diálogo de New Cast podemos elegir el nombre del mismo, si será interno ó externo y si se usará o no en la película actual (solo para el caso de que el cast sea externo). Una vez creado un reparto podremos modificar sus propiedades mediante la opción Modify>Cast Properties. Las propiedades que se podrán modificar en el Property Inspector serán el nombre y la opción Preload, que indica el momento en el que se cargan los cast member: -

when needed: cuando hacen falta after frame one: después del primer frame before frame one: antes del primer frame.

Además, el property inspector nos informa del modo de almacenamiento del cast en la aplicación (interno ó externo) y de su tamaño. Se puede utilizar un cast ya creado con la opción File>Import ó pulsando las teclas , indicando en el cuadro de diálogo el tipo de archivo director cast, con extensión “.cst”. Siempre que queramos importar un elemento nos encontraremos con un cuadro de diálogo en el que se nos darán las siguientes opciones de importación: -

-

standard import: la totalidad del gráfico es almacenado dentro de la biblioteca interna de reparto. Por lo tanto éste no estará directamente conectado a su archivo fuente. link to external file: carga una versión temporal del archivo hasta la biblioteca de reparto de Director, pero cuando la película se abre posteriormente y se ejecuta, el miembro de reparto se vuelve a cargar desde el archivo externo en vez de desde el reparto interno. Esta opción es útil cuando el archivo fuente está sujeto a cambios, proviene de internet o es generado por medio de otro programa. include original data for editing: esta opción crea un vínculo externo, pero también mantiene la información interna acerca de cómo se definió el archivo. Esto le permite la edición de archivos mediante un editor asociado definido en el cuadro de diálogo Editor Preferentes al que se accede mediante la opción File/Preferences/Editors.

-6-

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid -

2.1.3

import PICT file as PICT: las imágenes PICT son un formato original que Director usa en Macintosh. Se ejecutan ligeramente más rápido en este formato, pero son impredecibles cuando se ejecutan en Windows. Obtener miembros de reparto

Existen tres modos para obtener un miembro de reparto: -

-

2.1.4

se puede crear un nuevo elemento directamente en Director. Para ello se selecciona una casilla vacía del cast y se puede proceder de tres maneras: o abrir el editor correspondiente al tipo de elemento que se quiere crear. Esto se puede hacer pinchando directamente en su icono situado en la Toolbar ó bien mediante las teclas de acceso rápido: Paint Window , Vector Shape Window , Text Window . o mediante la Tool Palette. Se selecciona la herramienta deseada y se actúa directamente en el stage. El elemento creado se guardará directamente en la casilla seleccionada en el cast. o mediante la opción del menú Insert>Media Element. Es la opción más completa puesto que nos da un amplio abanico de elementos que podemos insertar en el cast y que no aparecen en otros lugares: bitmap, color palette, quicktime, text, font, cursor, shockwave audio, shockwave 3D, realmedia… etc. se puede importar un elemento externo a Director y creado con otro programa independiente. insertar un objeto OLE mediante la opción Insert>OLE Object. La función OLE (Object Linking and Embedding, en español Vinculación e incrustación de objetos) permite compartir y editar elementos fácilmente entre dos aplicaciones que admitan OLE, sin tener que preocuparse de importar y exportar filtros. Los objetos compartidos se transmiten a través del portapapeles de Windows, desde una aplicación servidora hasta una aplicación cliente. Al utilizar OLE, se puede optar por vincular ó incrustar el objeto en la aplicación cliente. Vincular un elemento significa que queda almacenado aparte de su documento asociado, de modo que cada vez que se abra ese documento asociado se actualizarán los cambios dentro de la aplicación cliente. Incrustar un objeto significa que queda almacenado con el propio documento y no se actualizará cada vez que se abra éste. Trabajo con miembros del reparto

Para editar un cast member se hace doble clic sobre el elemento deseado. En ese momento se abrirá el editor de Director correspondiente. En el caso de que el miembro de reparto esté ligado a un elemento externo ó a un editor específico, se abrirá el editor externo correspondiente. Se puede cambiar dicho editor si modificamos las opciones en la opción del menú File>Preferences>Editors. Podemos seleccionar uno o varios de los miembros del reparto con y para eliminarlos, moverlos de sitio, renombrarlos, ordenarlos por distintos atributos… etc.

-7-

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid 2.2

EL EDITOR SCORE: LA PARTITURA

2.2.1

Introducción

La ventana score es análoga a la hoja de partitura de un animador: le muestra, de izquierda a derecha, el tiempo de la película medido en fotogramas. Normalmente, una película tiene entre 15 y 30 fotogramas por segundo, aunque esta variación (conocida como tempo) puede variar enormemente, desde 1 hasta 999 fotogramas por segundo. El score se representa como una rejilla en la que las filas se denominan canales y las columnas se denominan fotogramas. El score está dividido horizontalmente en 1000 sprite channels (canales de sprite) destinados a sprites gráficos y de texto, y muestran la posición de cada elemento y su relación con los demás en el stage y el fotograma de la película. Los seis canales superiores controlan el tempo, la paleta, el sonido (2 canales), la transición y las instrucciones que controlan a los sprites (llamados script ó guion) aplicados a un determinado fotograma de la película. Un sprite channel es muy parecido a las tradicionales capas de celdas de animación (cada canal corresponde a una capa). Los sprites se colocarán en el score según el orden en que aparecerán en el stage. Es posible mover ó intercambiar los sprites del stage mediante el lenguaje de Director que se utiliza para elaborar guiones, conocido como Lingo. 2.2.2

El trabajo con la ventana Score

Se activa mediante la opción Window>Score ó mediante las teclas de acceso rápido . En esta ventana encontramos los siguientes iconos/secciones: -

La primera fila corresponde a la gestión de marcadores ó markers: o Markers Menu: permite seleccionar uno de los marcadores de la película, mediante el nombre del mismo, ó crear uno nuevo mediante la opción New Marker.

-8-

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid o

-

-

-

-

Botones para la navegación secuencial a través de los marcadores: Previous Marker/Next Marker. o Barra de marcadores. Pinchando directamente en esta barra se creará un nuevo marcador. La casilla junto al marcador es para nombrar ó renombrar a éste. Los marcadores se pueden mover a lo largo de esta barra seleccionándolos y arrastrándolos. Para borrar marcadores basta simplemente con arrastrarlos fuera de esta barra. Los marcadores tienen dos funciones fundamentales: ayudan a la organización del score y son indispensables para la creación de películas que no se desarrollarán de forma lineal, mediante la fijación de puntos de referencia. Facilitan la programación y navegación a través del score, pudiendo saltar la película de un punto a otro sin tener que depender de unos fotogramas específicos. El botón al final de la primera fila, Hide/Show Effects Channels, permite ocultar los seis primeros canales, denominados canales de efectos. Effects Channels ó canales de efectos. Podemos encontrar seis canales de éste tipo. De abajo hacia arriba: o Canal de comportamientos: Comportamientos determinados en un frame y que afectan a todos los elementos en ese instante. o Canales de sonido: Existen dos canales de sonido, uno para música de fondo y otro para efectos de sonido de la película. Se puede controlar qué canal suena en cada momento y el volumen del mismo. o Canal de transiciones: Se introducen los efectos de las transiciones para pasar de un cuadro ó frame a otro. o Canal de paleta: Aquí se especifica la paleta empleada en cada momento, en el caso de que ésta no vaya a ser la misma durante toda la película. o Canal tempo: Velocidades de reproducción y los puntos en los que se detiene la película. En la tercera fila encontramos: o Selección del modo de visualizar los sprites dentro del score. Podemos visualizarlos según el nombre del miembro de reparto (member), según el comportamiento asociado (behavior), según su posición en el stage (location), según su modo de tinta (ink), según su gradación (blend) ó en un modo extendido que muestra todas las anteriores propiedades (extended). o Barra numerada. Los números corresponden al número de frame ó cuadro. Sirve para colocar secuencialmente los actores en el score, controlar la longitud de los mismos, determinar la posición de éstos en la secuencia de la película… etc. o Zoom Menu: permite seleccionar el nivel de zoom del score. Sprite Channels: para colocar los actores, determinar su posición, su actuación, la duración de la misma… etc. Existen 150 sprite channels. La primera casilla de cada sprite channel contiene el número del mismo y un botón que permite apagar ó encender los canales de forma selectiva. Apagar ciertos canales permite ver la evolución en la película de los que quedan encendidos sin interferencias. En la última fila encontramos 6 Casillas de colores. Sirven para cambiar el color del sprite en el score. Esto ayuda a organizar e identificar grupos de actores. Center Current Frame.

-9-

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid 2.3

A la derecha y debajo de los sprite channels están los Scrolling para facilitar la navegación. LOS DEMÁS EDITORES

Además de los dos editores principales (cast y score), Director incluye los siguientes editores: -

-

2.3.1

el editor de gráficos de mapas de bits, Paint Window : está optimizado para crear animaciones, pero no es tan potente como para crear los gráficos realistas que pueden generar otros programas de edición de imágenes como Adobe Photoshop, Corel Photopaint y similares. el editor de gráficos vectoriales Bézier, Vector Shape Window : al igual que ocurre con el anterior editor, no es tan potente como otros editores vectoriales tales como Corel Draw… etc. el editor de textos, Text Window : Director puede editar texto de dos formas diferentes, así como utilizar texto generado en fuentes externas. editores externos para los diferentes tipos de medios (gráficos, sonido y vídeo) que pueden configurarse desde la opción File>Preferences>Editors. LA VENTANA PAINT

Introducción La ventana Paint ha sido optimizada para ser usada como un editor de animación. Crear una serie de fotogramas consecutivos es relativamente sencillo de hacer y ofrece herramientas únicas como la Onion Skin (piel de cebolla) y los registration points (puntos de registro), que sirven de gran ayuda. Vista general de la ventana Paint

- 10 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid

Se puede abrir en cualquier momento la ventana Paint mediante las teclas o ejecutando el comando Window/Paint en la barra de menús. Si no había seleccionado ningún miembro de reparto, entonces se abrirá un lienzo en blanco. Si había seleccionado algún miembro de reparto al abrirla, entonces la ventana Paint mostrará ese miembro en pantalla. A menos que los miembros de reparto de mapas de bits estén asociados a un editor externo, al hacer doble clic sobre ellos en el cast también se abrirá la ventana Paint. Las herramientas de la ventana Paint se presentan en una doble columna vertical de botones en la paleta Tools (herramientas) en la parte izquierda de la ventana. Estas herramientas son: Lazo : herramienta de selección libre. Se usa para seleccionar áreas irregulares. También puede configurarse a Shrink (ajustar) para excluir los colores de fondo. Cuadro de selección ó : herramienta de selección rectangular. Este es el modo de selección necesario para la mayoría de los efectos especiales. También puede configurarse a Shrink (ajustar) para excluir los colores de fondo.

- 11 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid

Punto de registro : determina el “punto de registro” del gráfico cuando se dibuja en el stage. Hacer doble clic sobre este botón para establecer el punto de registro para el centro del gráfico. Borrador : pinta el gráfico con el color de fondo seleccionado. Haciendo doble clic sobre el botón se borrará toda la pantalla. Mano ó : se usa para desplazar el especialmente útil con la herramienta Magnifying Glass (lupa).

gráfico.

Es

Lupa : dobla la visualización actual de la imagen, hasta ocho veces. Si se mantiene pulsada la tecla al hacer clic sobre la imagen se activará la reducción del tamaño en intervalos de 50 por ciento del tamaño original de la imagen. Cuentagotas : establece el color de primer plano del color que haya en la punta del cuentagotas. Bote de pintura ó : rellena todos los pixels contiguos del mismo color y motivo con el color de primer plano ó con el motivo. Texto : coloca texto en el gráfico. Este texto sólo puede ser editado cuando el punto de inserción esté activo; después pasará a formar parte del gráfico. Lápiz ó : dibuja una línea con un grosor de 1 pixel. Si está seleccionado cualquier color de primer plano, la línea tendrá ese color; si no es así, tendrá el color de fondo. Aerógrafo : crea un motivo de puntos aleatorios de diferentes tamaños. Se puede usar para crear efectos de texturas, pero no funiona tan bien como los aerógrafos de otros programas. Pincel : pinta el gráfico con el color de primer plano, usando el tintero seleccionado. Si se hace clic con el botón izquierdo del ratón y se mantiene pulsado, puede seleccionarse un pincel distinto. Arco : dibuja un arco, usando el grosor de línea seleccionado en ese momento para crear la curva. Para utilizarla, se debe hacer clic y arrastrar para configurar la tangente inicial, y luego arrastrar hasta el punto final. Línea , , ó : dibuja una línea. Hacer clic para iniciar la línea y luego arrastrar. Si se pulsa la tecla al tiempo que se arrastra, la línea pasará de horizontal a vertical en incrementos de 45 grados. Rectángulo relleno : pinta un rectángulo relleno, usando el color de primer plano o motivo actualmente seleccionado. Si se selecciona una línea de cero puntos de grosor, el rectángulo tendrá el borde de ese ancho. Rectángulo : pinta un rectángulo hueco, con el color de primer plano y ancho de línea que estén seleccionados. Elipse rellena : pinta una elipse rellena, usando el color de primer plano actual. Si se selecciona una línea de cero puntos de grosor, la elipse tendrá el borde de ese ancho. Elipse : pinta una elipse hueca, usando el color de primer plano y ancho de línea que estén seleccionados. Polígono relleno : pinta un polígono relleno, usando el coler de primer plano, el motivo y el ancho de línea que estén seleccionados. Hacer clic para crear los vértices del polígono, y doble clic para completar la forma deseada.

- 12 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid

Polígono

: pinta un polígono hueco, usando el color de primer plano y ancho de línea que estén seleccionados. Hacer clic para crear los vértices del polígono, y doble clic para completar la forma deseada. Colores y degradados En la parte inferior de la paleta Tools encontramos una colección de muestras de pintura, de motivos y de líneas. Los dos grandes cuadros que se solapan son los dos colores primarios de trabajo: el cuadrado que se encuentra en la parte superior izquierda es el que le da el color de primer plano, mientras que el que se encuentra en la parte inferior derecha es el color de fondo. Sobre estos cuadros encontramos los botones de degradado. La muestra del color de degradado que se encuentra a la izquierda es siempre la misma que la del color de primer plano, mientras que la muestra de la derecha puede ser cualquier color y representa el otro extremo del degradado. Haciendo clic sobre el área que está entre las dos muestras (denominada Color de degradado intermedio) se desplegará un pequeño menú que mostrará los diferentes tipos de degradados que pueden usarse. Motivos Debajo de los cuadros de colores primarios encontramos el botón de muestra de motivos (pattern). Al hacer clic sobre este botón y mantenerlo pulsado aparecerá un menú con 64 motivos diferentes. Para cada uno de estos motivos, los colores de primer plano se utilizan para dar color a los pixels de primer plano, y el color de fondo se utiliza para dar color a los pixels de fondo en cada una de las muestras de motivos. Grosor de líneas Encontramos cinco botones indicadores del grosor de las líneas. Éstos son efectivos con las herramientas rectángulo, elipse y polígono, normales y de relleno. Sirven para configurar el grosor del borde de esas formas. La primera línea de puntos indica que no se dibujará ninguna línea. Los siguientes cuatro botones dibujarán líneas de 1, 2, 3 y 4 pixels de grosor respectivamente. Para crear un grosor diferente a los establecidos, se puede hacer doble clic sobre el botón de 4 pixels para abrir el cuadro de diálogo Paint Window Preferentes y cambiar el grosor con el deslizador “Other” Line Width. Indicador de profundidad del color Este indicador muestra la profundidad de color actual del gráfico que se está creando ó editando. Haciendo doble clic sobre el cuadro Color depth se abrirá el cuadro de diálogo Transform Bitmap, que permitirá cambiar la profundidad del color, llevar el gráfico a una nueva paleta y modificar el tamaño del gráfico.

- 13 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid Los efectos de tintero (ink effects) En Director los tinteros son esencialmente miniprogramas que dan las órdenes pertinentes al pincel actual de cómo interactuar con el color que se encuentre inmediatamente debajo del pincel en la ventana Paint. La lista de efectos de tintero está en la parte inferior izquierda del marco de la ventana Paint. -

-

-

Normal: este es el tintero predeterminado. Pinta el color de primer plano actual encima del color de fondo, utilizando el motivo actual que esté activo. Transparente: hace transparente el color de fondo de una selección. Es especialmente útil cuando se trabaja con los textos de los botones. Inverso: convierte una imagen de color blanca o de otro color en un color negro, y el negro en blanco. Es un efecto muy útil para la elaboración de máscaras. Fantasma: dibuja usando el color de fondo. Degradado: crea una suave transición de un color a otro. Pueden configurarse las propiedades del degradado haciendo clic sobre el degradado intermedio que se encuentra entre el degradado inicial y el final. Revelado: revela los contenidos del anterior miembro de reparto gráfico. Cíclico: cada vez que se mueva el pincel, el color cambiará al siguiente color de la paleta. Sustituir: utiliza el color del botón de degradado final como el color sustituto siempre que el pincel pase sobre los pixels que contengan el color de primer plano. Esta es una manera de reducir el halo de los colores blancos cercanos que aparecen en otros programas de retoque. Esto funciona de la misma forma que el botón Switch situado en la barra de herramientas de efectos especiales. Mezcla: se mezcla el color de primer plano actual con el que ya halla sido pintado en pantalla. Se puede configurar el valor de la mezcla entre 0 y 100% mediante el comando File/Preferences/Paint (cuadro de diálogo Paint). El más oscuro: compara el color de primer plano con los pixels de fondo, y después elige el color más oscuro de ambos para pintar. El más claro: compara el color de primer plano con los pixels de fondo, y después elige el color más claro de ambos para pintar. Oscurecer: ignora el color de primer plano, oscureciendo la imagen de fondo al nivel que aparece en el cuadro de diálogo Paint. Aclarar: ignora el color de primer plano, aclarando la imagen de fondo al nivel que aparece en el cuadro de diálogo Paint. Suavizar: suaviza ó emborrona los pixels de la imagen de fondo, ignorando la del primer plano. Manchar: crea un manchado (efecto similar al que se consigue cuando se difumina un dibujo con el dedo) de los pixels de la imagen de fondo, ignorando la del primer plano. Extender: combina en una sola operación los efectos Smear y Smooth. Portapapeles: se utiliza para convertir un pincel en un “sello”. Primero se selecciona una región con la herramienta Marquee o Lasso y se guarda en el portapapeles. Después se podrá usar la imagen guardada como un pincel cualquiera.

La barra de efectos especiales

- 14 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid En el área que se encuentra encima del lienzo se encuentran las herramientas que permiten voltear, distorsionar, girar y aplicar otros efectos especiales al gráfico. -

-

2.3.2

Voltear horizontal: voltea la selección horizontalmente. Voltear vertical: voltea la selección verticalmente. Girar a la izquierda: gira la selección 90 grados a la izquierda. Girar a la derecha: gira la selección 90 grados a la derecha. Girar libremente: arrastrar cualquiera de los selectores de las esquinas de la selección para girar hacia cualquier dirección. Inclinar: arrastrar cualquiera de los selectores superiores de la selección para inclinar la imagen hacia la izquierda o hacia la dereca partiendo desde arriba. Arrastrar cualquiera de los selectores inferiores de la selección para inclinar la imagen hacia la izquierda o hacia la derecha partiendo desde abajo. Distorsionar: arrastrar cualquiera de los selectores de las esquinas hasta una posición diferente para deformar. Perspectiva: arrastrar cualquiera de los selectores hacia la izquierda o hacia la derecha para dar perspectiva a la selección. Suavizar: suaviza (antialiasing) la selección. Dibujar bordes: crea un contorno de 2 pixels de grosor en una selección. Los colores del contorno se basan en los colores que aparecen en los bordes de la selección. Invertir: invierte los colores de la selección a sus colores complementarios. Aclarar: aclara los colores de dentro de la selección. Este efecto solamente es visible si se aplican miembros de reparto de 8 bits o si se usa después de haber aplicado el efecto Darken. Oscurecer: oscurece los colores de dentro de la selección. Relleno: rellena el área seleccionada con el color de primer plano. Cambiar color: cambia todos los pixels de una selección que contengan el color de primer plano por el color final. LA VENTANA VECTOR SHAPE

Introducción Los gráficos creados dentro de la ventana Vector Shape tienden a tener un aspecto más suave y más simple que los mapas de bits, pero podrá variar su tamaño sin que estos pierdan ni un ápice de su calidad original. Una característica a resaltar de los gráficos vectoriales es que se pueden modificar utilizando Lingo, el lenguaje de programación ó elaboración de guiones de Director. Otra de las ventajas de estos gráficos es que no tendrán los problemas de aparición de halos, a diferencia de los mapas de bits donde son tan frecuentes. Se pueden crear dos tipos de gráficos vectoriales dentro de esta ventana: formas libres Bézier, y formas geométricas básicas como rectángulos y elipses. Vista general de la ventana Vector Shape

- 15 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid

Se puede abrir la ventana Vector Shape mediante el comando Window/Vector Shape Window, o mediante las teclas de acceso rápido . Si no hubiera ningún miembro de reparto vectorial seleccionado, entonces la ventana se abrirá con el lienzo en blanco. Si hubiera algún miembro de reparto vectorial seleccionado cuando se abriese la ventana, aparecería el gráfico, con los puntos que pueden ser editados en azul. Se utilizarán las herramientas que se encuentran en la parte izquierda de la ventana para crear formas libres de Bézier o geométricas, como círculos y cuadrados. Las herramientas que controlan los atributos como el color de relleno y de fondo, el estilo del relleno, el grosor de línea… están situadas en la parte inferior de la paleta Tools. -

Flecha : selecciona un punto del gráfico. Si se arrastra un cuadro de enmarcación alrededor del gráfico se seleccionan todos los puntos. Pluma : dibuja una serie de puntos para crear una forma Bézier. Punto de registro : establece un punto de registro del gráfico. Si se hace doble clic sobre el botón se establecerá automáticamente el punto de registro en el centro del gráfico. Mano : desplaza el lienzo para ajustar la visualización. Rectángulo relleno : crea un rectángulo sólido. Si se mantiene pulsada la tecla mientras se dibuja la forma, ésta se convertirá en un cuadrado. Rectángulo : crea un rectángulo hueco. Si se mantiene pulsada la tecla mientras se dibuja la forma, ésta se convertirá en un cuadrado. Rectángulo redondeado relleno : crea un rectángulo con esquinas redondeadas y relleno de color sólido. Si se mantiene pulsada la tecla mientras se dibuja la forma, ésta se convertirá en un cuadrado. Rectángulo redondeado

: crea un rectángulo hueco con las esquinas redondeadas. Si se mantiene pulsada la tecla mientras se dibuja la forma, ésta se convertirá en un cuadrado. Elipse rellena : crea una elipse rellena de color sólido. Si se mantiene pulsada la tecla mientras se dibuja la forma, ésta se convertirá en un círculo.

- 16 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid -

Elipse : crea una elipse hueca o vacía. Si se mantiene pulsada la tecla mientras se dibuja la forma, ésta se convertirá en un círculo. Grosor del trazado: establece el ancho del grosor del gráfico. Cerrar forma: al hacer clic sobre esta casilla se crea una forma cerrada cuando se esté utilizando la herramienta pluma (pen). Sin relleno: crea una forma sin relleno. Color sólido: crea una forma que tiene un color de relleno sólido. Degradado: crea una forma que tiene un degradado como relleno. Colores de degradado: configura los colores de inicio y fin de un degradado. Color del trazado: establece el color del trazado. Color del relleno: establece el color (sólido) de relleno. Color de fondo: establece el color de fondo del gráfico.

Las funciones que posee la herramienta pluma (pen) son muy similares a las de las herramientas correspondientes a programas similares como FreeHand ó CorelDraw. Permitirán dibujar formas libres creando una línea (trazado) que se compone de una serie de puntos por los que pasa el trazado. Estos puntos pueden ser puntos de vértice o puntos de curva. Si un trazado de cuatro puntos se compone enteramente de puntos de vértice, entonces aparecerá como un rectángulo. Si esos puntos que componen el trazado son puntos de curva, entonces aparecerá como una elipse.

2.3.3

EL EDITOR DE TEXTOS

Introducción El texto siempre ha sido difícil de controlar cuando se incluye en aplicaciones multimedia. Hay muy pocas fuentes que sean idénticas en Macintosh y en Windows, y tampoco se tiene la garantía de que estén instaladas en el ordenador del usuario final. Director intenta solucionar estos problemas permitiéndole incrustar fuentes y distribuirlas fácilmente a través de sus películas. Esta característica asegura que las fuentes que se utilicen para crear la película aparecerán exactamente como se desee, sin importar el tipo de plataforma utilizada. Director permite importar documentos de texto y de Hypertext Markup Language (HTML) creados con otras aplicaciones sin perder ninguno de los formatos originales. Director incluso mantiene los hipervínculos que haya en un documento HTML. Trabajar con texto en Director Director ofrece tres maneras de producir texto en una película: -

Los miembros de reparto de texto (text cast members) hacen el mejor trabajo mostrando texto. Se dispone de un mayor control sobre el formato, además de poder girar, voltear e inclinarlos.

- 17 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid -

Los miembros de reparto de campo (field cast members) no se muestran tan bien, pero tienen un tamaño mucho menor. No se pueden girar ni inclinar estos miembros de reparto. Texto pintado (painted text) es una característica de la ventana Paint. El texto creado mediante la ventana Paint es único, ya que solamente puede ser editado mientras se esté creando el texto. Después de haber sido creado, se convertirá en un miembro de reparto de mapa de bits, igual que cualquier otro gráfico creado dentro de la ventana Paint.

El miembro de reparto de texto Además de los contenidos de un bloque de texto, Director tiene que mantener los atributos que definen cómo un texto debe aparecer en pantalla. Estos atributos del texto son la fuente, el tamaño, el estilo y el formato. Los estilos específicos del texto hacen que, por ejemplo, Times New Roman Bold y Times New Roman Italic sean dos fuentes completamente distintas aunque pertenezcan a la misma familia. La mayoría de los atributos de texto se transfieren con facilidad de un sistema o plataforma a otro. Sin embargo, la información de la fuente es específica de cada sistema. Por eso habrá que tener mucho cuidado en la sustitución de fuentes al transferir una película de un sistema a otro para que mantenga su inteligibilidad. Director resuelve muchos de estos problemas utilizando el formato RTF (Rich Text Format) que permite incrustar fuentes en una película, asegurando que el texto sea mostrado con precisión en todas las plataformas (sin necesidad de que la fuente esté instalada). Crear un nuevo miembro de reparto de texto Se pueden crear miembros de reparto de texto de tres maneras: -

-

Añadir el texto directamente en el stage: mediante la Herramienta Texto de la paleta de herramientas de Director. Es ideal para pequeñas cantidades de texto como títulos. Los atributos del texto creado por este método se editarán mediante el Text Inspector. Introducir texto en la ventana de texto: la ventana Text permite dar formato al texto, incluyendo el tamaño, el estilo y la alineación. El texto creado mediante este método puede editarse cuando se desee. Importar texto creado en otras aplicaciones: tanto el anterior método como éste se emplean cuando se necesitan bloques de texto de mayor tamaño.

La herramienta Text La herramienta texto se encuentra en la paleta de herramientas flotante. Se puede abrir la paleta de herramientas mediante el comando Window/Tool Palette o mediante las teclas de acceso rápido . Para crear texto basta con hacer clic en el botón de la herramienta texto y después hacer clic directamente en el stage para que se cree un cuadro de texto. Los atributos de este texto se pueden editar mediante el Text Inspector, al cual se

- 18 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid accede mediante el comando combinación .

Window/Inspectors/Text

o

mediante

la

La ventana Text

Este editor permite crear y dar formato a bloques de texto. Es un pequeño procesador de texto y contiene las características para dar formato así como para aplicar atributos de texto. Como Director usa el formato RTF como formato de texto interno, se puede utilizar más de una fuente, estilo ó color dentro de un solo bloque de texto. La ventana Text admite además las funciones Scrapbook (portapapeles) con las que se podrá pegar texto desde otras aplicaciones. Los atributos de texto se pueden editar en cualquier momento de la elaboración de la película. Se puede abrir la ventana Text mediante el comando Insert/Media Element/Text ó con Window/Text, ó mediante las teclas . Los botones y opciones que encontramos en el editor de texto son: -

-

Nombre del miembro de reparto: hacer clic en este botón para introducir el nombre del miembro de reparto de texto. Fuente: hacer clic en el botón con una flecha para abrir la lista de fuentes disponibles. Esta lista muestra las fuentes instaladas en el sistema e incrustadas en la película. Las fuentes incrustadas se distinguen por tener detrás del nombre un asterisco (*). Negrita: para asignar estilo negrita (bold) al texto. Hacer clic en el botón o mediante las teclas rápidas . Cursiva: para asignar estilo cursiva al texto (italic). Hacer clic en el botón o mediante las teclas rápidas .

- 19 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid -

-

-

-

-

-

Subrayado: para asignar estilo subrayado al texto. Hacer clic en el botón o mediante las teclas rápidas . Tamaño de fuente: hacer clic sobre el botón con una flecha para desplegar la lista de tamaños disponibles. También se puede hacer clic en el cuadro e introducir a mano el valor deseado. Sólo se admiten valores numéricos enteros. Interlineado: especifica la cantidad de espacio entre las líneas de texto. Hacer clic sobre las flechas para aumenta ó disminuir el espaciado. De igual modo, se puede hacer clic en el cuadro e introducir el valor deseado a mano. Sólo se admiten valores numéricos enteros. La cantidad de espacio está determinada por el tamaño de la fuente escogida. Alinear a la izquierda: para alinear el texto seleccionado a la izquierda. Alinear en el centro: para alinear el texto seleccionado en el centro. Alinear a la derecha: para alinear el texto seleccionado a la derecha. Justificar: para alinear el texto seleccionado entre ambos márgenes de modo justificado. El espacio se añadirá entre las palabras y el kerning se ajustará automáticamente. Todas las líneas de un párrafo estarán justificadas excepto la última (puesto que el texto no ocupa toda la línea). Kerning: el kerning es un método especial de ajuste del espacio entre los caracteres. Mejorará la apariencia de los pares de caracteres que quedan mejor cuando se solapan, como los pares de letras A y W. Funciona mejor con los tamaños de letra grandes. Para ajustar el espacio entre caracteres, hacer clic sobre los botones con flechas para aumentar o disminuir la cantidad relativa de los pares de letras. También se puede introducir un número directamente en el campo. Margen izquierdo y marcadores de sangrados: arrastrar el marcador de margen izquierdo (el inferior) para ajustar el margen izquierdo. Hacer clic sobre el marcador de sangrado (el superior) para sangrar la primera línea de cada párrafo con la cantidad especificada. Margen derecho: arrastrar el marcador para ajustar el margen derecho, y arrastrar el borde derecho del cuadro de texto para ajustar el ancho del miembro de reparto de texto. Tabulaciones: hacer clic para mostrar el tipo de tabulación que se quiere usar y después hacer clic sobre la regla para establecer la ubicación de la tabulación. Se puede elegir entre izquierda, derecha, centrada ó centrada decimal.

Opciones de marcos Las opciones de marcos determinan la manera en la que el texto aparece dentro de los bordes de un miembro de reparto en el stage. Existen tres opciones: -

-

Adjust to Fit (ajustar hasta encajar): es el modo predeterminado y expande o contrae el cuadro de texto para acomodarlo a la cantidad de texto que exista. Si el texto cambia, el cuadro se reajustará al tamaño adecuado. Es muy útil si el texto estará visible en el stage de una sola vez. Scrolling (desplazar): permite limitar el tamaño de la ventana de texto. Cuando se coloque un miembro de reparto dentro del stage, aparecerá una barra de desplazamiento a la derecha de la ventana de texto. El scrolling es una buena opción para cuando se dispone de una cantidad de espacio limitada sobre el stage y se necesita mostrar grandes cantidad de texto que rebasan el espacio disponible.

- 20 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid -

Fixed (fijo): mantiene el tamaño original del cuadro de texto creado. Si el texto ocupa más espacio que el del cuadro de texto, no será visible, aunque Director almacenará esta información de texto y se podrá acceder a ella mediante Lingo. La opción Fixed es buena para los títulos y el texto que no vaya a ser modificado mientras se ejecute la película.

Miembros de campo de texto Los miembros de campo de texto se diferencian de los miembros de reparto de texto RTF en que no pueden estar suavizados. Los miembros de campo de texto tienen un menor tamaño de archivo y contienen opciones de formato que no están disponibles en los miembros de reparto de texto RTF. Para crear un miembro de campo, habrá que hacer clic sobre el botón Text Field situado en la barra de herramientas flotante (tool palette), dibujar un rectángulo sobre el stage del tamaño deseado, y finalmente introducir texto en él. Se podrán configurar los parámetros del miembro de campo dentro de la ventana Text Field del Property Inspector. Se podrá aplicar un guion de Lingo al miembro mediante el botón Script. Las opciones de marco Adjust to Fit, Scrolling y Fixed funcionan exactamente igual que las propiedades de un miembro de reparto de texto. Importar texto desde otras fuentes Director admite textos en formato RTF creados con otros procesadores de texto como Word, manteniendo intacto su formato. También admite los archivos de texto ASCII que no contienen más información de formato que las tabulaciones y los retornos de carro. Pueden importarse también textos en formato HTML, manteniendo las etiquetas propias de éste formato, como

(párrafo), (negrita) e (cursiva). Director no reconoce los objetos incrustados en el HTML que no sean tablas, tales como imágenes, marcos, campos de entrada y applets incrustados. La forma de importar archivos de texto es igual que con cualquier otro elemento: ejecutando el comando File/Import, seleccionando los archivos y configurando las opciones de importación. Incrustar fuentes en una película Para incrustar una fuente, se debe ejecutar el comando Insert/Media Element/Font. En el cuadro de diálogo Font Cast Member Properties que aparece se podrá elegir la fuente, las versiones en negrita y cursiva de la misma, e incluir caracteres y tamaños de los mapas de bits específicos. Por lo general, el nombre de la nueva fuente incrustada será el nombre normal seguido de un asterisco.

- 21 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid 2.4

LA BARRA DE HERRAMIENTAS

Esta barra de herramientas es la más importante del interfaz de Director, puesto que es la que contiene las funciones y operaciones más utilizadas. Está compuesta de los siguientes iconos: Película nueva : crea una película nueva. Reparto nuevo : crea un nuevo reparto. Abrir : abre una película o biblioteca de reparto existente. Importar : importa elementos. Guardar : guarda la película o la biblioteca de reparto. Guardar todo: guarda la película y todas las ventanas de repartos. Publicar: guarda la película actual como una película Shockwave y crea una página en formato HTML. Deshacer : deshace la última acción. Cortar : corta la zona seleccionada y lo guarda en el portapapeles. Copiar : portapapeles.

copia

el

objeto

seleccionado

y

lo

guarda

en

el

Pegar : pega el objeto guardado en el portapapeles en el espacio seleccionado. Buscar miembro de reparto : permite localizar rápidamente a un miembro de reparto determinado. Intercambiar miembros de reparto : intercambia al miembro de reparto del stage por el seleccionado. Rebobinar : lleva al primer frame de la película. Stop : detiene la película si está siendo reproducida. Puesta en marcha (play) : ejectua la película si está parada. Escenario : abre la ventana stage. Ventana de reparto : abre la ventana cast. Ventana de partitura : abre la ventana score. Inspector de sprite : abre la ventana sprite inspector. Paleta biblioteca: abre la library palette. Ventana pintar : abre la ventana paint. Ventana de formas vectoriales : abre la ventana Vector Shape. Ventana de texto : abre la ventana Text. Shockwave 3D Window. Inspector de comportamientos : al hacer clic abre el Behavior Inspector. Ventana de guion : abre el script seleccionado en ese momento, o abre un nuevo script si no hay ninguno seleccionado. Ventana de mensaje : abre la ventana Message.

- 22 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid

2.5

LA PALETA DE HERRAMIENTAS FLOTANTE

Las herramientas que con más frecuencia se utilizan en Director se encuentran convenientemente dispuestas en la Tool Palette o Paleta de Herramientas. Estas herramientas son una manera rápida de añadir texto, botones, campos, líneas, formas vectoriales, y rellenos, así como para cambiar el fondo y los colores de fondo. También se podrá girar y distorsionar texto y formas vectoriales. La paleta de herramientas se activa mediante el comando Window/Tool Palette o mediante las teclas de acceso rápido . Las herramientas contenidas en esta paleta son: -

-

-

Flecha: permite seleccionar objetos (esta opción está activada por defecto cuando se abre la paleta de herramientas). Girar: hace girar y distorsiona texto y gráficos vectoriales. Mano: desplaza la ventana hacia la izquierda, derecha, arriba ó abajo. Lupa: aumenta o disminuye el área visible del stage. Texto: inserta texto directamente en el stage. Línea: dibuja líneas rectas directamente en el stage. Rectángulo con relleno: dibuja un rectángulo con el color de primer plano seleccionado como relleno. Rectángulo: dibuja un rectángulo sin relleno en el stage. El color del borde es el que esté seleccionado de primer plano en la paleta de herramientas. Rectángulo redondeado con relleno: dibuja un rectángulo con las esquinas redondeadas, y con el color de primer plano como relleno. Rectángulo redondeado: dibuja un rectángulo sin relleno con las esquinas redondeadas. El color del borde es el que esté seleccionado de primer plano en la paleta de herramientas. Elipse rellena: dibuja en el stage círculos y elipses rellenas con el color de primer plano seleccionado como relleno. Elipse: dibuja círculos y elipses sin relleno. El borde de la elipse/círculo tendrá el color de primer plano seleccionado. Casilla de activación: añade un botón del estilo de una casilla de activación. Botón radial: crea un botón con círculos concéntricos. Campo: crea en el stage campos de texto que se pueden editar. Botón pulsable: crea en el stage un botón cuyo aspecto indica que se puede pulsar. El tamaño del botón depende de la cantidad y del tamaño del texto que contenga. Selector del color de primer plano/de fondo: permite seleccionar los colores de primer plano y de fondo. De primer plano: el pequeño recuadro de la parte superior izquierda. De fondo: el pequeño recuadro de la parte inferior derecha. Si se hace clic sobre cualquiera de esos recuadros se abrirá la paleta de colores disponible. Motivo: selecciona un motivo de relleno para las formas de relleno seleccionadas en la paleta de herramientas. Los colores de primer plano y de fondo del motivo se seleccionan mediante el selector del color de primer plano/de fondo. Selector del grosor de línea: selecciona el grosor de la línea que usará con las opciones de dibujo de la paleta de herramientas. Se puede elegir entre no line, one píxel line, two píxel line y three píxel line.

- 23 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid

2.6

LA PALETA BIBLIOTECA (LIBRARY PALETTE)

La ventana de biblioteca es básicamente una colección de ventanas de cast. Esta biblioteca contiene behaviors (comportamientos) y otros objetos útiles que son almacenados independientemente de la película. Cuando se utiliza en una película de Director un behavior o un objeto de la library palette, éste se convierte en un nuevo miembro de reparto de esa película, que por lo tanto podrá ser editado sin que los cambios afecten al objeto original almacenado en la biblioteca. La library palette se activa ejecutando el comando Window/Library Palette.

2.6.1

LOS INSPECTORES

Los inspectores se utilizan para ver y modificar los atributos de los miembros de reparto de texto, sprites y behaviors. En un inspector aparece la cantidad de memoria que está utilizando la película. Para activar un inspector, primero se ejectua el comando Window/Inspectors y después se selecciona el que se desea activar. Existen cuatro tipos de inspectores y cada uno realiza una tarea específica: -

-

2.6.2

Property Inspector: muestra las propiendades actuales de cualquier elemento seleccionado, incluyendo el stage, así como una película activa. Pueden ajustarse cualquiera de las propiedades disponibles de casi todos los elementos de la película con sólo utilizar esta ventana. Behavior Inspector: se usa para crear nuevos behaviors (comportamientos, ó guiones de Lingo) y para modificar los existentes. Text Inspector: se usa para dar formato al texto y para añadir hipervínculos al mismo. Memory Inspector: muestra la cantidad de memoria RAM que está siendo utilizada por la aplicación de Director y los elemntos que contiene una película.

EL PROPERTY INSPECTOR

El Property Inspector es una herramienta global que permite modificar los atributos de casi todos los elementos de la película. Existen varias maneras de activar el Property Inspector. Se puede ejecutar el comando Window/Inspectors/Property Inspector ó pulsando la combinación de teclas . También se puede hacer clic sobre el icono azul Properties que se encuentra en la ventana Cast y el Sprite Overlay. También se

- 24 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid activa cuando se quiere modificar las propiedades que afecten a toda la película, como la configuración de cuadrículas y guías. Por último, puede activarse haciendo clic sobre el botón Property Inspector en la barra de herramientas. El Property Inspector se reconfigura automáticamente para permitir ajustar todas las opciones disponibles de un elemento en concreto, mostrando una serie de lengüetas asociadas a ese elemento. Incopora el modo List View que muestra todas las propiedades de un elemento en una lista que normalmente se agrupa en dos categorías. Las propiedades se modifican por medio de una combinación de menús emergentes, casillas de activación y campos de entrada de texto situados a la derecha del nombre de la propiedad. Este modo se puede activar/desactivar mediante el botón List View Mode que se encuentra en la esquina superior derecha del inspector.

2.7

LOS MENÚS EMERGENTES

Un menú emergente contendrá las operaciones específicas seleccionado: miembros de reparto, sprites, behaviors ó scripts.

del

elemento

Para desplegarlo basta con hacer clic con el botón derecho del ratón sobre el elemento en cuestión. El contenido del menú varía de un elemento a otro. Estos menús proporcionan una lista de operaciones y comandos que pueden ejecutarse para ese elemento.

2.7.1

LA BARRA DE MENÚS

Director utiliza una serie de menús, submenús y cuadros de diálogo para poder acceder a todas sus opciones. Los menús en los que se divide la susodicha barra son: -

-

Archivo: abre, guarda e imprime archivos. Crea projectors (versiones en tiempo real de las películas, versión ejecutable), películas Shockwave y applets de Java. Configura las preferencias, muestra una vista previa en el navegador, y cierra el programa. Edición: realiza operaciones en el portapapeles (cortar, copiar, pegar) y varios tipos de selección. Busca y reemplaza texto. Ejecuta editores de aplicaciones externas. Ver: ofrece varias maneras de visualizar el score (la ventana que controla la ubicación de los sprites de la animación). También controla la opción Onion Skin (pieles de cebolla) de la ventana paint. Insertar: inserta y borra fotogramas clave y fotogramas de animación del score. Sirve de alternativa a al inserción de miembros de reparto dentro de la ventana Cast. Modificar: cambia las propiedades de una película, de miembros de reparto individuales (recursos), de sprites y del score. También proporciona un

- 25 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid

-

3

medio de editar texto dentro de un campo de texto, modificar scripts, reordenar los miembros de reparto en el stage y convertir miembros de reparto a diferentes profundidades de bits. Control: reproduce las películas de Director, desplazar de un fotograma a otro, configurar el volumen, manejar la grabación de sprites, posee las opciones de corrección de errores, y compila los guiones. Xtras: da información y accede a los xtras (los plugins de Director) y los xtras de filtros gráficos. Protege y actualiza las versiones anteriores de las películas de Director e importa archivos PowerPoint. Ventana: controla las ventanas que se utilizan en Director. Ayuda: da acceso a la ayuda de Director. También activa la ayuda tutorial y da acceso a la página web de Macromedia.

LOS SPRITES Y EL STAGE

Introducción Un miembro de reparto se convierte en sprite cuando se incorpora en el stage. Un sprite no es el gráfico que aparece dentro de la ventana cast, sino un clon (ó instancia) del miembro de reparto cuando se ubica en el stage. Pueden colocarse sobre el stage múltiples copias del miembro de reparto. Los cambios que se realicen sobre el miembro de reparto sí afectarán a su sprite asociado, pero los cambios que se hagan a un sprite no afectarán a su miembro de reparto. Un sprite se puede desplazar por el stage y posee atributos independientes de su miembro de reparto asociado. Moverse por el stage Comprender cómo funcionan los sprites dentro del stage es fundamental. Director proporciona dos métodos básicos para colocar a un miembro de reparto dentro del stage. Puede arrastrarse el miembro de reparto desde la ventana cast hasta el stage, ó puede arrastrarse hasta la ventana score y colocarse en un canal (en éste caso el miembro de reparto aparecerá centrado en el stage). Puede cambiarse el tamaño del stage y su posición dentro de la ventana principal de Director mediante el comando Modify/Movie/Properties ó las teclas de acceso rápido para que se abra la lengüeta Movie de la ventana Property Inspector. Su tamaño podrá modificarse en los cuadros Width (anchura) y Height (altura) del Stage Size, ó seleccionando uno de los tamaños predeterminados. La posición podrá modificarse mediante la opción Stage Location, la cual ofrece la posibilidad de introducir un valor manualmente ó elegir un predeterminado: centered (centrado), upper left (esquina superior izquierda) ó other (otro). El Property Inspector para un sprite Las lengüetas del property inspector asociadas a un sprite son las siguientes:

- 26 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid -

-

-

-

Sprite: la lengüeta sprite permite configurar las propiedades que determinan cómo el sprite se comportará en el stage, incluyendo su posición, el efecto de tintero, el color del primer plano y de fondo, y la configuración de mezcla. Behavior: aunque esta lengüeta no sustituye totalmente al Behavior Inspector sí que permite aplicar y configurar los parámetros de un behavior asociado al sprite seleccionado. Member: la lengüeta member permite configurar las propiedades del miembro de reparto, tales como el nombre del miembro y su ubicación en la memoria. La ventana Comments permite introducir comentarios que tengan que ver con ese miembro. Esto comentarios podrán verse en el modo List View de la ventana cast. Bitmap: permite modificar las propiedades de un miembro de reparto de mapa de bits, como la profundidad de color y de paleta, así como tener acceso a las características de compresión de mapa de bits. También podrá optimizarse el gráfico utilizando las posibilidades de optimización de imagen de Fireworks si está instalado en el sistema. Guides and Grids: permite configurar y modificar la manera de visualizar en el stage las guías y la cuadrícula que incorpora director. Movie: reemplaza al cuadro de diálogo Movie Properties y permite configurar las propiedades que afectan a toda la película, como el tamaño, el color de fondo y la posición general.

Se puede bloquear un sprite para evitar que se pueda mover ó modificar accidentalmente mediante el botón Lock (bloquear) situado en la parte superior del Property Inspector. Configurar los atributos de los sprites Cuando se crea por primera vez un sprite en la ventana score, éste tiene varios atributos además de los que obtuvo por parte de su miembro de reparto asociado. Inicialmente, un sprite que ocupe múltiples fotogramas tiene head (cabecera), body (cuerpo) y tail (cola). La cabecera ó primer fotograma del sprite es un fotograma clave (keyframe), como se indica con un gran punto al principio del canal. El cuerpo de un sprite es la parte central que se encuentra entre la cabecera y la cola. La cola es el fotograma final, que determina la longitud total del sprite dentro del stage. La información del sprite muestra lo siguiente: -

El tipo de sprite. La biblioteca de reparto del sprite. Una descripción de cualquier behavior o script asociado. Su orientación X e Y dentro de la pantalla (con relación a la esquina superior izquierda del monitor). Su anchura y su altura. Su ubicación con relación a la esquina superior izquierda del stage. La ubicación, en pixels, del lado derecho del sprite. La ubicación, en pixels, del lado inferior del sprite. Los ángulos de giro y de inclinación del sprite.

Director utiliza de forma predeterminada vínculos dinámicos (dynamic linking) para vincular la porción de un sprite que se encuentra entre el fotograma inicial y el

- 27 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid fotograma final del sprite. Cuando se hace clic sobre la parte central del sprite, éste queda seleccionado al completo. Esto indica la relación de vínculos dinámica que existe en el sprite, y que permitirá aplicar cambios al sprite completo como una sola unidad. Los vínculos dinámicos también provocarán la respuesta del sprite. Si se mueve el fotograma inicial o el fotograma final el resto del sprite responderá con relación a ese cambio. Se puede ampliar un sprite haciendo clic sobre la cola y seleccionando un nuevo fotograma final, o también ejecutando el comando Modify/Extend Sprite.

4

LOS BEHAVIORS (COMPORTAMIENTOS)

Introducción La interactividad es una función multimedia muy importante. Con los behaviors se podrá añadir interactividad a una película sin tener que usar complejos guiones de Lingo. Estos behaviors pueden estar encapsulados en la Library Palette ó introducidos por medio de Lingo usando el Behavior Inspector. Un behavior no es más que un guion ó una página de códigos que incluye event handlers (manejadores de eventos, ó también llamados subrutinas) para eventos que ocurran durante la ejecución de la película. Director incorpora docenas de behaviors preestablecidos, contenidos como series de bibliotecas de reparto externas almacenadas en la carpeta Libs dentro de la carpeta de Director. Los behaviors predefinidos de Director Todos los behaviors predefinidos de Director aparecen en la ventana de la Library Palette. Se puede activar esta ventana mediante el comando Window/Library Palette. El propósito de esta paleta es permitir ver y adjuntar behaviors preestablecidos a los sprites de las películas. Se podrá hacer clic, arrastrar y adjuntar behaviors desde esta ventana, pero no se podrán editar o borrar los behaviors originales. Al adjuntar un behavior a un objeto, Director copia ese behavior en la ventana cast y es allí donde puede editarse. Los behaviors se agrupan en varias categorías (animation, controls… etc), cada una de las cuales contiene los behaviors relacionados con la acción para la que fue creado. Varias de esas categorías se dividen en subcategorías que agrupan los behaviors de acuerdo con los aspectos de la categoría principal para la que fueron creados. Las categorías de la Library Palette son: -

Animation: estos behaviors se aplican a sprites para que realicen numerosos efectos de animación y permitan al usuario manipular los sprites mientras se reproduzca la película. Existen tres tipos de behaviors de animación: automatic, interactive y transitions. o Los behaviors automáticos de animación se usan para animar sprites de forma automática e independiente. Aunque pueden ser activados mediante otro evento, no necesitan ninguna interacción del usuario. Algunos de estos behaviors se basan en fotogramas

- 28 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid

-

-

-

-

-

donde la acción sucede sobre un periodo determinado, sea cual sea el número de fotogramas que ocupe el sprite en el Score. o Los behaviors de animación interactiva requieren algún tipo de interactividad por parte del usuario para activarlos. La mayoría de este tipo de behaviors se utilizan para manipular los sprites durante la reproducción de la película. o Los behaviors de sprite de transición crean transiciones de una pantalla a otra, usando una característica de Lingo. Controls: los controles contienen una serie de behaviors diseñados para añadir interactividad e información en las películas. La mayoría de los behaviors básicos que se aplican a los botones pueden encontrarse en esta categoría Internet: contiene behaviors diseñados para construir películas que se vayan a mostrar principalmente a través de una web. Tiene tres subcategorías: forms, multi-user y streaming. o Forms: dispone de unos behaviors para crear formas que el usuario pueda rellenar en sus películas. Los datos después pueden ser enviados a un servidor y usados en otras aplicaciones, como bases de datos. Estos behaviors están dirigidos a usuarios avanzados y requieren un conocimiento de trabajo de las aplicaciones de servidores de red. o Multi-User: contiene behaviors para conectarse y desconectarse de un servidor. También, hay varios behaviors que sirven para crear “chat rooms” Shockwave, lo que permitirá a varios usuarios comunicarse entre ellos en la red. o Streaming: contiene behaviors que controlan los elementos de los medios de una película Shockwave descargada de Internet. Se pueden usar estos behaviors para mostrar una barra de progreso que muestre el estatus de la película cuando se esté descargando. Además, varios behaviors permitirán hacer un bucle de la película hasta que se hayan descargado todos los elementos de medios que se hayan definido. Java Behaviors: usados para dar salida a las películas de Director como applets de Java que se reproducen en la web. Están dirigidos a usuarios avanzados con grandes conocimientos de Lingo. Media: para controlar y añadir interactividad a las películas Flash, vídeo digital Quicktime, y sonido que haya sido importado hasta una película. Existen subcategorías distribuidas según el tipo de medio con el que el behavior está diseñado para trabajar: Flash, QuickTime ó Sound. o Flash: para añadir interactividad y controlar la reproducción y la calidad de una película Flash o de elementos individuales de Flash. o QuickTime: para crear controles personalizados y usarlos en la reproducción de una película QuickTime. o Sound: permiten reproducir un archivo de sonido vinculado ó externo. Navigation: se usan principalmente junto con los behaviors de control para determinar hasta dónde avanzará una película cuando el usuario haga clic sobre un sprite que contiene un behavior de control. También, otros behaviors controlan la duración del bucle de una película sobre un fotograma determinado. Paintbox: puede crear una aplicación de dibujo usando el propio programa. Estos behaviors controlan las funciones básicas necesarias para dibujar y pintar imágenes en la pantalla, incluyendo la selección de colores y pinceles, borradores, y deshacer acciones.

- 29 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid -

Text: para dar formato a texto, así como para crear efectos especiales con él. Hay varios behaviors que sirven para generar y mostrar vínculos de hipertexto para aplicaciones multimedia que interactúen con la web.

Adjuntar behaviors predefinidos a objetos Después de haber localizado y mostrado dentro de la Library Palette el behavior que se desee, basta con hacer clic sobre el icono, arrastrarlo y soltarlo sobre un sprite en el stage ó sobre una celda del canal script de la ventana score. Algunos behaviors requieren unos parámetros, llamados propiedades, que definene la acción ó designan un objetivo para la acción del behavior. Estos parámetros se ajustan en una ventana emergente que aparecerá al soltar el icono sobre el sprite. Un behavior solo se puede asignar a un sprite del stage ó a una celda del canal script de la ventana score. Los primeros se denominan sprite scripts (guiones de sprites) y pueden adjuntarse múltiples behaviors de éste tipo a un solo sprite para crear una acción más completa. Los segundos se denominan frame scripts (guiones de fotogramas) y solamente se podrá adjuntar un behavior de este tipo por fotograma (ó celda). Usar el Behavior Inspector El Behavior Inspector proporciona un medio para ver y editar los behaviors predefinidos y crear otros nuevos en un reparto. No se pueden modificar o borrar behaviors de la Library Palette, pero se podrán ver, editar, borrar ó crear un behavior en la ventana cast. Este inspector dará fácil acceso a la información del behavior, incluyendo el nombre, el tipo, su guion, su descripción, los nombres y los valores de sus parámetros asociados, y la extensión de los fotogramas donde se aplicó dicho behavior. Para abrir el Behavior Inspector ejecutar el comando Window/Inspectors/Behavior Inspector ó pulsando las teclas . El Editing Pane contiene el botón emergente Events and Actions (eventos y acciones). El Description Pane muestra una descripción de lo que hace ese behavior. El botón Parameters abre el cuadro de diálogo de parámetros del behavior, desde el cual se podrá cambiar las propiedades del mismo. El botón Script permite ver y modificar directamente el guion de Lingo usado para ese behavior. En la parte inferior del inspector se puede ver el tipo de behavior, el canal de sprite en el que se encuentra y los fotogramas que ocupa. Añadir behaviors usando el Property Inspector Es una manera rápida de asignar behaviors ya existentes en un cast a un sprite. Para activar la lengüeta Behavior en el Property Inspector basta con hacer clic sobre el botón Behavior en el Sprite Overlay. Para añadir el behavior simplemente se debe elegir el mismo en el botón emergente Behavior. Si el

- 30 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid behavior elegido tiene parámetros que deben ser configurados aparecerá un menú donde indicar los mismos. Añadir behaviors en la ventana Score En la mayoría de las situaciones, la forma más rápida de añadir behaviors a sprites es a través de la ventana score, sin necesidad de abrir el Property ó el Behavior Inspector. Este método no permite ver los parámetros que tiene el behavior, pero podrán verse y ajustarse en cualquier momento mediante el Property ó el Behavior Inspector. Para asignar un behavior a un sprite basta con hacer clic en el menú emergente Behaviors de la ventan score y elegir un behavior de entre los disponibles en los casts. También pueden quitarse todos los behaviors aplicados a un sprite ó crear un nuevo behavior. Y puede hacerse clic sobre el botón Behavior Inspector para activarlo. El orden de los behaviors adjuntos a un sprite Los behaviors se ejecutan en el orden en el que han sido adjuntados originalmente al sprite, a menos que se especifique un orden determinado. Para modificar el orden de ejecución debe cambiarse el orden en el que los behaviors aparecen en la lista del panel Behavior List en el Property Inspector ó en el Behavior Inspector. Crear un nuevo behavior Se puede crear un nuevo behavior desde la ventana Property Inspector haciendo clic sobre el botón emergente Behavior y seleccionando la opción New Behavior. En el cuadro de diálogo Name Behavior se introduce el nombre del nuevo comportamiento. La parte interesante de crear un nuevo behavior son los eventos y las acciones. Cada evento tiene su acción correspondiente. Puede asignarse más de una acción para cada evento. Se puede alterar la secuencia de las acciones dentro de un behavior usando las flechas Shuffle Up y Shuffle Down que están encima del panel Editing. Los eventos y las acciones A continuación se señalan los eventos disponibles para un comportamiento: -

MouseUp: ocurre cuando se suelta el botón izquierdo del ratón después de ser pulsado (segundo movimiento del clic). Es llamado una sola vez y solamente si se suelta el botón dentro del área activa del sprite.

- 31 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid -

-

-

-

-

-

MouseDown: ocurre cuando se pulsa el botón izquierdo del ratón (primer movimiento del clic) pero no se suelta. Por lo general, es mejor asumir que el usuario no ha hecho una selección (como hacer clic sobre un menú ó elemento) hasta que no haya soltado el botón. Esto le da al usuario la posibilidad de mover el cursor del ratón fuera del objeto si ha pulsado con el ratón sobre un objeto equivocado. MouseEnter: ocurre cuando el cursor se mueve dentro del área activa de un sprite. Este evento solamente se genera sobre cada entrada en el sprite, después de que se generan los eventos MouseWithin. MouseWithin: ocurre repetidamente mientras el cursor se encuentre dentro del área activa de un sprite (es decir, dentro del rectángulo delimitador del sprite, a menos que éste se muestre con un tintero mate). Las acciones generadas por este evento deberían ser cortas en este punto, ya que cuando se escribe un guion que responde a este evento, puede ralentizar el rendimiento si el ratón permanece dentro del área del sprite durante un espacio de tiempo prolongado. MouseLeave: el cursor se mueve fuera del área activa del sprite. Esta es la única ocasión en la que se llama a este evento. Es una buena manera de hacer que los botones vuelvean a su posición inicial (no pulsados), cerrar mensajes, ocultar mensajes emergentes y cosas similares. KeyUp: ocurre cada vez que se pulsa y se suelta una tecla. Solamente funciona para controles que tienen componentes de campo de texto, y solamente si el control actual está centrado. KeyDown: ocurre cada vez que se pulsa una tecla pero no se suelta. Solamente funciona para controles que tienen componentes de campo de texto, y solamente si el control actual está centrado. RightMouseUp: ocurre cuando se suelta el botón derecho del ratón. RightMouseDown: ocurre cuando se pulsa el botón derecho del ratón. PrepareFrame: ocurre después de que la cabeza de la reproducción salga de un fotograma y antes de que se dibuje en pantalla el siguiente fotograma. Es una buena opción para comprobar si un sprite visible necesita hacerse invisible ó viceversa. ExitFrame: se llama después de que un fotograma se haya dibujado y todos los sprites hayan sido probados por los eventos. Es un buen modo de navegar hasta fotogramas diferentes. BeginSprite: ocurre cuando la cabeza de la reproducción se desplaza hasta un fotograma que contiene el primer ejemplo del sprite. Este evento solamente ocurre una vez, incluso si la cabeza de la reproducción hace un bucle sobre el fotograma. EndSprite: ocurre cuando la cabeza de la reproducción abandona el último fotograma que contiene el sprite y se mueve hasta un fotograma donde el sprite ya no existe. El evento se genera después de ExitFrame. NewEvent: da la posibilidad de crear un manejador de evento personalizado para el behavior. Si se usa esta característica se necesitará saber cómo utilizar guiones con Lingo y cómo crea un manejador definido por el usuario.

Las acciones que desencadena un evento se agrupan en siete categorías, que son: -

Navigation: se refiere a acciones de navegación a través de una película. Esta categoría se divide en: o Go to Frame: ir a un frame concreto de la película. o Go to Marker: ir a un marcador. o Go to Movie: ejecutar una película diferente a la actual.

- 32 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid

-

-

-

-

-

-

5

o Go to Net Page: abrir una página web. o Exit: cerrar la película. Wait: esperar hasta que ocurra otro evento. Se divide en: o On current fame: espera en el fotograma actual. o Until Clic or Key Press: hasta que ocurra un evento de clic del ratón ó tecla. o For Time Duration: espera durante un tiempo determinado en el frame actual. Sound: acciones relacionadas con reproducción de sonido. Se divide en: o Play Cast Member: reproducir un miembro de reparto de audio. o Play External File: reproducir un archivo externo a Director de audio. o Beep: reproduce un bip del altavoz de sistema. o Set Volume: establecer el volumen general del canal de sonido para la reproducción de la película. Frame: realiza acciones que actúan sobre un fotograma de la película. o Change Tempo: cambia el tempo ó tiempo de ejecución. o Perform Transition: crea una transición entre el frame actual y el siguiente. Director tiene multitud de transiciones predeterminadas. o Change Palette: cambia la paleta de colores asignada a un frame concreto. Sprite: realiza acciones sobre el sprite al que se le ha asignado el behavior. o Change Location: cambia la posición del sprite en el stage. o Change Cast Member: cambia el miembro de reparto del sprite actual por otro miembro de reparto, generalmente del mismo tipo. Suele usarse para realizar rollover, es decir, cambio del estado del botón al poner el puntero encima. o Change Ink: cambia el efecto de tintero asignado al sprite actual. Cursor: realiza acciones sobre el cursor o puntero. o Change Cursor: cambia el puntero actual, normalmente una flecha, por otro cursor, ya sea uno de los incluídos en Director (mano, dedo, reloj… etc) ó uno importado a un cast por el usuario. o Restore Cursor: restaura el cursor a aquél estado que tenía antes de cambiarlo, normalmente la flecha. New Action: crea una nueva acción. Requiere conocimiento sobre Lingo.

RECURSOS EXTERNOS A DIRECTOR

Los formatos que soporta Director Los formatos que se pueden importar a Director mediante el comando File/Import son: -

Imagen: BMP, GIF, JPEG, LRG (xRes) PhotoShop 3.0 ó posterior (soporta transparencia y canal alfa), MacPaint, PNG (soporta canal alfa), TIFF, PICT (soporta canal alfa), Targa. Animación y multimedia: Películas Flash, GIFs animados, PowerPoint, películas de Director, archivos de reparto externos a Director. Archivos de imágenes múltiples: PICS y Scrapbook para Macintosh; FLC y FLI para Windows.

- 33 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid -

Sonido: AIFF, WAV, MPEG3, Shockwave audio (SWF), QuickTime audio, Sun AV, formatos IMA comprimidos y descomprimidos. Vídeo: QuickTime, QuickTime VR, AVI (sólo Windows). Texto: RTF, HTML, ASCII (.txt) Paleta: PAL, PhotoShop, CLUT

Los Xtras Los Xtras son análogos a los plug-ins de los navegadores ó de programas como Adobe PhotoShop. Dan operatividad a Director con las nuevas tecnologías, permitiendo incluir multitud de recursos externos. Se puede acceder a los miembros de reparto que crean los Xtras, como los tipos de letras ó GIFs animados, ejecutando el comando Insert/Media Element. Estos miembros de reparto serán entonces importados hasta la ventana cast y serán iguales que los demás miembros de reparto. Los Xtras se contienen en una carpeta ó directorio con el mismo nombre, dentro de la carpeta de instalación de Director. Para añadir ó eliminar un Xtra bastará con añadir ó eliminar el archivo que contenga ese Xtra de la carpeta de Xtras. Existen cinco tipos de Xtras: -

Cast Member Xtras: aumentan las ventajas y los medios disponibles para usar en una película. Transition Xtras: para controlar la apariencia de las transiciones de un fotograma al siguiente. Script Xtras: para añadir comandos al lenguaje de Lingo. Tools Xtras: proporcionan recursos de desarrollo para la creación de códigos y solución de problemas. Import Xtras: incluyen el código necesario para importar un tipo determinado de medio.

- 34 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid

6 6.1

ACTIVIDADES PRÁCTICAS ANIMACIÓN BÁSICA

El objetivo principal de este primer ejercicio aprenderemos a hacer una animación básica con macromedia director. Queremos hacer un rótulo con una serie de efectos que lo hagan atractivo. En concreto proponemos rodear el rótulo como el de la figura con estrellas que se enciende y apagan y con pequeñas bolas que se mueven alrededor del rótulo.

Paso 1: Determine el tamaño del stage y su color de fondo: Modify>Movie>Properites. Pondremos un tamaño de 300x100 pixel con un color de fondo tenue. Paso 2: Cree los personajes. Podría optar por diseñar los personajes con el editor de texto y de imágenes de Director. Eso podría suponer un ahorro considerable de memoria. Sin embargo, si sabe manejar algún editor gráfico externo, quizá pueda aprovecharse de las capacidades de éste. Nosotros hemos creado los personajes del cast con Corel Draw. Los elementos son exportados en Corel como imágenes GIF o JPEG. Después son importados con la opción Archive>Import. Como las imágenes son pequeñas, no es recomendable en este caso emplear la opción “link to external file”. Paso 3: Colocamos los personajes en el escenario. Un mismo personaje puede emplearse varias veces. Podemos cambiar las propiedades de los sprites con la ventana Property Inspector. Paso 4: Hacemos que las estrellas parpadeen. Actuaremos directamente en el score. Cada sprite tiene un canal asociado. Se trata de modificar la presencia o no de ocupación en el canal. Paso 5: Movemos las bolas en torno al rótulo. Haciendo click en el sprite que quiere mover, aparece un punto en su interior. Arrastre dicho punto. Acaba de definir una

- 35 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid trayectoria de movimiento. Pulsando Alt en la trayectoria y arrastrando puede curvar la trayectoria. Observe que en el canal del sprite aparece un cuadro clave. Paso 6: Cambie el brillo de las estrellas. Introduzca un cuadro clave en el canal del sprite correspondiente. Modifique la propiedad de transparencia. Paso 7: Rote una estrella: Introduzca un cuadro clave y ahora modifique la propiedad de rotación. Alineamiento de elementos Grids: View-> Guides and Grids->Settings Para ajustar sprites a líneas de referencia. Window-> Align Para alinear y distribuir sprites

6.2

TRANSICIONES ENTRE CORTINAS

Contaremos una historia mostrando una serie de fotos. La transición entre fotografías se hará en base a cortinas. Imagine por ejemplo que hace un viaje a Sevilla y quiere contarlo a sus amigos enseñandoles fotos. Podría pensar en hacer unas serie de apartados, por ejemplo: el viaje de ida, el hotel, el barrio de Santa Cruz, el barrio de Triana, la vida nocturna y el viaje de vuelta. Usted tiene fotos para cada uno de estos apartados. Típicamente, presentará un rótulo de presentación de cada apartado y después presentará las fotos separadas por cortinas. Paso 1: Guarde las fotos de los distintos bloques en distintos directorios. Esto es opcional, pero siempre ayuda ser ordenado. Paso 2: Importe las distintas fotos. Es importante importarlas como “link to external file” porque si no, ocuparían mucho en memoria. Emplee un cast diferente para cada una de los bloques de fotos.

- 36 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid

Paso 3: Cree los rótulos con el editor de texto. Puede poner los rótulos en el Internal cast. Paso 5: Coloque los elementos en el stage. Típicamente deberá poner los elementos en secuencia. Cada elemento puede ocupar sólo un frame en el score. La figura muestra el aspecto del stage, los distintos cast empleados, y el score. Paso 6: Haga click en el canal de transiciones y pruebe las distintas opciones de cortinas.

La figura muestra la ventana asociada al canal de transiciones. Categorie indica el tipo de transición, Transition indica la forma en que se realiza la transición. Duration, Smoothness, Affects son variaciones sobre dicha transición.

- 37 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid 6.3

NAVEGACIÓN BÁSICA

Queremos hacer una aplicación en la que se muestre un menú con diferentes opciones. Al pulsar sobre cada opción, se desencadenará una acción diferente. Volviendo al ejemplo del viaje a Portugal, supongamos que en lugar de ofrecer las fotos de forma secuencial, queremos hacerlo desde un menú. Habrá una botonera donde se ofrecen las diferentes opciones: Viaje, Coimbra, Paso 1: Creamos un menú como el que se muestra en la figura. Es conveniente crear los botones por separado. De este modo, podremos asociar comportamiento a dichos botones independiente del resto de animación. Paso 2: Crear las diferentes escenas de destino. Cada botón condicirá a una escena diferente. Típicamente, en cada escena, se mostrarán una serie de fotos. Para ello, podemos hacer un cast para cada una de las escenas. Importaremos los elementos de cada escena en cada uno de los casts. Una vez que tenemos los personajes de cada escena en su cast correspondiente, reservaremos una zona del score para cada una de las escenas. Montaremos las escenas en dicha zona. Paso 3: Incluir una etiqueta en cada parte de la escena. En la parte superior de los canales, podemos añadir una etiqueta que sirva para nombrar cada una de las escenas. Esta etiqueta será la referencia para cada botón. Paso 4: En este momento tenemos definido el menú principal y cada una de las escenas. Estamos en condiciones de definir la navegación. La navegación necesaria será: 1. Al pulsar en un botón ir a una zona de la película determinada. 2. Hacer que el cabezal permanezca en un frame determinado hasta que se pulse un botón. Para la primera de las opciones de navegación, lanzamos la ventana de Behavior Inspector que aparece en la figura y definimos un evento como el que se muestra. Primero se le da un nombre al evento. Después se selecciona el evento que desencadena la acción y por último se indica la acción. En este caso la acción es de Navegación.

- 38 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid

Una vez definido el evento, éste aparece en el cast que estemos empleando. El comportamiento deberá ser arrastrado al botón correspondiente. Para el segundo de los comportamientos, empleamos la librería de comportamientos. Seleccionamos el comportamiento Hold on Current Frame y lo arrastramos al canal de comportamientos. El canal de comportamientos es el que ocupa la última posición en los canales especiales. La figura muestra la librería de comportamientos, en concreto la parte de Navegación.

- 39 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid 6.4

EFECTOS EN LA NAVEGACIÓN

En este ejercicio aprenderemos a mejorar el aspecto de nuestras animaciones basadas en menú. Hiremos añadiendo sofisticación a la película creada anteriormente. 6.4.1

Añadir un botón

Paso 1: Al hacer click en una opción del menú, vamos a una parte dinámica no estática. Por ejemplo, las fotos se mueven. Esto es muy sencillo. Podemos hacer que la zona correspondiente de la película sea una animación con las técnicas que ya conocemos. Al finalizar dicha escena, no utilizaremos el evento Hold on Current Frame sino otras opciones como por ejemplo Go Loop. También pueden utilizarse las opciones de animación del library Paso 2: Hacer que los botones realmente sean botones. O sea, que al hacer click en un botón, éste simule haber sido pulsado, y que al soltarlo vuelva a su posición original. Elegimos en library la opción Controls>PushButton. Arrastramos dicho control al cast. Al arrastras esta opción al escenario podemos configurarlo para cambiar el aspecto del botón.

Seleccionamos los miembros del cast que representan al botón cuando está normal (Standard), cuando pasamos el ratón por encima (Rollover) y cuando hacemos click (MouseDown). Previamente deberíamos de haber dibujado un member diferente para cada uno de los estados. 6.4.2

Film Loop

Un Film Loop es una animación en sí misma que es considerada como un elemento más del cast y del que se pueden hacer varios sprites.

- 40 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid

Paso 1: Crear una animación básica: Haga un cuadrado con la herramienta Windows-> Vector Shape y cree una animación con el mismo que consista en que un cuadrado se apaga y enciende a la vez que otros cuadrados de diferente tamaño aparecen y desaparecen.

Paso 2: Cree un Film Loop: Seleccione en el Score los elementos que componen la animación básica. Cree el Film Loop con la herramienta Insert->Film Loop… Aparecerá un nuevo elemento en el Cast.

Paso 3: Uso del Film Loop: Arrastre el nuevo elemento desde el Cost al Stage tantas veces como considere oportuno y modifique sus propiedades. También puede borrar los sprites que utilizó para crear el Film Loop.

Paso 4: Uso en botones. Un Film Loop puede usarse como elemento de un botón y es la mejor manera de hacer botones con animación.

6.4.3

Utilizar varias películas

¿Por qué no hacer que cada una de las escenas sea una película individual? Es una idea muy buena ya que de este modo, podemos reutilizar escenas en otras películas que podamos programar. Para ello, simplemente se define cada escena en un .dir diferente. Para saltar a cada una de las escenas, se utiliza el evento Library>Navegation>Play Movie para saltar a otra película. Utilizamos Library>Navigation>Play Done para volver a la película desde la que se hizo la llamada. Play Done debe ponerse en el canal de frames. Play Movie debe ponerse sobre el sprite en el que hacer clic. 6.4.4

Cambiar el cursor

Paso 1: Hacer que algo cambie al pasar con el cursor por algún sitio. Utilice los eventos On Mouse Enter y On Mouse Leave. Cuando entre vamos a otra escena y cuando salga volvemos a la escena original.

- 41 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid Paso 2: Cambie el cursor cuando entre en un objeto. Utilice los eventos On Mouse Enter y On Mouse Leave. La acción será Cursor>Change Cursor o Cursor>Restore Cursor. Paso 3: Personalizar el cursor: Hacemos un bmp 16x16 8 de profundidad. Cargamos el cursor en el cast. Insert>Media Element>Cursor. Aparece la ventana de la izquierda. Buscar el elemento en Cast y Add. Puedo poner varios para hacer animaciones. Se hace el evento Cursor/Change Cursor, se pone cualquiera y luego se modifica. on mouseEnter me cursor (member “nombre”) end 6.4.5

Finalizar la película

Incluya un botón de Salir que finalice la película. Creamos un comportamiento para que al hacer click en un objeto la acción sea finalizar la película. Para ello, seleccióne NewAction. En la acción escriba quit

- 42 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid

6.4.6

Texto flotante

Cómo hacer que al pasar el ratón por una zona sensible aparezca un texto flotante. (tooltip). 1. Crear un texto y arrastrarlo al escenario. En este texto podemos poner el formato del texto final, no el contenido. 2. Abrir Library Palette -> Controls y seleccionar Display Text. Arrastrar este comportamiento sobre el texto anterior. Aparece la ventana

Ahora puedes elegir entre “status bar” para que el mensaje aparezca en la barra de debajo de la ventana o “tootip” para que el mensaje aparezca junto a cualquier sprite. 3. Abrir Library Palette -> Controls y seleccionar ToolTip. Arrastrar este comportamiento sobre el sprite que queremos que reaccione. Aparece la ventana

Ahora pueden cambiarse las propiedades incluso el contenido del texto que queremos que aparezca.

6.5

TEXTO

- 43 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid El texto es uno de los elementos básicos en toda aplicación multimedia. En esta actividad aprenderemos a incluir texto básico y algunas sofisticaciones avanzadas.

Opciones Básicas Paso 1: Crear el texto con la opción Window->Text. Editar el texto y elegir el tipo de fuente. Paso 2: Llevar el texto desde el cast al escenario y editar las propiedades del texto. Las opciones Foreground y Background servirán para modificar el color del texto y el color del fondo. Una pestaña en la ventana de propiedades denominada Text permite incluir en scroll en la opción Framing.

Opciones avanzadas Paso 1: Incluimos un scroll personalizado.

Paso 1.1: Dibujar los elementos del scroll. Un scroll tiene 4 elementos básicos: El botón de subir (upArrow), el botón de bajar (downArrow), el mando para arrastrar

- 44 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid (Dragger) y la barra sobre la que mueve el scroll (Bar). Dibuje o importe 4 elementos gráficos que harán de upArrow, downArrow, Dragger y Bar. A la hora de dibujar estos elementos, tenga la precaución de dibujar elementos de un tamaño adecuado. Paso 1.2: Arrastre los 4 elementos al stage. Tenga la precaución de no ajustar el tamaño de los sprites que acaba de crear porque después los elementos aparecerán desplazados. Paso 1.3: Use el comportamiento Custom Scrollbar de Library->Text. Arrastre este comportamiento a cada uno de los sprites diseñados. Es importante elegir el tipo de comportamiento con la opción Current Sprite Acts as… También es importante elegir correctamente el sprite texto al que hace referencia con Scroll the member of…

Paso 2: Mejorar el aspecto del scroll. Podemos reducir el aspecto angulado del texto superponiendo una máscara. Dibuje un elemento con Window->Paint y emplee un degradado tipo Direccional->Sun Brust. Después aplique una transparencia.

- 45 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid

Paso 3: Insertar la fuente. Cuando emplee un tipo de letra original que pueda no estar en otros ordenadores donde quiera ver su aplicación corre el riesgo de que el aspecto de su aplicación difiera significativamente del esperado. Puede evitarse insertando la fuente con Insert->Media Element->Font… Puede incluir toda la fuente o sólo una parte de ella.

Paso 4: Añadir un hipervínculo: Window -> Text Inspector. Seleccionar las palabras en las que quiero hacer un hipervínculo. Añadir en la entrada correspondiente.

- 46 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid 6.6 6.6.1

CONTROL DE SONIDO Poner un fondo musical a la película

Queremos recordar en este punto que el uso de música sin el consentimiento de los autores es un delito perseguido por la Asociación General de Autores de España. Paso 1: Importar un fichero de audio. El formato puede ser mp3, wav o shockwave. Shockwave es un formato que pertenece a Director, y por eso, conviene utilizarlo. Al importar un fichero de audio hay que prestar atención a la opción Link as External File. Un tema musical puede ocupar mucha memoria si no se ejecuta carga como External File. Paso 2: Si se desea que la canción seleccionada vuelva a empezar una vez que ha terminado, debe activar la opción loop en las propiedades de la canción. Paso 3: Colocar el tema o temas en los canales de audio. Ver sección 2.2.2. Puede elegir el instante de comienzo y finalización de la banda sonora. 6.6.2

Dar sonido a los objetos de la película

Queremos ahora dar más vida a los objetos de la película, haciendo por ejemplo que al pasar el ratón por encima o al hacer click emitan algún sonido. Paso 1: Importar los ficheros de audio. Típicamente importaremos sonidos cortos. Paso 2: Crear el comportamiento. Window>Inspectors>Behaviors. Seleccionar el evento al que queramos asociar un sonido. Seleccionar la acción Sound, y elegir entre tocar un fichero externo o un miembro de cast. En cualquier caso seleccionamos el sonido a ejecutar. Paso 3: También puede utilizar el Librery Palette en la opción de sonidos Sound. Utilizando esta librería puede Parar los sonidos al pasar por un frame o al actuar sobre algún sprite. 6.6.3

Parar la música

En ocasiones queremos que la música de fondo que suena en un determinado canal se pare. Para ello, deberá seguir los siguientes pasos: Paso 1: Defina un comportamiento para parar el audio de un determinado canal. El evento que haga detener la música, puede ser cualquiera de la lista de evntos disponibles. Nosotros vamos a emplear Exit Frame. A la hora de definir un Action, debemos emplear la opción New Action. Esto nos abrirá una ventana como la de la figura de abajo y escribiremos el comando sound(Canal).stop( ). Donde canal es el número de canal que queremos detener. En la figura de abajo, detenemos el canal número 1.

- 47 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid

Paso 2: El nuevo comportamiento que acabamos de crear es un comportamiento asociado a un frame. Como hemos visto en la sección 4, los comportamientos pueden asociarse a un frame o a un sprite. En el caso de los eventos de tipo frame, deben arrastrarse al canal de comportamientos de frame.

6.7 6.7.1

CONTROL DE VIDEO Incluir un fichero de vídeo en la película

En una película de macromedia director pueden incluirse ficheros de vídeo de diversos formatos: gif animado, avi y mov. Un fichero de vídeo puede ser considerado un elemento más de la película, y recibir un trato similar al de los demás miembros del cast. Así, deberemos incluir los ficheros de vídeo en el cast y después llevarlos al stage. Podemos emplear la ventana de propiedades del cast member para alterar alguna de las propiedades:

- 48 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid

Determina como aparece la imagen cuando se escala, rota etc... Con Crop, se conserva el tamaño del video y con Scale se ajusta el vídeo a la nueva zona.

Determina como sincronizar el vídeo y el audio asociado al fichero de vídeo. Sync to Sound, hace el vídeo se salte frames para ir acorde a la música.

Sin embargo, la inclusión de vídeo presenta una serie de problemas que hay que tener en cuenta. Un vídeo es de por sí una animación. Esto implica que tiene una duración. ¿Qué ocurre si la duración del vídeo es menor que la duración de la película?. Podemos poner el evento Hold on Current Frame en el frame en el que se ha colocado el vídeo. Sin embargo, poner el evento Hold on Current Frame implica que hay que programar alguna forma de salir de la escena que muestra el vídeo. Propongo hacer una escena donde aparezca el vídeo y se incluya un control para salir de la escena, lo que sería equivalente a dejar de ver el vídeo. Si el vídeo es Quicktime (.mov), puede emplearse la opción Show Controler para hacer Play, Pause, Stop etc... sobre el vídeo.

Películas

Hacer una escena con un enlace para ver un vídeo como la de la figura. Tenemos un vídeo con controles personalizado.

- 49 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid

Paso 1: Importar el vídeo. Es conveniente emplear formato QuickTime porque este formado permite incluir controles. Paso 2: Crear el diseño de los controles. Paso 3: Arrastrar el vídeo al store. Paso 4: Para tener control sobre el vídeo, es necesario incluir el control Hold on Current Frame en el frame donde está el vídeo. Paso 5: En las propiedades del vídeo puede encontrarse una pestaña llamada QuickTime que permite incluir la opción Paused y Controls e incluir controles para tener control sobre el vídeo. Paso 6: Añadir los controles que hemos dibujado y asignarles los comportamientos específicos de control de vídeo que encontramos en Window->Library Palette>Media->QuickTime. Elegir QuickTime Control Botton Paso 7: Añadimos un control para movernos por el vídeo. Este control tiene que tener Window->Library Palette->Animation->Interactive->Constrain to Line. Esto obligue a que el movimiento de este control se limite a una recta. Este control envía

- 50 -

Dpto. Informática Escuela Universitaria Politécnica Universidad de Valladolid información al video de la posición relativa en la que se encuentra en cada momento. Hay que indicar cual es el sprite del vídeo al que va a enviar la posición: Broadcast position to sprinte Paso 8: Asignamos ahora el comportamiento en Window->Library Palette->Media>QuickTime. QuickTime Control Slider al vídeo. Hay que decir el canal en el que está el sprite desde el que recibe la posición: Slider Sprite.

- 51 -