Repositorio Institucional de Documentos
Abstract
En este proyecto se presenta la creación de nuevos juguetes tangibles capaces de interaccionar con el tabletop NIKVision. Ello ha servido para desarrrollar nuevas formas de interacción en juegos para este dispositivo. como resultado se presenta una serie de prototipos funcionales e interfaces gráficas que demuestran su funcionamiento en el tabletop. Samper Pérez, Pablo; Uruen Ruiz, Javier; Cerezo Bagdasari, Eva; Marco Rubio, Javier
Full text
Agradecimientos Gracias a Eva Cerezo y Javier Marco por su paciencia y su ayuda. A nuestras respectivas familias, que nos animaron y apoyaron, incluso con el desorden que hicimos durante la fabricación de los prototipos. Y en general a todos aquellos que se interesaron por nuestro trabajo.
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' <' ÍNDICE 1.!ÁMBITO DEL PROYECTO ............................ 3! 1.1!GIGA ............................................................. 5! 1.2!NIKVISION ....................................................... 5! 2.!OBJETIVOS ............................................. 7! 3.!DOCUMENTACIÓN ................................ 11! 3.1!INTERACCIÓN TANGIBLE ....................................... 13! 3.2!TABLETOPS ....................................................... 16! 3.3!SOFTWARE DE RECONOCIMIENTO Y FIDUCIALES ............. 18! 3.3.1 REACTIVISION ..................................................... 18! 3.3.2 FIDUCIALES ........................................................ 20! 3.3.2.1 Definición ............................................................................. 20! 3.3.2.2 Funcionamiento ..................................................................... 21! 3.3.2.3 Diseño de nuevos fiduciales ................................................... 24! 3.4!NIKVISION ..................................................... 25! 3.4.1 TABLETOP ........................................................... 25! 3.4.2 INTERACCIÓN TANGIBLE EN LA MESA ........................... 27! 3.4.3 JUEGOS Y JUGUETES .............................................. 30! 3.4.3.1 Granja ................................................................................. 30! 3.4.3.2 Asteroids .............................................................................. 31! 3.4.3.3 Juego musical ....................................................................... 33! 3.4.3.4 Juego de tráfico .................................................................... 34! 3.4.3.5 Juego de piratas ................................................................... 34! 3.5!FIBRA ÓPTICA ................................................... 36! 4.!TRABAJO REALIZADO ............................. 41! 4.1!METODOLOGÍA Y DECISIONES GENERALES DE DISEÑO ..... 43! 4.1.1 METODOLOGÍA .................................................... 43! 4.1.2 DECISIONES GENERALES DE DISEÑO ............................ 44! 4.2!REDISEÑO DE ELEMENTOS EXISTENTES ........................ 45! 4.2.1 MEMORIA ASOCIATIVA ........................................... 45! 4.2.2 FADER .............................................................. 53! 4.2.3 VENTILADOR-SOPLADOR .......................................... 61! 4.2.4 PULSADORES ....................................................... 70! 4.2.5 NAVES .............................................................. 75!
=' >265&'?2@4$,'('A23"$,'B,-$*' 4.3!DISEÑO DE NUEVOS JUGUETES ................................ 86! 4.3.1 SEMÁFORO ........................................................ 86! 4.3.2 DISPLAY ............................................................ 95! 4.3.3 SELECTOR / REGULADOR ....................................... 103! 4.3.4 INTERRUPTOR .................................................... 119! 4.3.5 AGITADOR ....................................................... 123! 4.3.6 RULETA DE AZAR ................................................ 128! 4.3.7 TIRACHINAS ...................................................... 132! 5.!RESULTADOS ....................................... 141! 6.!CONCLUSIONES Y TRABAJO FUTURO ..... 155! 6.1!CONCLUSIONES ............................................... 157! 6.2!TRABAJO FUTURO ............................................. 159! 7.!BIBLIOGRAFÍA ..................................... 161! ANEXOS ................................................. 165 A.1 OPTIMIZACIÓN DE LA MESA ................................. 167 A.2 SOFTWARE UTILIZADO ....................................... 174 A.3 DESARROLLO TEMPORAL Y DISTRIBUCIÓN DEL TRABAJO ... 176 A.4 GLOSARIO ..................................................... 177
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' C' 1. ÁMBITO DEL PROYECTO
<J' >265&'?2@4$,'('A23"$,'B,-$*'
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' <<' 3. DOCUMENTACIÓN
<=' >265&'?2@4$,'('A23"$,'B,-$*'
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' <C' 3. Documentación 3.1 Interacción tangible Se define interacción como la comunicación recíproca entre dos o más objetos, con su consiguiente intercambio de información. La interacción tradicional persona-ordenador se hace a través de periféricos como el teclado y el ratón. Existe otro tipo de interacción persona-ordenador menos conocida, denominada interacción tangible o TUI (Tangible User Interaction) que permite la manipulación física de datos digitales, dando forma física a la información digital y permitiendo su manipulación directa. Esto supone una interacción más natural con la información y una mayor sensación de control sobre ella, a la vez que mejora las capacidades cognitivas y la asimilación de la información. La esencia de la interacción tangible es crear sistemas en los que objetos convencionales son al mismo tiempo controles y representaciones físicas de información digital [3] (ver Imagen 3.1). Imagen 3.1 Modelo TUI: Objetos físicos (sobre la línea) son usados para controlar el modelo digital de la aplicación (bajo la línea), y pueden representar también (física o digitalmente) información digital de la aplicación. A continuación se muestran varios ejemplos de interacción tangible. Siftables Un ejemplo de interacción tangible es Siftables [4] (ver Imagen 3.2). David Merrill y Jeevan Kalanithi del MIT (Instituto Tecnológico de Massachussets) han creado estos prototipos que permiten nuevas formas de interacción con los ordenadores. Estos pequeños módulos se comunican entre sí y con el ordenador permitiendo interacciones muy particulares. Poseen
<D' >265&'?2@4$,'('A23"$,'B,-$*' sensores de movimiento, de inclinación (acelerómetros tri-axiales), de cercanía entre sí (infrarrojos), memoria propia, un pequeño procesador y pantallas táctiles. Esto permite al usuario organizar imágenes en carpetas, agrupar información e ideas, etc, de manera más natural, intuitiva y rápida. Imagen 3.2 Siftables Noteput Otro ejemplo de interacción tangible, en este caso en un tabletop, es Noteput [5] (ver Imagen 3.3), un juego musical con notas tangibles creado por Jonas Friedemann Heuer. Noteput combina los sentidos de la vista, oído y tacto, para enseñar música a niños de forma más fácil, intuitiva e interesante. Las notas y símbolos musicales difieren, además de en la forma, en el peso, de tal manera que las de mayor duración son más pesadas que las de menor duración. La mesa tiene dos modos: el modo estándar, donde el usuario sitúa las notas sobre la mesa para jugar y explora con la creación de melodías, y un modo ejercicio, con tutoriales ordenados por temas y dificultad para el aprendizaje.
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' <E' Imagen 3.3 Noteput I/O Brush El I/O Brush [6] (ver Imagen 3.4) es una nueva herramienta de dibujo para captar colores y texturas que se pueden encontrar en la vida cotidiana. El I/O Brush permite ‘coger’ las texturas y dibujar con ellas (ver Imagen 3.5 izquierda). Para usarlo sólo es necesario acercar el pincel al color, textura o movimiento que se desee captar y presionar un botón. Para dibujar con el material captado, se debe hacer sobre un lienzo especial. El I/O Brush parece un pincel normal, pero realmente consta de una pequeña cámara de video con sensores de luz y movimiento. El lienzo consta de una pantalla táctil que es proyectada por su parte posterior (ver Imagen 3.5 derecha). Imagen 3.4 I/O Brush
<F' >265&'?2@4$,'('A23"$,'B,-$*' Imagen 3.5 Captación de textura y color (izquierda) y lienzo del I/O Brush (derecha). 3.2 Tabletops Unos dispositivos tangibles muy extendidos son los tabletop. Un tabletop (ver Imagen 3.6) es una mesa tecnológica en la que la interacción persona y ordenador se produce en la superficie de la mesa mediante las manos o manipulando objetos. Además, es capaz de mostrar imagen en la propia superficie. Imagen 3.6 Ejemplo de tabletop. Existen muchas formas de implementar estos sistemas, entre las que destacan por su popularidad: - Superficies resistivas: donde al presionar el usuario, conecta dos láminas muy finas de conductor eléctrico, permitiendo el paso de la corriente. - Superficies capacitivas: constan de una lámina de material aislante y un conductor transparente. Como el cuerpo humano es conductor, al tocar la superficie se produce una distorsión en el campo electrostático de la pantalla que se puede medir como un cambio de capacitancia, lo que permite detectar la localización del toque.
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' <G' - Sistema de detección visual: en estos sistemas, una cámara de video captura la superficie de la mesa, y un software de reconocimiento visual detecta las manipulaciones con las manos y objetos del usuario. A los objetos se les añaden marcadores para su reconocimiento. En este último tipo de mesa, la retroproyección (proyección de una imagen por la parte trasera de una pantalla traslúcida) ha de permitir a la cámara ver los marcadores de los objetos cuando están apoyados sobre la mesa. En cuanto a la luz, puede ser tanto luz visible como luz infrarroja, esto dependerá tanto de los requisitos del tabletop, como de la cámara que se esté usando. Este tipo de mesa es el que se ha utilizado para este proyecto. En el momento de componer un sistema tabletop se deben tener en cuenta multitud de aspectos. Además de los aspectos técnicos de proyección, iluminación o captación de imágenes, hay que tener en cuenta los aspectos físicos de los elementos que forman la mesa, como el peso, el volumen o su colocación dentro del sistema. Otros aspectos a tener en cuenta son los relacionados con el uso, ya que lo que se crea es una interfaz que uno o varios usuarios van a utilizar. Se deben tener en cuenta el número de usuarios, las características de esos usuarios, como la edad, la estatura o los conocimientos previos que puedan o no tener en el uso de interfaces tangibles, y en relación a esto, la interactividad entre el usuario y el sistema. Algunos ejemplos de tabletop son: - Microsoft Surface [7]: es un producto de Microsoft que permite al usuario manejar contenidos digitales con movimientos de las manos o mediante objetos. Fue lanzado al mercado en noviembre de 2007. Los primeros clientes fueron hoteles, tiendas, restaurantes y lugares de entretenimiento (ver Imagen 3.7). ! ! ! !! Imagen 3.7 Microsoft Surface y su interacción.
<H' >265&'?2@4$,'('A23"$,'B,-$*' - ReacTable [8]: Es un instrumento musical electrónico colaborativo dotado de una interfaz tangible basada en una mesa, e inspirado en los sintetizadores modulares de los años sesenta. Ha sido desarrollado por el Grupo de Tecnología Musical de la Universidad Pompeu Fabra de Barcelona. Múltiples usuarios simultáneos comparten el control total del instrumento moviendo y rotando objetos físicos sobre la superficie de una mesa circular luminosa. Manipulando dichos objetos, los cuales representan los componentes clásicos de un sintetizador modular, los usuarios pueden crear tipologías sonoras complejas y dinámicas, mediante generadores, filtros y moduladores (ver Imagen 3.8). Imagen 3.8 Reactable y su interacción. 3.3 Software de reconocimiento y fiduciales 3.3.1 Reactivision Reactivision [9] es un software libre multiplataforma utilizado para la creación de aplicaciones multi-touch en dispositivos tabletop, así como para la interacción tangible en dichos dispositivos, a través de marcadores impresos (fiduciales). Éstos se asignan a objetos convencionales, para su identificación visual a través de la imagen capturada por una cámara conectada a un ordenador. Este software fue desarrollado por el Grupo de Tecnología Musical de la Universitat Pompeu Fabra de Barcelona como el componente subyacente del Reactable (apartado 3.2), un sintetizador tangible modular. Reactivision es una aplicación independiente, que envía mensajes TUIO a cualquier aplicación cliente conectada. El protocolo TUIO fue creado para
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' <I' codificar el estado de objetos tangibles y su comportamiento sobre la superficie de una mesa interactiva. El sistema trabaja de la siguiente manera: 1.- Reactivision recibe la imagen digital de una cámara colocada bajo la mesa (ver Imagen 3.9). 2.- Los fotogramas recibidos se convierten en imágenes en blanco y negro con un algoritmo adaptativo. 3.- Estas imágenes son segmentadas en un árbol que alterna las regiones blancas y negras (apartado 3.3.2.2) codificadas en el marcador impreso. 4.- Finalmente, las secuencias segmentadas se comparan con las de un diccionario previamente establecido para asignarles un número de identificación único. Imagen 3.9 Fiduciales colocados encima de la mesa vistos por la cámara situada debajo de la misma (imagen sin procesar). El diseño del fiducial ha de permitir el cálculo eficiente del punto central del marcador así como su orientación. Los mensajes del protocolo TUIO codifican la presencia de los marcadores, su posición, orientación e identidad, y transmiten estos datos al cliente. Además, Reactivision usa el resultado de la segmentación de la imagen para detectar el contacto de dedos sobre la superficie de la mesa.
=F' >265&'?2@4$,'('A23"$,'B,-$*' Imagen 3.15 Esquema de las partes de NIKVision. Los niños interaccionan con el juego a través de la manipulación física de juguetes sobre la superficie de la mesa (ver Imagen 3.16). Una cámara de vídeo colocada bajo la mesa, capta la imagen de los juguetes colocados sobre ella, y lo envía a un software de reconocimiento visual capaz de reconocer dichos juguetes. La salida de información del juego se produce por un monitor colocado encima de la mesa que muestra y reproduce la imagen y el audio necesario para el desarrollo del videojuego. Imagen 3.16 Mesa tangible NIKVision.
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' =G' El diseño de NIKVision ha ido evolucionando para hacerlo más grande (permitiendo así la interacción simultánea de más niños), más robusta y mejor adaptada para los niños. En la Imagen 3.17 se ve la última versión del tabletop. Imagen 3.17 Última versión de la mesa NIKVision. 3.4.2 Interacción tangible en la mesa La interacción tangible trabaja con una entrada que es producida en el entorno físico (donde el usuario está jugando) y una salida de información en el entorno digital. La entrada se lleva a cabo enriqueciendo con tecnología invisible el juguete que el niño va a manipular. Es especialmente importante la coherencia entre dicha entrada y la salida digital. La salida puede ser por pantalla o por proyección. En referencia al diseño de la interacción tangible hay que tener en cuenta ciertas consideraciones. En el trabajo realizado por Donald Norman
=H' >265&'?2@4$,'('A23"$,'B,-$*' [12] se comenta que, al cambiar las formas de interacción a objetos tangibles y a interacciones físicas, se deben aprender nuevos principios de interacción y los viejos deben ser descartados. Viejas costumbres de interacción suponen que el usuario está acostumbrado a presionar el ratón del ordenador, o a pulsar botones en los juegos tradicionales cuando el jugador desea realizar una acción. Con la Wii, los desarrolladores descubrieron que no pueden aplicarse siempre los mismos métodos: la acción a realizar depende de la situación. Un ejemplo claro es el juego de bolos de la Wii. Para poder lanzar la bola se debe soltar el botón que estás pulsando en vez de presionarlo, para que la acción tenga lugar. Esto, que ahora parece tener mucho sentido ya que cuando juegas a los bolos sueltas la bola, seguramente fue descubierto por los diseñadores a través de prueba-error, junto con un momento de inspiración. Todo esto defiende la postura de que la interacción no sigue unos métodos precisos de creación, sino que son necesarias pruebas y evaluaciones que demuestren su usabilidad. En NIKVision, los niños juegan con los juguetes interactuando con la mesa de diversas formas: realizando movimientos por la superficie en todas las direcciones, rotando el juguete, o golpeándolo en la superficie (ver Imagen 3.18). Imagen 3.18 Formas de interactuar con NIKVision. De izquierda a derecha: Desplazando el juguete por la superficie, rotándolo o golpeándolo en la mesa. Los elementos que interaccionan con NIKVision se han clasificado de la siguiente manera [13](ver Imagen 3.19): - Token: son aquellos elementos formalmente indistinguibles entre sí, a efectos de la cámara (generalmente circulares o cuadrados). - Named: elementos a los cuales se les asigna un atributo concreto, como por ejemplo el atributo de ser una vaca, un coche, etc. - Token-constrained: objeto que contiene y restringe a uno o varios tokens. Puede ser de dos tipos, asociativo (aparece y desaparece el token) o manipulable (se desplaza). - Un tipo de elemento no considerado hasta ahora en NIKVision son los displays: elementos que muestran una salida de información mediante imágenes. La interacción con el usuario se limitaría a su colocación
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' =I' sobre la mesa. El estudio y diseño de este tipo de elementos es precisamente uno de los objetivos de este proyecto (ver apartado 2). Imagen 3.19 Ejemplo de token (arriba), named (abajo a la izquierda) y tokenconstrained (abajo derecha).
CJ' >265&'?2@4$,'('A23"$,'B,-$*' 3.4.3 Juegos y juguetes Para NIKVision se habían desarrollado previamente a la realización de este proyecto varios juegos [14], todos ellos enfocados a niños, que se explican detalladamente a continuación. 3.4.3.1 Granja En este juego el niño maneja juguetes que representan a los animales de una granja. Cada animal es un manipulativo named, que se coloca sobre la superficie de la mesa, donde está proyectada una imagen de la granja vista desde arriba. El niño ve a través de la pantalla el entorno de la granja en el que juega y los animales que maneja en tres dimensiones (ver Imagen 3.20). Imagen 3.20 Entorno de la granja en la superficie de la mesa y salida del entorno gráfico en 3D en el monitor. ! ! En el juego, los niños deben recoger fresas, leche, huevos y lana para un granjero según éste les vaya pidiendo. Para ello, deberán golpear con el juguete del animal adecuado en el lugar correspondiente: la vaca en el cubo (así se va llenando de leche) y la gallina en el nido (va poniendo huevos). Al frotar en la superficie de la mesa el lugar donde se encuentra una fresa, el animal la recoge, y al situar a la oveja en una silla de barbero, el granjero la esquila (ver Imagen 3.21).
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' C<' Imagen 3.21 Interacciones del juego de la granja: Recoger fresas (A), huevos (B), leche (C) y esquilar a la oveja (D). Interacciones en el entorno 2D (abajo). 3.4.3.2 Asteroids Es una adaptación tangible del juego de Atari que lleva el mismo nombre (ver Imagen 3.22). El objetivo del juego es destruir los asteroides que van saliendo en la pantalla sin que éstos destruyan la nave al golpearla. En primer lugar aparecen unos asteroides más grandes, los cuales al recibir el impacto del misil virtual, se subdividen en otros más pequeños que se deben destruir (ver Imagen 3.23). El juego consta de dos naves espaciales, cada una de ellas con un pulsador que, al ser presionado, deja ver un token en la superficie de la mesa, produciendo así un disparo con luz y sonido (ver Imagen 3.23). El juego consta de varios niveles en los que la dificultad se va incrementando.
C=' >265&'?2@4$,'('A23"$,'B,-$*' Pueden jugar dos jugadores simultáneamente, ganando aquel que consiga sobrevivir más niveles. Imagen 3.22 Apariencia del juego original “Asteroids” de Atari. Imagen 3.23 Juguetes y apariencia del juego “Asteroids” de NIKVision Imagen 3.24 De izquierda a derecha: Aspecto de las naves, nave pulsada y sin pulsar procesada por Reactivision (las manchas blancas de la derecha son píxeles de ruido).
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' CC' 3.4.3.3 Juego musical Juego en el que los niños pueden crear ritmos de batería, permitiendo el aprendizaje de conceptos musicales como el ritmo, de manera creativa y colaborativa. Los ritmos son interpretados como una configuración espacial de notas (tokens), sobre una superficie bidimensional en la que, el eje horizontal representa el tiempo, y el vertical define la propiedad del sonido. Cada color representa un instrumento de la batería diferente (ver Imagen 3.25), y el ritmo se reproduce de izquierda a derecha. Imagen 3.25 Niños interactuando con el juego musical. El niño ve unos círculos de colores en la superficie de la mesa y va colocando piedras pequeñas (tokens) dentro de los círculos que elije. De esta manera va variando la configuración de sonidos a lo largo del tiempo, es decir, va modificando el ritmo de la batería virtual. Además de los tokens, el juego permite la interacción con otros dos elementos: un fader lineal (ver Imagen 3.26 izquierda), que permite la regulación de la velocidad de la reproducción (tempo), y un tokenconstrained asociativo (ver Imagen 3.26 derecha) que permite la memorización de ritmos y su combinación. De esta manera el niño puede regular el tempo deslizando el fader, y memorizar y combinar distintos ritmos entre sí añadiendo o quitando tokens de la memoria asociativa. Imagen 3.26 Modelo conceptual de un fader lineal (izquierda) y un asociativo (derecha) y sus respectivas vistas a través de la cámara.
CD' >265&'?2@4$,'('A23"$,'B,-$*' 3.4.3.4 Juego de tráfico La finalidad de este juego es el aprendizaje de las reglas básicas de circulación vial, tanto de conductores como de peatones. El niño tiene la posibilidad de manejar un coche o un peatón, permitiendo así el juego simultáneo de dos jugadores. De esta manera tanto uno como otro niño deberán circular con sus juguetes por la zona correspondiente del juego, respetando los pasos de peatones y las señales semafóricas virtuales (ver Imagen 3.27). Imagen 3.27 Juego de tráfico en NIKVision. 3.4.3.5 Juego de piratas En el juego los niños controlan un barco pirata virtual impulsándolo con un ventilador en todas las direcciones. El objetivo del juego consiste en atacar otros barcos y robarles el tesoro que contienen. Es un juego colaborativo en el que, mientras un niño dirige el barco con el ventilador, el otro dispara los cañones colocando tokens en la mesa (ver Imagen 3.28). Imagen 3.28 Juego colaborativo de piratas.
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' CE' El manipulativo del juego consiste en una ruleta mecánica que simula un ventilador (ver Imagen 3.29). Ésta hace aparecer y desaparecer un token en la superficie de la mesa a medida que gira. La cámara detecta la aparición del token, por lo que el sistema interpreta que el ventilador está en movimiento, y cuenta cuantas veces por segundo aparece y desaparece el token, deduciendo la velocidad del movimiento. Imagen 3.29 Interacción mediante ventilador en juego de piratas.
D=' >265&'?2@4$,'('A23"$,'B,-$*'
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' DC' 4. Trabajo realizado 4.1 Metodología y decisiones generales de diseño 4.1.1 Metodología Se decidió realizar el proyecto de forma conjunta, implicando a ambos miembros en todas las tareas. Al trabajar en equipo, se aprovecha la competencia de cada integrante y se alcanza una mayor productividad, siempre que se aplique una metodología común. Para ello, se adaptó la metodología aprendida a lo largo de la carrera, a las especiales características del proyecto. Esto permitió organizar y abordar las diferentes fases con mayor eficacia: 1.- Planteamiento y documentación. En esta fase se buscan nuevas formas de interaccionar con NIKVision. Se estudia y reúne la información necesaria para poder generarlas. Al final de esta fase, se obtienen ideas conceptuales con las que se desarrollarán diferentes soluciones en la fase siguiente. En el caso del rediseño de elementos, aquí se analizarán los requisitos e información necesarios para poder generar soluciones más adecuadas. Es importante detectar los requerimientos necesarios del concepto para su correcto funcionamiento. 2.- Fase creativa. En esta fase se desarrollan mecanismos y aspectos formales y funcionales que permitan llevar a cabo la idea conceptual obtenida en el apartado anterior. Se desarrollan diferentes soluciones para cada concepto, pudiendo así escoger la más adecuada para cada caso. 3.- Fabricación. A continuación se fabrica el prototipo funcional, con los materiales y procesos adecuados para cada uno. En el caso de las carcasas de los juguetes se realiza el modelado 3D para verificar los colores y las formas antes de su fabricación, al requerir una estética y aspecto formal más cuidados. 4.- Comprobaciones en la mesa. Después se comprueba el funcionamiento del prototipo, para determinar si la interacción con NIKVision es correcta o deben corregirse algunos elementos. El objetivo es verificar si la detección del token de cada prototipo en NIKVision es correcta o no. 5.- Diseño del fiducial. Una vez el funcionamiento en la mesa es correcto, se diseña el fiducial, teniendo en cuenta las necesidades de detección del manipulativo. Hay que verificar que el reconocimiento del fiducial en la cámara es adecuado. 6.- Interfaz gráfica. El último paso es la creación de una interfaz gráfica, para demostrar alguna aplicación concreta del elemento creado. En
DD' >265&'?2@4$,'('A23"$,'B,-$*' el caso del rediseño de elementos ya existentes, como ya cuentan con una interfaz hecha, se realizarán las mejoras que fueran necesarias. 4.1.2 Decisiones generales de diseño Al inicio del proyecto se establecieron unas bases generales para el diseño de todos los elementos a realizar. Teniendo en cuenta los elementos ya existentes, se decidió estandarizar ciertas características que permitieran la intercambiabilidad de sus componentes, permitiendo así una mayor versatilidad: - Se estableció que la forma general de todos los elementos sería cilíndrica. Esto permitiría ir añadiendo nuevos complementos de manera concéntrica. También se tendría en cuenta la estandarización de la altura. - Se decidió aplicar colores vivos exclusivamente a las carcasas de los juguetes, de manera que resultasen atractivas para el usuario. Para el resto de elementos, se utilizarían colores neutros.
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' DE' 4.2 Rediseño de elementos existentes Los prototipos de los manipulativos existentes hasta este momento estaban hechos con piezas de Lego®. Esto acarreaba diversos problemas, tales como que al ser utilizados por niños, se rompían con mucha frecuencia, o se soltaban piezas, lo que impedía su correcto funcionamiento en el tabletop. Además, todos los prototipos y juguetes carecían de una estética adecuada y acorde con los juegos, al estar limitados por la forma de las pieza Lego®. Por ello, fue necesario proceder al rediseño de todos estos manipulativos, de manera que se les proporcionase una estética más acorde para el público infantil, y se fabricasen los prototipos de manera más robusta y resistente, con menor número de componentes y utilizando materiales más adecuados. A continuación se detallan los elementos rediseñados a lo largo del proyecto. 4.2.1 Memoria asociativa Planteamiento y documentación El planteamiento inicial consistía en el rediseño de un token-constrained asociativo ya existente (ver Imagen 4.1 izquierda). La memoria asociativa se utilizaba en el juego de música (ver Imagen 4.1 derecha), en el cual los niños crean ritmos de batería añadiendo piedras pequeñas (tokens) en la superficie de la mesa. Este manipulativo permitía memorizar ritmos asociándolos a tres piezas de lego (tokens) las cuales, al introducirlas en su contenedor, hacían las veces de memoria: en cada posición de token se memorizaba un ritmo. La disminución entre los ritmos memorizados se lograba relacionando la distancia de cada token con un fiducial situado en la base (ver Imagen 4.1 centro). Imagen 4.1 De izquierda a derecha: Memoria asociativa inicial con un token en el centro (parte superior), fiducial y token en el centro (parte posterior) y juego de música.
DF' >265&'?2@4$,'('A23"$,'B,-$*' La interacción ocurría de la siguiente manera: - El usuario colocaba piedras pequeñas (tokens) en la superficie de la mesa, lo que iba variando el ritmo creado. - Situaba en contenedor de la memoria asociativa en la mesa. - Al introducir un token en un orificio del contenedor, el ritmo actual quedaba memorizado en ese orificio concreto, y continuaba su reproducción mientras el token estuviese metido en su orificio, pudiéndose quitar y poner para detener o continuar con su reproducción. - El usuario podía crear en total tres ritmos distintos, almacenándolos en los tres orificios de que disponía la memoria. - Al haber almacenado dos o más ritmos, éstos se podían combinar entre sí al introducir los tokens en los orificios en que estaban memorizados, es decir, al iniciar la reproducción simultánea de los mismos. Una de las cosas que se pretendía era reducir el espacio que ocupaba en la mesa manteniendo la misma funcionalidad y forma de interacción. Fase creativa Se planteó la posibilidad de realizar la memoria asociativa de forma lineal, tal como existía hasta el momento. Sin embargo, finalmente se optó por realizar el nuevo asociativo con forma circular (ver Imagen 4.2). De esta manera se conseguiría reducir el volumen a ocupar en la superficie de la mesa, permitiendo además la ampliación de los orificios de memoria a cuatro. Éstos se dispondrían en el centro para alojar unos cilindros cuyas bases circulares serían los tokens, en una posición relativa al fiducial. Por tanto la forma de reconocimiento en Reactivision sería igual que la existente, es decir, calculando las distancias de los tokens a un fiducial de manera que permitiera saber cuál era el que estaba activo. Imagen 4.2 Concepto final de asociativo.
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' DG' Fabricación Se decidió realizar el prototipo en PVC, debido a su resistencia, ligereza y facilidad de trabajo, por lo que resultaba un material idóneo para su fabricación. Para ello se partió de una plancha de PVC espumado del grosor adecuado para el contenedor, una plancha más fina de PVC espumado para las tapas y pestañas y cuatro cilindros de PVC. Para rellenar juntas se emplearía masilla de carrocero, ya que resultaba idónea por su resistencia y facilidad para ser trabajada, proporcionando un acabado perfecto. El proceso de fabricación comenzó con el corte de un cilindro macizo de PVC espumado con una sierra de cinta, al cual se le practicaron cuatro agujeros pasantes en el centro con un taladro. Dado que el acabado del corte con la sierra de cinta no fue muy limpio, se optó por introducirlo en un tubo hueco de PVC, y rellenar las juntas con masilla, mejorando así su apariencia final. Más tarde se lijó y pintó con spray. Por otro lado se realizaron los cuatro cilindros que se alojarían en los agujeros, a partir de los tapes de unos bolígrafos, cuya forma se adaptaba perfectamente, cerrándolos con PVC espumado y añadiéndoles una pestaña para facilitar el agarre. Se lijaron y pintaron con spray. Las bases de los cilindros se pintaron de blanco, para ser detectadas como los tokens del manipulativo (ver Imagen 4.3). Imagen 4.3 La base de los cilindros se pintó de blanco para ser detectadas como los tokens de la memoria asociativa.
DH' >265&'?2@4$,'('A23"$,'B,-$*' Comprobaciones en la mesa El reconocimiento de la memoria asociativa por parte de la cámara y Reactivision se limitaba a la detección de la presencia o ausencia de los tokens de la superficie. Ello resultaba sencillo para el programa de detección, por lo que según lo esperado no hubo ningún fallo. Diseño del fiducial - Requisitos El fiducial debería ser orientable, para poder calcular el vector de dirección a partir del cual se calcularía la posición relativa de cada token. Además debería adaptarse correctamente a la base, situándolo a una distancia adecuada de los tokens para su correcta detección. - Diseño del fiducial En un primer momento se experimentó el uso de fiduciales variables. Esta nueva idea se basaba en que al quitar o añadirle nodos a un fiducial, éste pasaría a ser otro completamente diferente, ya que tendría otro árbol. De esta forma se podrían detectar los diferentes estados del manipulativo (ver Imagen 4.4). Sin embargo al variar el interior del fiducial cualquier píxel de ruido que interfería, Reactivision lo interpretaba como un nuevo nodo que asociaba al fiducial, convirtiéndolo en otro diferente e impidiendo ser identificado. Por ello se descartó la aplicación de esta nueva idea para posteriores diseños de fiduciales. Imagen 4.4 Prueba llevada a cabo con un fiducial variable.
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' DI' Se decidió rediseñar el fiducial existente, para lo cual se probó otra nueva idea. Ésta consistía en adaptar la forma del fiducial a la forma de la base, con lo que quedaría un fiducial en forma de arco. De esta manera se aprovechaba mejor el espacio de la base del manipulativo. Al realizar la comprobación en el tabletop se observó que Reactivision no detectaba correctamente los fiduciales. Se llegó a la conclusión de que esto se debía a que Reactivision cerraba el área del arco del fiducial y no reconocía el token que se encontraba en su interior (ver Imagen 4.5). Se vio, por tanto, que esta idea únicamente serviría para aquellos elementos cuya base fuera lo suficientemente amplia como para permitir el margen suficiente para que al cerrar el arco del fiducial no se interfiriese con ningún token. Imagen 4.5 Fiducial en arco. Reactivision cierra la forma del mismo, lo que interfiere en la detección del token. De modo que hubo que rediseñar el fiducial desde cero olvidando la forma de arco y situándolo al borde de la base. El fiducial más sencillo que permitía el cálculo de orientación es el que aparece en la Imagen 4.6, cuyo código sería W0121, a introducir en el diccionario de fiduciales de Reactivision. Así, el cálculo de la posición exacta de cada token se haría a través del ángulo que formase cada token respecto al vector de orientación (ver Imagen 4.6).
EJ' >265&'?2@4$,'('A23"$,'B,-$*' Imagen 4.6 Cálculo de la posición de cada token a través de ángulo que forma con el vector de orientación (rojo). - Adaptación a la base del manipulativo Hubo que ampliar la base para la correcta detección del fiducial, pues sino resultaba demasiado pequeño para Reactivision (ver Imagen 4.7). Imagen 4.7 Fiducial definitivo en la base ampliada.
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' E<' - Comprobación La comprobación del fiducial sirvió, por un lado, para descartar la aplicación futura de fiduciales variables, así como para descartar el uso de un fiducial en arco dadas las características de la base. El único fiducial que funcionó de manera correcta fue el situado en el lateral de la base. En este caso, los tokens se detectaban correctamente, identificando su posición (ver Imagen 4.8). Imagen 4.8 Imagen procesada de Reactivision, en la cual se observa que la detección es correcta, ya que se le ha asignado al fiducial su número de identificación (2) y se han detectado los dos tokens (F).
EH' >265&'?2@4$,'('A23"$,'B,-$*' para albergar un fiducial redondo. De nuevo el fiducial orientable más sencillo posible fue el de código W0121 (ver Imagen 4.16). Imagen 4.16 Fiducial orientable sencillo en forma de arco. La variación del ángulo que forma el token respecto del vector de orientación, se traduciría en un incremento o disminución de la velocidad de reproducción del ritmo en el juego (ver Imagen 4.17). Imagen 4.17 Cálculo de la variación del ángulo del token en cada posición con respecto al vector de orientación (rojo).
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' EI' - Adaptación a la base del manipulativo Al haberlo diseñado en forma de arco se adaptaba perfectamente a la forma de la base (ver Imagen 4.18). Imagen 4.18 Fiducial situado en la base y distintas posiciones relativas del token. - Comprobación La única cuestión que hubo que modificar fue el tamaño del fiducial, ya que el primero con el que se probó era demasiado pequeño. Por lo demás funcionó correctamente, ya que el área cerrada del arco no interfería con ningún token. Se detectaba correctamente el fiducial, así como el token del fader y el de un pulsador situado en el centro (ver Imagen 4.19). Imagen 4.19 Imagen procesada de Reactivision, en la que se aprecia el número de identificación del fiducial y los dos tokens (F).
FJ' >265&'?2@4$,'('A23"$,'B,-$*'
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' F<' 4.2.3 Ventilador-Soplador Planteamiento y documentación Se planteó el rediseño del ventilador creado para el juego de piratas. En este juego, los niños manejaban un barco pirata impulsándolo a través de un ventilador (ver Imagen 4.20). Éste constaba de un fiducial orientable en la base y la rueda del ventilador estaba pintada de blanco y negro. De esta forma cuando la parte blanca asomaba intermitentemente por un orificio situado en la base al girarlo, el barco se ponía en movimiento. Esta alternancia de blanco y negro al girar el ventilador, permitía en el programa calcular la velocidad de movimiento del barco en relación al número de veces por segundo que aparecía el token (ver Imagen 4.21). Imagen 4.20 Juego de piratas donde el barco se impulsa con un ventilador. Imagen 4.21 Base del ventilador con fiducial y token (izquierda) y sin token (derecha).
F=' >265&'?2@4$,'('A23"$,'B,-$*' Fase creativa Además de la interacción que se conseguía al girar la rueda, se ideó otro tipo de interacción que consistía en producir el movimiento soplando en una ruleta. Se decidió que el elemento aunase ambas formas de interacción, pudiéndose elegir entre una y otra acoplando una rueda al eje (ver Imagen 4.22). Otro requisito era alojar el conjunto en un cilindro para mantener la concordancia y la posibilidad de combinarlo con el resto de elementos. En el interior del cilindro se alojaría la ruleta pintada de blanco y negro que haría aparecer y desaparecer el token en un orificio de la base. El usuario podría impulsar la ruleta soplando o girando la rueda naranja. Imagen 4.22 Concepto final del soplador aunando las dos formas de interacción. Fabricación Se decidió realizar el prototipo en PVC, ya que este material resultaba rígido, ligero y resistente, además de poderse trabajar con facilidad. Antes de empezar a realizar el prototipo, se localizaron unas ruletas que cumplían perfectamente la función de transmisión del movimiento, así como una rueda con aspas que se adaptase a lo que se buscaba. Una vez conseguidos los elementos necesarios, se cortó el tubo de PVC que albergaría las ruletas y se unió a la tapa de la base previamente cortada en PVC espumado (ver Imagen 4.23). A ésta se le realizó el orificio a través del cual se dejaría ver el token. Se practicaron unos agujeros pasantes al tubo para alojar los ejes (ver Imagen 4.24 izquierda). Para hacer los ejes, se cortó una varilla roscada a la medida adecuada (ver Imagen 4.24 derecha), y se introdujeron junto con las ruletas, una de ellas (la no visible por el usuario), pintada mitad de negro y mitad blanco (las pruebas con la mesa
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' FC' determinaron que era la proporción idónea para lograr una velocidad reconocible por la cámara), y la visible de un color llamativo, para lo cual se eligió el naranja. De esta manera el usuario identificaría con mayor facilidad que la interacción debería llevarse a cabo en esa ruleta. El hecho de que se utilizase varilla roscada, fue para permitir la fijación de la ruleta superior mediante el apriete de unas tuercas cuando se quisiera realizar el movimiento a través del acople de la rueda, y al aflojarlas poder dejarla libre y realizar el movimiento por soplido (ver Imagen 4.25). Imagen 4.23 Pegado de la tapa. Imagen 4.24 Taladrado de los agujeros para alojar los ejes (izquierda) y corte de los ejes de varilla roscada (derecha).
FD' >265&'?2@4$,'('A23"$,'B,-$*' Imagen 4.25 Apriete y afloje de las tuercas (arriba izquierda), acople y desacople de la ruleta (arriba derecha) e interacción girando y soplando en la rueda naranja (abajo). Comprobaciones en la mesa Durante las primeras experimentaciones con la mesa, el token no se detectaba correctamente, era casi imperceptible por la cámara. Resultó que la ruleta inferior, la que transmitía el color blanco o negro a la cámara, quedaba excesivamente elevada de la superficie de la mesa, por lo que hubo que reducir dicha altura para optimizar la llegada de luz. Como se ha explicado anteriormente, fue en esta fase donde se comprobó que la proporción idónea de blanco y negro para lograr una velocidad reconocible por la cámara se obtenía pintando la mitad de la ruleta de blanco y la otra mitad de negro. Una vez corregidas la altura y la proporción de blanco y negro, su funcionamiento fue correcto (ver Imagen 4.26).
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' FE' Imagen 4.26 Imágenes procesadas de Reactivision después de ser corregida. Diseño del fiducial - Requisitos Se necesitaba poder calcular la orientación para conocer la dirección en que debía moverse el barco. Además, debería dejarse un espacio suficiente entre el fiducial y el token para la correcta detección de ambos. - Diseño del fiducial Se observó en el ventilador antiguo que, para calcular la orientación, podía hacerse mediante un fiducial que no fuese orientable y el token que aparecía en la base. De esta manera se crearía el vector de orientación. Para ello se diseñó un fiducial sin orientación sencillo, de código W012212 (ver Imagen 4.27). Se descartó el diseño de un fiducial en arco debido a la escasa superficie disponible en la base, que interferiría con seguridad con el token central. Imagen 4.27 Fiducial diseñado para el ventilador.
FF' >265&'?2@4$,'('A23"$,'B,-$*' - Adaptación a la base del manipulativo Resultó que en la base el espacio era mínimo, ya que el orificio del centro lo reducía considerablemente, no pudiendo respetar tampoco una distancia aceptable entre el token y el fiducial. Por ello hubo que ampliar la base para colocar el fiducial. - Comprobación: Tras haber corregido la altura del token, y ampliado la base para colocar un fiducial suficientemente grande para su reconocimiento, la detección en Reactivision fue correcta. El fiducial era identificado con su número y al aparecer el token en la base se identificaba con F (ver Imagen 4.28). Imagen 4.28 Imagen procesada de Reactivision en la que se aprecia la correcta detección del fiducial y el token. El rectángulo blanco inferior corresponde a píxeles de ruido de la imagen.
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' FG' Interfaz gráfica: modificación de la interfaz de juego de piratas Al ser el rediseño de un elemento ya existente, ya tenía una interfaz gráfica creada, la del juego de piratas (ver apartado 3.4.3.5). Se crearon y modificaron algunos elementos que se consideraron susceptibles de mejora (ver Imagen 4.29). Imagen 4.29 Interfaz antigua del juego de piratas. Entre ellos, se creó un nuevo fondo de agua que simulaba estar en movimiento, a través de un clip de vídeo hecho con Particle Illusion de ondas en movimiento superpuesto a una imagen de fondo con apariencia de mar hecha con Photoshop (ver Imagen 4.30). Luego se exportaría a Adobe Flash el conjunto de fotogramas para proyectar la animación de fondo en el videojuego. Imagen 4.30 Fondo para el juego de piratas.
GD' >265&'?2@4$,'('A23"$,'B,-$*'
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' GE' 4.2.5 Naves Planteamiento y documentación Se propuso el rediseño de las naves del juego “asteroids” (ver apartado 3.4.3.2). Este elemento sería en realidad la carcasa del juguete que debería alojar al pulsador (apartado anterior). Hasta el momento las naves existían como prototipo funcional hecho con Lego® (ver Imagen 4.38). Uno de los requisitos era realizar dos naves, permitiendo así el juego a dos usuarios. Se decidió que éstas fueran formalmente idénticas, para asociarlas al mismo juego, pero que se diferenciasen el algún aspecto, por ejemplo el color. También se debía simplificar la forma y hacerla a ser posible de una pieza, ya que éste juego era para niños, reduciendo así posibles accidentes y roturas del juguete. Además, deberían ser ergonómicas. Imagen 4.38 Prototipos de las naves hechos con Lego®. Fase creativa Durante esta fase surgieron tres conceptos diferentes de naves. El primero de ellos era un modelo más realista, que se descartó porque contenía varias esquinas en punta, lo que suponía cierto riesgo al ser utilizado por niños (ver Imagen 4.39).
GF' >265&'?2@4$,'('A23"$,'B,-$*' Imagen 4.39 Primera alternativa para la nave. El segundo consistía en una nave más futurista, simplificada y con formas curvas y redondeadas (ver Imagen 4.40). Imagen 4.40 Segundo concepto de la nave. El tercer concepto, era una nave más clásica, también de formas simples y redondeadas (ver Imagen 4.41), que finalmente se desarrolló.
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' GG' Imagen 4.41 Tercera alternativa para la nave (elegida). Este último concepto se adaptaba muy bien a la mano del usuario, ya que la forma de la parte superior recordaba a un ratón de ordenador, sobresaliendo el pulsador en su parte delantera. Para encajar el pulsador se ideó un sistema de patillas curvas, que encajarían entre sí al introducirlo y girarlo, pudiendo así dejarlo asegurado en una posición fija, y sacarlo girando nuevamente. Además, se decidió invertir los colores utilizados en una y otra nave, de manera que permitiera diferenciar dos usuarios pero manteniendo la misma línea, para asociarlas a un mismo juego.
GH' >265&'?2@4$,'('A23"$,'B,-$*' Fabricación Modelado Antes de construir los prototipos, se realizó el modelado 3D de las naves en Autodesk Inventor, para verificar la forma final y tener una referencia durante su fabricación. Además, se realizaron pruebas de color para elegir la opción más adecuada y atractiva (ver Imagen 4.42). Imagen 4.42 Pruebas de color con el modelado de las naves.
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' GI' Se eligieron las últimas porque de esa manera, al utilizar dos colores complementarios e invertirlos en cada nave, se asociarían perfectamente las dos naves al mismo juego, pero diferenciando la de cada jugador. Proceso de fabricación Se decidió fabricarlas en madera DM, porque su mecanizado resultaba sencillo, permitía obtener las curvas de la pieza, la textura del acabado era lisa y se conseguía un resultado más duradero. En un primer momento, se cortó la silueta de la base de las alas en un tablero del espesor correspondiente con una sierra de calar (ver Imagen 4.43 izquierda), y se lijaron los cantos adaptando la forma. Se cortó la parte superior con sierra de calar, de manera aproximada, consiguiendo el espesor necesario superponiendo dos tableros de DM, se unieron a la base, y se fue lijando hasta conseguir las curvas del modelo realizado en Inventor. Se realizó el agujero que alojaría más tarde al pulsador (ver Imagen 4.43 derecha), se cortaron tubos de PVC para hacer los propulsores traseros, se enmasillaron todas las uniones, y se lijaron hasta conseguir un acabado perfecto. Por último, se fijaron las patillas de fijación del pulsador, realizadas en PVC, y se pintó el conjunto con sprays. Imagen 4.43 Proceso de fabricación con DM. Corte con una sierra de calar (izquierda) y taladrado (derecha). Comprobaciones en la mesa Al haber comprobado previamente los pulsadores, no cabía esperar ningún tipo de fallo por parte de las naves, ya que desde un punto de vista funcional no aportaban nada nuevo. Por tanto, la comprobación con las naves se limitó a probar su interacción con el tabletop acoplándoles un pulsador (ver Imagen 4.44).
HJ' >265&'?2@4$,'('A23"$,'B,-$*' Imagen 4.44 Pruebas de las naves con sus pulsadores en el juego Asteroids. Diseño del fiducial - Requisitos En este caso se requería diseñar dos fiduciales, ambos orientables para calcular la orientación de las naves en el software del juego. Deberían ser lo suficientemente grandes y estar lo suficientemente separados del token del pulsador para su correcta detección. Los dos fiduciales deberían ser diferentes, para reconocer cada nave por separado. Otro requisito importante era que el centro del fiducial y el token estuviesen correctamente alineados, ya que en la dirección que marcase su vector sería en la dirección que llevaría el disparo. - Diseño del fiducial Para una de las naves se acopló el fiducial orientable más sencillo posible, de código W0121 (ver Imagen 4.45 izquierda). Se optó por una forma alargada ya que se adaptaba muy bien a la forma de la base, dejando una distancia adecuada al token. El segundo fiducial resultó de añadir un nodo circular a los dos niveles del anterior, cuyo código por tanto será W012211 (ver Imagen 4.45 derecha).
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' H<' Imagen 4.45 Fiduciales orientables de la primera (izquierda) y la segunda nave (derecha). - Adaptación a la base del manipulativo Se realizaron los fiduciales del tamaño más grande posible que se adaptase correctamente a la superficie de la base de las naves. El espacio de la base era suficientemente grande como para albergar cada fiducial sin tener que ser modificada (ver Imagen 4.46). Imagen 4.46 Fiducial acoplado a la base de una de las naves. - Comprobación Se comprobó la detección de ambos fiduciales y de los tokens de los pulsadores al ser pulsados. La detección en Reactivision de todos los elementos fue correcta (ver Imagen 4.47).
H=' >265&'?2@4$,'('A23"$,'B,-$*' Imagen 4.47 Imágenes procesadas de Reactivision de ambos fiduciales con sus tokens. Las manchas blancas de alrededor corresponden a píxeles de ruido. Interfaz gráfica: rediseño del juego Asteroids Para las naves ya existía una interfaz gráfica, el juego “asteroids” (apartado 3.4.3.2). Se decidió rediseñar la interfaz gráfica del juego “asteroids” (ver Imagen 4.48), haciéndola más acorde con el nuevo diseño de naves llevado a cabo. Imagen 4.48 Interfaz gráfica antigua del juego. Un requisito impuesto fue que los asteroides conservaran su forma para mantener una línea “retro”, que era la estética seguida en el juego original. Para ello se creó un nuevo fondo del videojuego, hecho en Adobe Photoshop mediante un filtro de nubes de diferencia, para conseguir un aspecto espacial. Esta imagen plana se exportó a Particle Illusion (ver Anexo 2), un
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' HC' simulador de partículas con gran variedad de opciones, sobre la cual se crearon unas estrellas que parpadeasen de manera alternada, para crear un efecto visual de movimiento en el fondo. (ver Imagen 4.49). Imagen 4.49 Fondo creado para el juego Asteroids. Se crearon otros clips de película con Particle Illusion para superponer, de manera aleatoria, sobre el fondo. Entre ellos un cometa y una nube que iban recorriendo el fondo espacial. Con este mismo programa se realizó otro clip de película que consistía en una llamarada de fuego azul para proyectar bajo los propulsores de las naves, de manera que diese mayor realismo a las naves a medida que se iban desplazando sobre la superficie de la mesa (ver Imagen 4.50). Imagen 4.50 Animación de un cometa (izquierda) y de los propulsores de las naves (derecha) mediante Particle Illusion.
IJ' >265&'?2@4$,'('A23"$,'B,-$*' Comprobaciones en la mesa Para poder comprobar el correcto funcionamiento se necesitó proyectar un círculo de color justo en la base del semáforo. Utilizando un fiducial todavía sin adaptar, se desarrolló un pequeño programa que proyectase los círculos rojo, verde y ámbar alternativamente en la base del semáforo. Gracias a esta prueba, se pudo comprobar que la visibilidad de la luz del semáforo no era del todo buena, ya que dada la escasa altura de la mesa, el usuario ve el display desde arriba. Por ello se modificó el ángulo de emisión de la luz cortando el tubo, para que la luz no se emitiera en dirección paralela a la superficie de la mesa, sino con un cierto ángulo que permitiera verla mejor desde la perspectiva del usuario (ver Imagen 4.57). Imagen 4.57 Arreglo del semáforo cortando el tubo oblicuo para mejorar la visualización desde la posición del usuario. Diseño del fiducial - Requisitos Además de indicar la posición exacta donde debían proyectarse los círculos de colores, debía de indicar en qué orientación estaba el semáforo para poder detectar cuando el coche lo hubiera sobrepasado. - Diseño del fiducial El planteamiento del fiducial para este prototipo fue diferente. Había que comprobar cómo la cámara infrarroja (IR) y el software Reactivision veían e interpretaban el círculo de fibra óptica del centro de la base. Se comprobó que lo reconocía como una mancha uniforme de color negro, ya que la luz emitida no era reflejada hacia la cámara IR. Ésta
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' I<' circunstancia permitió aprovechar el círculo central para diseñar el fiducial (ver Imagen 4.58). Su árbol es W01212111. Imagen 4.58 Diseño del fiducial del semáforo con círculo negro en el centro. - Adaptación a la base del manipulativo El fiducial se colocó en la base con el punto negro central encima del manojo de fibra óptica. Este círculo del fiducial se recortó para permitir que pasase la luz por la fibra (ver Imagen 4.59), sin embargo, como se ha dicho, la fibra se ve negra en Reactivision, por lo que sigue teniendo el mismo aspecto para la cámara. Imagen 4.59 Fiducial adaptado a la base del semáforo, con agujero en el círculo central que deja ver la fibra óptica. - Comprobación Al realizar la comprobación, Reactivision interpretó perfectamente el fiducial con la fibra óptica en el centro (ver Imagen 4.60). En la imagen
I=' >265&'?2@4$,'('A23"$,'B,-$*' se identifica con un 0. Las manchas de debajo son algo totalmente normal (ruido) imposible de evitar. Imagen 4.60 Imagen procesada por Reactivision del fiducial del semáforo. Interfaz gráfica Pese a ser un manipulativo nuevo de tipo display, se disponía de la interfaz creada para el juego de tráfico (apartado 3.4.3.4)(ver Imagen 4.61). Imagen 4.61 Interfaz ya existente del juego de tráfico.
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' IC' Sobre este escenario, simplemente había que proyectar los círculos verde, ámbar y rojo, que cambiaban con el paso de los segundos en un bucle de verde a ámbar, de ámbar a rojo y de rojo a verde, gracias a una animación muy sencilla realizada en Adobe Flash (ver Imagen 4.62). Estos círculos se proyectan bajo la base del semáforo, siendo visibles únicamente a través de la fibra óptica. Imagen 4.62 Proyección de círculos en la posición del semáforo.
ID' >265&'?2@4$,'('A23"$,'B,-$*'
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' IE' 4.3.2 Display Planteamiento y documentación Se estudió, con los conocimientos ya adquiridos en la realización del prototipo del apartado 4.2.1, realizar un display de fibra óptica, con la función de poderlo acoplar a un juguete y mostrar las imágenes proyectadas sobre la mesa en un plano diferente, integrándose dicha imagen en el juguete. Hasta entonces se había trabajado con fibra óptica para proyectar colores, pero no una imagen con contornos. En este caso se quería proyectar cualquier tipo de imagen, por lo que la ordenación de las fibras ópticas era un requisito fundamental para no distorsionar la proyección. Se aplicó toda la información recopilada en el apartado 4.3.1, el empleo de fibra óptica en tabletops, sus propiedades y la forma de manufacturarla. Fase creativa Se mantenía la forma cilíndrica para poder introducirlo en el resto de juguetes, pero se decidió realizar un corte de 45º en un extremo para mejorar la visibilidad desde el punto de vista del usuario, ya que sin el corte, debería mirarse desde encima para poder visualizar bien la imagen proyectada (ver Imagen 4.63). Imagen 4.63 Concepto de display.
IF' >265&'?2@4$,'('A23"$,'B,-$*' Fabricación El proceso de fabricación fue muy similar al realizado en el apartado 4.3.1. Las diferencias principales eran que las fibras esta vez estaban rectas y que el diámetro a rellenar con fibra óptica era mucho mayor, por lo que se utilizó fibra de 1 mm de diámetro, el doble que la utilizada en el apartado 4.3.1. Además de la fibra óptica de 1 mm, se empleó tubo de PVC para alojar el manojo de fibras y resina epoxy para unir y dar consistencia a las fibras. Al ser fibras más gruesas se realizaron pruebas con diferentes métodos de corte. Se probó con una sierra de cinta, una guillotina, un cutter y, por último, con un cincel. Este último fue el método elegido, ya que se conseguían cortes rectos conservando todas las fibras juntas y del mismo tamaño (ver Imagen 4.64). Imagen 4.64 Proceso seguido para cortar la fibra óptica. También se probaron diferentes métodos para unir las fibras. Inicialmente se hicieron pruebas con pistolas de silicona. El resultado no fue el deseado, ya que al ser un adhesivo en caliente y las fibras ópticas plásticas, éstas se fundían. Por ello se retomó el uso de resina epoxy. Primero se rellenó el tubo de PVC con la fibra óptica (ver Imagen 4.65). Se dieron golpes sobre la mesa para ordenar las fibras. Se comprobó que estaban ordenadas visualizando un patrón. Una vez ordenadas, se terminaron de meter algunas fibras en los huecos que quedasen.
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' IG' Imagen 4.65 Introducción de fibras ópticas en el tubo de PVC. Se aplicó resina epoxy, dejando que cayera por su propio peso entre las fibras (ver Imagen 4.66). Una vez seco se realizó el corte a 45º con la sierra de cinta y se volvió a rellenar con resina epoxy para igualar la superficie. Imagen 4.66 Aplicación de resina epoxy. Finalmente, se realizó el pulido en las dos superficies (ver Imagen 4.67).
IH' >265&'?2@4$,'('A23"$,'B,-$*' Imagen 4.67 Pulido de las superficies de fibra óptica. Comprobación en la mesa En las pruebas en la mesa se obtuvieron resultados muy a tener en cuenta en futuros diseños. En el diseño inicial la base se situaba en dirección perpendicular a la mesa y era el extremo superior el cortado a 45º. Se supuso que, al estar la superficie inclinada, se vería perfectamente desde la perspectiva del usuario. La prueba demostró lo contrario. Para poder ver perfectamente la imagen había que situarse justo encima del display (ver Imagen 4.68). Esto es debido a que los haces de luz rebotan en las paredes de la fibra óptica, siguiendo así la trayectoria de la fibra. Al salir los haces de luz, éstos siguen la dirección con la que entraron en la fibra, ya que en el extremo final no rebotan, por lo que, aunque el extremo esté a 45º la luz sigue la dirección que había tomado en la fibra.
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' II' Imagen 4.68 La luz sigue en dirección vertical, alejándose de la perspectiva del usuario. La solución que se adoptó fue cambiar la orientación de la base, entrando de esta manera los haces de luz con la inclinación deseada. Con esto conseguíamos que se viera perfectamente desde la perspectiva del usuario (ver Imagen 4.69). Sin embargo la luminosidad no era total, debido a que la luz proyectada iba en dirección vertical y las fibras estaban en dirección oblicua, por lo que la mayoría de los rayos no llegaban a entrar en la fibra, porque no llevan el ángulo necesario, el llamado cono de aceptación (apartado 3.5) (ver Imagen 4.70). Imagen 4.69 La luz sigue la dirección oblicua de las fibras, haciéndose más visible para el usuario.
<JF' >265&'?2@4$,'('A23"$,'B,-$*' Imagen 4.78 Orificios y tubo donde se introduce la fibra óptica (izquierda) e inyección de resina epoxy (derecha). El tubo con fibra óptica se unió al cuerpo del selector. Además, se creó un saliente con masilla para poder indicar claramente hacia dónde señalaba el selector (ver Imagen 4.79). Imagen 4.79 Marcador de dirección.
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' <JG' Después de aplicar la masilla, se lijó y pintó, tapando los extremos de la fibra para no cubrirlos de pintura. Por último, se colocó una semiesfera transparente encima de la fibra óptica. (ver Imagen 4.80) Imagen 4.80 Selector/regulador acabado. Comprobación en la mesa Se realizaron pruebas con el primer prototipo con un fiducial orientable en la mesa, ya que el resultado sería el mismo con el selector/regulador con fibra óptica. En cuanto a la captación por Reactivision y visualización no hubo ningún problema. Sin embargo, estas pruebas sirvieron para detectar algunos detalles que hacía falta tener en cuenta para que la interacción con el usuario fuese lo más intuitiva posible. En el caso del selector se detectó que, al colocarlo sobre la mesa, éste debía aparecer indicando la opción número uno del menú, independientemente de la orientación en la que se apoyase el selector. Por lo tanto el gráfico que rodea al selector debe de girar acorde a la orientación del fiducial (ver Imagen 4.81).
<JH' >265&'?2@4$,'('A23"$,'B,-$*' Imagen 4.81 Al colocar el selector en la mesa, el menú de opciones debe aparecer indicando la opción número uno. En cuanto al regulador, usando como ejemplo el tempo en el juego de música (apartado 3.4.3.3), se percibió que al colocar el regulador, el tempo debe de empezar a la mitad del círculo, para a partir de ahí bajarlo o subirlo. De otra manera el tempo partiría acelerado o ralentizado, debiendo de comenzar con un valor intermedio. Además de esta manera, al ver el gráfico completando la mitad del círculo, el usuario ya detecta en qué sentido se aumenta y en cual se disminuye el tempo (ver Imagen 4.82). Imagen 4.82 Posición inicial del regulador.
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' <JI' Diseño del fiducial - Requisitos Se necesitaba detectar a qué opción esta señalando el selector en cada momento, por lo tanto, se debía de detectar la orientación. - Diseño del fiducial En este caso, el círculo de fibra óptica también era visto como negro, así que se tuvo en cuenta para diseñar el fiducial más sencillo orientable (ver Imagen 4.83), con el árbol W0121. Imagen 4.83 Fiducial orientable sencillo para el selector/regulador. - Adaptación a la base del manipulativo Se colocó el fiducial con el punto negro en la posición de la fibra óptica. Este círculo se recortó para dejar pasar la luz a la fibra y se aprovechó que el manojo de fibra óptica es visto como negro por Reactivision (ver Imagen 4.84). Imagen 4.84 Fiducial aprovechando el manojo de fibra óptica visto como un punto negro.
<<J' >265&'?2@4$,'('A23"$,'B,-$*' - Comprobación El fiducial era identificado y su orientación era detectada correctamente. Interfaz gráfica El mismo manipulativo servía tanto de selector como de regulador, por tanto había que crear interfaces diferentes para cada una de las funciones. Selector Se desarrollaron un par de propuestas gráficas, una genérica y otra para selección de colores. Los desarrollos de ambas propuestas siguieron el mismo método de trabajo. Se idearon dos estilos muy diferentes. Para el genérico, un aspecto mas moderno y tecnológico. Para el selector de colores, un aspecto de dibujo animado. En el genérico se creó un disco dividido en ocho partes, con unos círculos que giraban a su alrededor. Además, la porción de disco que estaba seleccionada, debía de cambiar de color. Finalmente desaparecía con un efecto de romper el cristal de la mesa. Para el selector de color, se diseñaron siete manchas de color, que aparecían explotando, al seleccionar un color aumentaba el tamaño de la mancha y luego desaparecían al ser borradas por un limpiaparabrisas. Se comenzó creando los elementos gráficos de manera vectorial con Adobe Illustrator (ver Imagen 4.85).
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' <<<' Imagen 4.85 Elementos gráficos para las animaciones de los selectores. Estos elementos gráficos se importaron a Adobe Flash, con objeto de crear un clip de película con la animación que aparecería al interaccionar con el selector. Dentro del clip de película se realizaron todas las animaciones de movimiento, escala, cambios de color, etc. disponiéndolas a lo largo de la línea de tiempo.
<<=' >265&'?2@4$,'('A23"$,'B,-$*' Se separaron las diferentes partes de la animación (precarga, selección y desaparición), como se muestra en la Imagen 4.86 del selector de colores y en la Imagen 4.87 del selector genérico. Así se podría asignar mediante código la franja de fotogramas que interesara mostrar en cada caso. Imagen 4.86 Precarga, selección y desaparición del selector de colores.
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' <<C' Imagen 4.87 Precarga, selección y desaparición del selector genérico. Una vez creado el archivo flash, se probó en la mesa para observar el resultado (ver Imagen 4.88).
<<D' >265&'?2@4$,'('A23"$,'B,-$*' Imagen 4.88 Aspecto del menú del selector genérico en NIKVision. Regulador Para los gráficos del regulador, se tomó como referencia el juego ya existente de música (ver Imagen 4.89) en el que se podría usar el nuevo elemento como regulador de tempo, aunque dándole un aspecto totalmente diferente. Se buscaba una apariencia orgánica, cosa muy difícil de conseguir con Adobe Flash. El programa utilizado para ello fue de nuevo Particle Illusion (ver Anexo 2). La idea era trabajar con fotogramas que se exportarían después a Flash. Imagen 4.89 Aspecto del juego de música ya existente.
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' <<E' Se querían reproducir unos aros que rodearían el regulador y que pasarían de menor a mayor cantidad y tamaño, conforme se girara el regulador. También debían de cambiar de color, de azul a rojo. Se comenzó creando las formas de las partículas. La forma principal fue la del aro, ya que como se ha dicho nos inspirábamos en el juego de música cuya apariencia consiste en aros de colores (ver Imagen 4.90). Imagen 4.90 Forma creada para las partículas. Se creó la trayectoria que iba a seguir el emitter (emisor de partículas); en este caso sería circular, porque se quería que surgiesen alrededor del selector (ver Imagen 4.91). Imagen 4.91 Trayectoria que sigue el emitter a lo largo de los fotogramas.
<==' >265&'?2@4$,'('A23"$,'B,-$*'
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' <=C' 4.3.5 Agitador Planteamiento y documentación Pensando en nuevos modos de interacción con la mesa, surgió la idea de diseñar un manipulativo que permitiera obtener resultados aleatorios mediante una interacción similar a la de agitar un cubilete de dados. Fase creativa Se decidió continuar con la forma cilíndrica por estandarizar. Un primer concepto consistía en introducir un dado en un cubilete con base transparente, utilizando los propios puntos del dado como tokens. Este concepto se descartó debido a que las dimensiones del dado debían ser demasiado grandes para que la cámara pudiera detectar los tokens. El concepto finalmente desarrollado consistía en un contenedor que alojaba tres bolas blancas y tres negras, el cual al agitarlo, dejaba ver de manera aleatoria una combinación de círculos en su base, formada por bolas de ambos colores. La posición de las bolas blancas (tokens en este caso), daría lugar a diferentes combinaciones que después se podrían traducir a valores concretos. Este concepto permitía obtener siete combinaciones (todo en negro no cuenta) y por tanto, siete resultados en un espacio reducido (ver Imagen 4.100). Imagen 4.100 Concepto final de agitador.
<=D' >265&'?2@4$,'('A23"$,'B,-$*' Fabricación Se utilizó únicamente tubo de PVC , planchas de PVC espumado y se adquirieron seis bolas pequeñas de plástico. Se cortó el tubo de PVC y se hicieron las tapas con PVC espumado (ver Imagen 4.101).A la tapa inferior se le realizaron los tres orificios por donde asomarían las bolas. Alrededor de los orificios se realizaron unos rebajes para forzar a las bolas a entrar, impidiendo que se quedasen a mitad. Se pintaron tres bolas negras y tres blancas y se introdujeron en el contenedor de PVC, pegando después las tapas. Una vez unido el conjunto, se enmasilló, lijó y pintó. Imagen 4.101 Cortado de tubo de PVC y tapas para el agitador. Comprobación en la mesa Las pruebas en la mesa antes de acoplarle un fiducial fueron satisfactorias, ya que Reactivision detectaba perfectamente cuando había bola negra o blanca, siendo las blancas los tokens. Se observó que si una bola no entraba totalmente en uno de los orificios y asomaba sólo parcialmente, éste no era detectado. Esto ocurría pocas veces, gracias a los rebajes realizados en los orificios. En todo caso, esto equivalía a que hubiese una bola negra y seguía formando parte del azar. Diseño del fiducial - Requisitos El fiducial debía de ser orientable, para poder calcular el vector de orientación y, a partir del mismo, calcular en qué posición aparece
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' <=E' cada token (bolas blancas). Para evitar problemas de detección, debía estar a cierta distancia de los tokens. - Diseño de fiducial Se realizó el fiducial más sencillo posible que detectase orientación. Su árbol es W0121. - Adaptación a la base del manipulativo Se tuvo que ampliar la base para poder situar el fiducial a un lado de los tokens y a una distancia lo suficientemente grande para no interferir entre sí. Se colocó, por tanto, en un lateral con el vector que forma el fiducial orientable señalando a uno de los tokens. De esta forma, solamente habrá que detectar si el token que ha aparecido está en el propio vector (vector rojo), a su derecha (ángulo positivo α) o a su izquierda (ángulo negativo β) (ver Imagen 4.102). Imagen 4.102 Se muestran los tres tokens, el alineado con el vector de orientación del fiducial, el de su izquierda y el de su derecha.
<=F' >265&'?2@4$,'('A23"$,'B,-$*' - Comprobación: Se separó lo máximo posible el fiducial de los orificios donde aparecen los tokens, ya que en las primeras pruebas, los tokens más cercanos no eran detectados por no tener un borde lo suficientemente ancho que los separase del fiducial. Una vez ampliada la separación, no hubo problemas de detección (ver Imagen 4.103). Imagen 4.103 Imagen procesada del fiducial del agitador con dos bolas blancas en los orificios.
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' <=G'
<=H' >265&'?2@4$,'('A23"$,'B,-$*' 4.3.6 Ruleta de azar Planteamiento y documentación Se planteó realizar una nueva forma de interacción similar a la de girar una ruleta para obtener un resultado aleatorio. Aunque esto se podía resolver mediante otros métodos, como por ejemplo con el agitador (apartado 4.3.5), se experimentó otra forma de interacción que resultase también intuitiva para el usuario. Fase creativa Una de las opciones que se barajaron era la de girar una ruleta manualmente. Pero para conseguir un giro cómodo, las dimensiones de la ruleta resultaban excesivamente grandes, por lo que fue descartada. Retomando el mecanismo utilizado en los pulsadores, se podía conseguir un disco que girara libremente al presionar un pulsador. A éste se le podría colocar un fiducial orientable cuya última posición detectada por Reactivisión se traduciría en un resultado concreto. La dimensiones aquí no eran un problema ya que únicamente se reducía al tamaño de un fiducial. Se consideró que ésta era la solución más adecuada y fué la que se desarrolló (ver Imagen 4.104). Imagen 4.104 Concepto final de la ruleta de azar.
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' <=I' Fabricación Se empleó tubo de PVC para integrar en las dimensiones deseadas el mecanismo de un cenicero de tapa giratoria. Se utilizó PVC espumado para realizar las tapas. Se cortó tubo de PVC con las dimensiones deseadas. Se creó la base inferior con un gran orificio, por donde se mostraría el fiducial. Se realizó el orificio a la tapa superior, por donde asoma el pulsador. Se utilizó el mismo mecanismo que en el pulsador, con la diferencia de que el disco giratorio conservaba los rodamientos necesarios para un giro libre. Se ensambló el mecanismo entre el tubo de PVC y la tapa. Se enmasillo, lijó y pintó de negro (ver Imagen 4.105). Imagen 4.105 Pintado con pintura acrílica de la ruleta de azar. Comprobación en la mesa Al pulsar la ruleta, el fiducial baja hasta una altura en la que es visible para Reactivision. Una vez está abajo, la ruleta sigue girando. Se comprobó que había que mantener el botón pulsado hasta que parase la ruleta para poder leer la orientación del fiducial, ya que sino, o está a una altura en la que no es visible, o está girando a una velocidad tal que la cámara no puede detectar el último fotograma antes de subir el fiducial. Diseño de fiducial - Requisitos El único requisito era que el fiducial fuese orientable, ya que de su orientación se sacaría el valor aleatorio.
<CJ' >265&'?2@4$,'('A23"$,'B,-$*' - Diseño del fiducial Se creó el fiducial más sencillo con orientación, con árbol W0121. Además, la forma circular que ya se había empleado anteriormente, se adaptaba perfectamente al disco giratorio (ver Imagen 4.106). Imagen 4.106 Fiducial orientable W0121 - Adaptación a la base del manipulativo Se escaló el fiducial con las medidas del disco giratorio y una vez impreso se pegó en el propio disco (ver Imagen 4.107). Imagen 4.107 Fiducial colocado en el disco giratorio. - Comprobación Al tener en cuenta los condicionantes explicados en el apartado “Comprobación en la mesa”, ya no existía ningún problema en la detección del fiducial y su orientación (ver Imagen 4.108). Imagen 4.108 Imagen procesada del fiducial de la ruleta de azar una vez pulsada.
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' <C<'
<CH' >265&'?2@4$,'('A23"$,'B,-$*' Todos estos elementos se pasaron a Adobe Flash, creando para cada uno de ellos un clip de película. En el caso de los pupitres, cada clip contenía tres fotogramas con sus tres estados: el normal, el de la posición desde donde se lanza el avión (con resplandor y pupitre verde) y el estado del pupitre objetivo (con resplandor y pupitre naranja) (ver Imagen 4.119). Imagen 4.119 Clips creados en Adobe Flash para el juego del tirachinas con los tres tipos de estado para los pupitres. Por tanto, la dinámica del juego consiste en lanzar el avión de papel desde donde está (pupitre con resplandor verde), hasta el pupitre que esté naranja. En caso de llegar correctamente el lanzamiento, el personaje que lo reciba mostrará el símbolo de OK. En caso contrario, se repetirá el lanzamiento.
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' <CI' Se comprobó su funcionamiento sobre la superficie de NIKVision (ver Imagen 4.120), obteniendo un resultado positivo. Imagen 4.120 Aspecto del juego sobre la superficie de NIKVision.
<DJ' >265&'?2@4$,'('A23"$,'B,-$*'
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' <D<' 5. RESULTADOS
<D=' >265&'?2@4$,'('A23"$,'B,-$*'
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' <DC' 5. Resultados A continuación se muestran unas imágenes del resultado final del trabajo realizado a lo largo del proyecto.
<DD' >265&'?2@4$,'('A23"$,'B,-$*'
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' <DE'
<DF' >265&'?2@4$,'('A23"$,'B,-$*'
!"#$%&'(')&*#+,-))".*'/$'0-1-$+$#'"*+$,2)+"3&#'42,2'$5'+265$+&4'789:"#"&*;' <DG'