En este primer apartado se comentarán ciertos aspectos que suelen ser comunes a los distintos tipos de aplicaciones educativas, y veremos cómo se pueden utilizar en Flash, siempre desde el punto de
vista de que el objetivo final es que la aplicación sea accesible para personas con discapacidad visual.
Inserción de sonidos en fotogramas
Mediante esta acción se pueden introducir sonidos en un determinado fotograma de nuestra película principal (o de un clip, o de un botón), esto permite que se escuche ese sonido cuando la ejecución llega a dicho fotograma.
Para poder insertar un sonido en un fotograma, la forma más sencilla será utilizando el panel de Propiedades, correspondiente al fotograma.
Todos los sonidos que se pretenda usar en fotogramas deben estar en la biblioteca, por tanto el primer paso para usar un sonido será importarlo a la biblioteca mediante la opción correspondiente en el menú Archivo.
Si queremos insertar un sonido en un determinado fotograma, debemos seguir los siguientes pasos:
- Seleccionar el fotograma en la línea del tiempo. - Abrir el panel Propiedades.
- Desplegar la lista sonido, en la cual aparecerán todos los sonidos contenidos en la biblioteca.
- Seleccionar en la lista el sonido deseado.
- A continuación se puede seleccionar un efecto en la lista de efectos, y si se desea se puede editar mediante el botón correspondiente.
- Por último se puede definir el número de veces que se repetirá el sonido, o si se desea que lo haga indefinidamente.
A continuación se muestra el aspecto del panel de Propiedades del fotograma, en el cual en la parte derecha se encuentran todos los controles que se usan con los sonidos.
Figura 6: Panel de propiedades de fotograma.
Es necesario destacar que si lo que se pretende es colocar una música de fondo en la aplicación, lo que debe hacerse es insertar esta música en el primer fotograma de la película principal, y determinar que se repita indefinidamente.
Por último existe otra forma de reproducir sonidos en fotogramas, mediante el uso de ActionScript, aunque puede resultar más compleja para usuarios de Flash con poca experiencia en programación.
Lo primero que se debe hacer es crear un objeto Sound, y en el fotograma en el cual se quiere insertar el sonido, se deben asociar las siguientes acciones:
Asignar un sonido al objeto Sound, mediante el método loadSound() en el caso de que el sonido esté fuera de la aplicación en una ubicación determinada, o bien usando el método attachSound(), en el caso de que el sonido se encuentre en la biblioteca, y haya sido previamente vinculado para poder usarlo en ActionScript.
Una vez cargado se lanzará el sonido mediante el método start().
En cuanto a las posibilidades que nos ofrece la inserción de sonidos en fotogramas, en el ámbito de la accesibilidad, podemos destacar las siguientes:
- Dotar a nuestra aplicación de una música de fondo, la cual permita detectar al usuario que la aplicación está activa.
- Dotar de sonidos a los diferentes estados de un botón, ya que cada uno de ellos no es más que un fotograma. En el caso de alumnos con discapacidad visual son especialmente susceptibles de asignarles un sonido los estados sobre (cuando el botón recibe el foco), y presionado (cuando se hace click sobre el botón o se pulsa Enter).
Repetición automática de mensajes a lo largo del tiempo
Mediante este procedimiento podremos recordar al alumno con discapacidad visual lo que debe hacer en la aplicación, en el caso de que pase un periodo de tiempo sin interactuar con el programa, es decir veamos como podemos introducir en Flash mensajes de recuerdo.
La forma de realizar este proceso es mucho más sencilla de lo que en principio puede parecer, para ello utilizaremos lo visto en el apartado anterior, inserción de un sonido en un fotograma, y podemos aprovechar la filosofía de funcionamiento de Flash, mediante la cual creamos una película basada en una línea de tiempo.
Para repetir un sonido lo primero que se debe hacer es crear un clip de película, el cual no va a realizar ninguna acción y de hecho podemos colocarlo fuera del escenario.
En este clip de película insertaremos un sonido (el mensaje que se quiere que se reproduzca para recordar al alumno lo que debe hacer) en el último fotograma del clip de película, y determinamos que se repita una vez.
Lo único que queda por hacer es determinar el tiempo que tardará en repetirse el mensaje, para esto podemos utilizar la velocidad de reproducción de la película, por ejemplo, si la velocidad de reproducción esta fijada en 12 fps (fotogramas por segundo), y queremos que el mensaje de recuerdo se repita a los 30 segundos sin
interacción por parte del usuario, el clip de película creado para reproducir el mensaje, deberá tener una duración de 360 fotogramas, y será por tanto en el fotograma 360 de ese clip, donde se insertará el sonido.
Por último lo que queda por hacer es utilizar correctamente el clip de película creado, para ello debemos hacer lo siguiente:
- Insertar el clip de película en el fotograma 1 de la película principal, como se ha dicho anteriormente puede estar incluso fuera del escenario.
- Cada vez que el usuario interactúe con la aplicación, es decir se produzca un evento de ratón o de teclado, se debe reiniciar el clip de película mediante la siguiente instrucción de ActionScript.
clipMensaje.gotoAndPlay(1);
Donde clipMensaje es el nombre de instancia que se haya dado al clip de película que creado para controlar la repetición del mensaje.
Desarrollo de mecanismos de manejo con teclado
En cuanto a la accesibilidad para usuarios con discapacidad visual es de suma importancia que la aplicación que se desarrolle, sea del tipo que sea, se pueda manejar con teclado (además de con el ratón). En Flash se puede realizar esta funcionalidad de varias formas, las cuales se verán en este apartado.
Manejo con tabulador y Enter
Este es el mecanismo más sencillo de implementar, simplemente es necesario asignar un valor a los objetos en el campo Índice de fichas del panel de Accesibilidad, o asignar un valor a la propiedad tabindex de los objetos mediante ActionScript.
Manejo con flecha arriba y abajo y barra espaciadora
Mediante este sistema al pulsar flecha arriba o abajo el usuario se irá moviendo por los elementos activos de la aplicación, al siguiente o al anterior, y al pulsar la barra espaciadora se activará el elemento en el que se encuentre en ese momento.
Para implementar este mecanismo en el primer fotograma de la película principal se define una variable de tipo numérico, en la cual se irá guardando el valor del elemento que debe activarse, según se pulse flecha arriba o abajo.
Por otra parte se crea un botón que no hace nada, simplemente recoger los eventos de teclado, y se coloca fuera del escenario en la capa de nivel superior de la película principal.
Con todo esto el código ActionScript para controlar este mecanismo de manejo con teclado sería algo parecido a lo siguiente:
En el fotograma 1:
var foco:Number; foco = 0;
En el botón que controla la pulsación de teclas:
on (keyPress “<Up>”){
if (foco == n){ // n es el número de elementos //que se deben recorrer foco = 1; }
else{
foco++;
} } on (keyPress “<Down>”){ if (foco <= 1 ){ foco = n; } else{ foco--; } } on (keyPress “<Space>”){ switch (foco){
case 1: acciones del objeto 1;
break; case 2: acciones del objeto 2;
break; case n: acciones del objeto n;
break; default:break;
} }
Manejo con determinadas teclas del teclado
Mediante este mecanismo se pueden asociar acciones a la pulsación de determinadas teclas, para ello la forma más sencilla de desarrollarlo es la siguiente:
Se crea un botón como en el caso anterior, que será quien recoja la pulsación de teclas. Si por ejemplo lo que se desea es que la aplicación se maneje con los números del teclado, el código ActionScript asociado a ese botón sería el siguiente:
on (keyPress “1”){
acciones asociadas a la pulsación del número 1 }
on (keyPress “2”){
acciones asociadas a la pulsación del número 2 }
on (keyPress “3”){
acciones asociadas a la pulsación del número 3 }
En definitiva se debe colocar en el evento keyPress, la tecla que se quiere controlar, entre comillas.
Generación de números aleatorios
Los números aleatorios son números que la mayoría de lenguajes de programación generan al azar.
Por supuesto ActionScript también ofrece esta posibilidad, y son de gran utilidad, sobre todo en el campo de las aplicaciones educativas. Algunos casos en los que nos pueden ser útiles son estos:
- Mostrar una serie de objetos al azar, de todos los que se disponga en la biblioteca, así en cada ejecución de la aplicación aparecerán objetos distintos, y por tanto para el alumno será más complicado memorizar la resolución de la actividad.
- Seleccionar aleatoriamente la posición de los objetos de entre varias predefinidas, muy útil en el caso de actividades tipo memory, con el fin de que las casillas no estén siempre en el mismo orden.
- Posicionarse en un fotograma u otro dependiendo de un número aleatorio. Esto permite que la ejecución de la aplicación no siga siempre el mismo orden.
- Crear actividades basadas en el azar como por ejemplo juegos que se basen en dados.
En ActionScript 2.0 para obtener un número aleatorio utilizaremos dos métodos del objeto Math:
- Math.random(): Que devuelve un número aleatorio entre 0.0 y 1.0.
- Math.ceil(x): Devuelve el valor entero mayor más cercano de x, es decir, si x vale 2.315, devolverá 3.
Con estos dos métodos la forma de obtener un número aleatorio será la siguiente:
numero = Math.ceil(Math.random() * valor_maximo);
Donde numero es una variable de tipo numérico, y valor_maximo es el mayor número que pretendemos obtener.
Veamos un ejemplo:
Supongamos que queremos obtener un número al azar entre cero y diez, la instrucción para conseguirlo sería:
var n:Number; n = 0;
n = Math.ceil(Math.random() * 10);
Por último se puede reseñar que existe otro método, Math.round(), que se puede utilizar en vez de Math.ceil(), y lo que hace es devolver el redondeo del valor que se pasa como parámetro.
Cambio de aspecto del puntero del ratón
Este procedimiento puede ser muy útil, en cuanto a la accesibilidad para usuarios con un cierto resto visual, ya que permite que la visualización del puntero del ratón sea más cómoda para estas personas.
Además puede ser una forma de aumentar el interés y la motivación para la aplicación educativa, para alumnos de corta edad, ya que se puede crear un puntero del ratón mucho más atractivo para estos usuarios que el puntero estándar.
Para utilizar un puntero de ratón personalizado, obviamente nos basaremos en los métodos y propiedades del objeto Mouse. Veamos los pasos que debemos seguir para crearlo y utilizarlo.
- Crear un clip de película, que será el nuevo puntero del ratón, puede ser un gráfico fijo o contener animación.
- Insertar una instancia del clip de película en el fotograma 1 de la película principal, se recomienda colocarlo fuera del escenario, y lo más importante es que debe colocarse en la capa de nivel superior, para que cuando se mueva el ratón el nuevo cursor pase por encima de todos los objetos del escenario.
- Ocultar el puntero del ratón, para esto se utiliza el método hide() del objeto Mouse
- Asignar las coordenadas de pantalla x e y al clip de película que va a ser el nuevo puntero.
- Comenzar a arrastrar el clip de película, mediante el método startDrag()
- Para volver a restaurar el puntero por defecto se debe utilizar el método show() del objeto Mouse.
En definitiva el código para cambiar el puntero del ratón sería algo parecido a lo siguiente, teniendo en cuenta que el nombre de instancia del clip de película que va a ser el nuevo puntero se llama nuevo_puntero
Mouse.hide(); //Se oculta el puntero del ratón nuevo_puntero._visible = true;
//Se hace visible el nuevo puntero
//Se lleva el nuevo puntero a las coordenadas //del ratón en pantalla
nuevo_puntero._x = _root._xmouse; nuevo_puntero._y = _root._ymouse;
//Se comienza a arrastrar el nuevo puntero nuevo_puntero.startDrag();
Inserción y control de vídeos
En ciertas aplicaciones puede ser necesaria la utilización de un archivo de vídeo, en este apartado se verá cómo se pueden integrar vídeos en una película Flash, y cómo se pueden controlar de una forma sencilla.
Los formatos de ficheros de vídeo que se pueden insertar en una película Flash son los siguientes: .mov, .avi, .mpeg y .flv.
Para insertar un vídeo en una película Flash se deben seguir los siguientes pasos:
En el menú Archivo seleccionar la opción Importar>Importar a biblioteca
En el cuadro de diálogo que se abre elegir el archivo de vídeo que se quiere insertar y pulsar el botón Abrir.
En este momento se abrirá el asistente para importar vídeo, en la primera pantalla se debe elegir dónde se encuentra el fichero (su ubicación ya aparece por defecto en el cuadro de edición correspondiente), y pulsar el botón Siguiente.
En la pantalla siguiente, Flash pregunta cómo se desea implementar el vídeo, de todas las opciones se debe seleccionar Incorporar vídeo en SWF y reproducir en la línea del tiempo, ya que con esta opción será más fácil su manejo desde la película Flash. Trás esto pulsar el botón Siguiente.
Nos encontramos en la pantalla en la que Flash pregunta cómo se quiere incorporar el vídeo, y ofrece varias opciones:
- En Tipo de símbolo seleccionamos Vídeo incorporado. - En Pista de audio seleccionamos Integrado.
Se selecciona la opción Expandir línea del tiempo si es necesario.
Por último se selecciona Incorporar todo el vídeo. Tras todo esto se pulsa el botón Siguiente.
En la siguiente pantalla se elige la codificación, que es la calidad del vídeo, obviamente a mayor calidad, mayor tamaño ocupará la
película. Tras seleccionar la codificación elegida se debe pulsar el botón Siguiente.
Por último aparece una pantalla en la que se muestran las opciones que se han seleccionado para la importación del vídeo, una vez que se pulse el botón Finalizar comenzará la misma.
Tras este proceso aparecerá el vídeo en la biblioteca, la forma más sencilla de manejarlo desde Flash, será introduciéndolo en un clip de película.
Para ello se crea un nuevo clip de película, y en su primer fotograma arrastramos el vídeo desde la biblioteca. En ese momento se abrirá un cuadro de diálogo en el que Flash nos informa del número de fotogramas que ocupa el vídeo, y pregunta si queremos ajustar la línea del tiempo a ese número de fotogramas. Se debe pulsar el botón Si, y ya tenemos el clip de película conteniendo el vídeo.
Dado que el vídeo está contenido en un clip de película, para manejarlo desde la aplicación, se insertará en el escenario una instancia de ese clip, y por tanto ya se puede manejar el vídeo mediante los métodos que controlan la línea del tiempo del clip de película, tales como play(), stop(), nextFrame(), prevFrame(), gotoAndPlay(), gotoAndStop().
Comportamiento de clips de película como botones
Ya se ha comentado que los símbolos más importantes de Flash son los clips de película, y de hecho cualquier otro tipo de símbolo podría transformarse en un clip de película.
En determinadas ocasiones puede ser muy útil, y más sencillo de manejar un clip de película que se comporte como un botón, que un botón propiamente dicho.
Los casos en los que puede tener utilidad este “truco”, entre otros pueden ser los siguientes:
- Cuando al pasar el ratón por encima del botón éste debe cambiar de apariencia, pero al dejar de estar el ratón sobre el botón debe mantener esa apariencia.
- Lo mismo del caso anterior, pero al hacer click con el ratón sobre el botón.
- Cuando una vez que se ha hecho click con el ratón el botón cambie de apariencia y ya no pueda volver a la inicial.
En el caso de aplicaciones educativas puede ser muy útil para desarrollar actividades de selección o del tipo memory, como ya veremos más adelante.
Para crear un clip de película que se comporte como un botón se deben seguir los siguientes pasos:
- Se crea un clip de película con cuatro fotogramas clave (el cuarto sólo es necesario si queremos que al hacer alguna acción sobre el clip, este quede en un estado fijo), en cada uno de ellos se introduce la instrucción stop() para que se detenga el clip de película.
- El primer fotograma será la apariencia del clip cuando no ocurre nada en él.
- El segundo será la apariencia cuando pasa el ratón por encima. - El tercero será la apariencia cuando se hace click con el ratón
sobre el clip de película.
Debemos tener en cuenta que cuando se habla de apariencia no nos referimos sólo a la apariencia gráfica, sino que también pueden tener distintos sonidos asociados lo cual es importante desde el punto de vista de la accesibilidad.
Una vez que tenemos creado el clip de película, se inserta en el escenario de la película principal y se le asigna un nombre de instancia.
Tras esto y mediante ActionScript se puede controlar el comportamiento del clip y hacerlo semejante al de un botón, asignando acciones convenientemente a los distintos eventos, rollOver, Press, rollOut, etc.
Más adelante todo esto quedará más claro, y su utilidad más patente, cuando se describa cómo realizar los distintos tipos de aplicaciones educativas de forma accesible.