Archivo de diseño

Para la confección del archivo de diseño del videojuego se expondrán las diferentes secciones en tablas separadas para un manejo más simple y claro a la hora de ver la información. Este archivo contiene toda la información que se necesita del juego, y puede estar sujeto a cambios, como bien se menciona anteriormente. Dado que la metodología no está sujeta a una representación específica, sino que consideran la creación propia de esquemas para el fácil manejo de la información entre los integrantes del equipo de desarrollo como la mejor manera de actuar, cada vez que se utilice un tipo específico de representación dentro del archivo de diseño, se describe detalladamente su funcionamiento.

Documento de Diseño

Campo DESCRIPCIÓN

CONCEPTO

Título Un mundo mágico de algoritmos.

Estudio/Diseñadores René Osvaldo Camacho Fernández, Dr.C. Ramiro Pérez Vázquez.

Género Videojuego de lógica

Plataforma Computadora Personal.

Versión 01

Sinopsis de

Jugabilidad y Contenido

La historia del videojuego gira en torno a un guerrero enviado a rescatar unos pequeños príncipes que fueron raptados por un hechicero que le encantan los acertijos y los puzles, por lo tanto, la jugabilidad está fuertemente vinculada a esta visión de resolver problemas. El jugador se verá ante diferentes desafíos que pondrán sus habilidades a prueba, pues solo contarán con un número bien restringido de acciones posibles, y tendrán que pensar en un algoritmo capaz de responder a tal reto.

El objetivo de este diseño es moldear la mente de los jugadores de tal forma que en el futuro puedan enfrentarse a situaciones de esta índole, mientras cursan carreras relacionas con el mundo de la programación, y sean capaces de entender más fácilmente como resolver mediante algoritmos, los problemas que se les planteen.

Licencia Original.

Mecánica El jugador tiene a su disposición una serie de comandos que puede utilizar en todo momento, y otros, que solo puede utilizar en situaciones específicas, estos son:

• Avanzar: Avan.

• Girar a la derecha: GirDer. • Girar a la izquierda: GirIzq. • Saltar: Salt.

29 • Interactuar: Inter.

• Procedimiento: Pro1 y Pro2. • Cheq (Inter).

• Romper: Romp.

El personaje se encuentra en un escenario dividido en filas y columnas, y el objetivo es llegar a una casilla específica, para esto cuenta con las acciones mencionadas anteriormente. Tecnología Para la creación del videojuego de necesita de la tecnología

ofrecida por los ordenadores personales. En cuanto a software se quiere emplear el editor Unity(Unity, no date), en el cual se utiliza el lenguaje de programación C# en los scripts. Público El juego está dirigido a las personas interesadas en cursar

estudios relacionados al mundo de la programación, pero también lo pueden jugar todo el resto de personas que deseen disfrutar resolviendo puzles y acertijos.

HISTORIAL DE VERSIONES 01: Diseño original del videojuego.

Tabla 1: Documento de diseño

MECÁNICA DEL JUEGO

Las mecánicas fueron explicadas con detenimiento en el epígrafe 2.1.2

Cámara La perspectiva que se desea crear es la de una vista isométrica en 2D, de tal forma que se vea la totalidad del terreno en todo momento para que sea fácil de entender la situación en que se encuentra el jugador.

Periféricos Para completar el juego solo es necesario el teclado y el mouse. Controles Cada botón tiene un diseño afín a la ambientación de la historia,

por lo tanto, es necesario describir cada uno. En la interfaz de usuario estos están ubicados en la parte inferior y su orden coincide con la siguiente lista:

• Avanzar: El ícono de esta acción es una flecha apuntando en dirección derecha, sin muchos ornamentos, pues se pretende crear una interfaz libre de distracciones.

• Girar a la derecha: El ícono de esta acción representa al personaje, mientras una flecha en dirección de las manecillas del reloj le superpone.

• Girar a la izquierda: El ícono de esta acción representa al personaje, mientras una flecha en contra de la dirección de las manecillas del reloj le superpone.

• Saltar: El ícono de esta acción es el personaje haciendo un ligero salto en el aire.

• Interactuar: El ícono de esta acción pone al personaje activando un mecanismo accionado por poleas y un engranaje.

30 • Procedimiento: El procedimiento uno está representado

por una bombilla de color verde. En la parte superior se encuentra una casilla con un número, el cual puede ser cambiado y representa la cantidad de veces que se desea correr la subrutina almacenada en Pro1.

• Cheq (Inter), Cheq (Giro): Para chequear una acción el ícono es de pregunta, y cuando se pone en la sección de comandos, se hace clic sobre él y cambia por una de las dos acciones posibles a chequear, pero con un ícono de interrogación en la esquina izquierda superior de color negro.

Puntaje El juego consta de tres escenarios diferentes, en el primero se presentan los comandos más simples y se pone a prueba la capacidad del jugador para resolver problemas, en el segundo se introducen los ciclos, un concepto interesante, y que supondrá un reto adecuado, para el escenario final se reservaron las sentencias condicionales. Cuando el jugador avanza a través de cada escenario se le deja saber que ha alcanzado el dominio de un concepto importante de programación, y se le brindan datos más científicos al respecto.

Guardar/Cargar El juego tiene una pantalla de selección de nivel, dividida en tres diferentes pantallas, cada una representa uno de los escenarios. A cada nivel solo puede acceder si ha completado el anterior, y mediante un sistema de tres estrellas sobre el nombre de cada nivel, se le deja saber el progreso en los retos del nivel en el que se encuentra. El jugador no tiene que preocuparse por guardar, pues cada vez que complete un nivel se guarda la información de su avance, y el algoritmo que desarrolla, queda guardado para revisarlo si así lo desea, al acceder de nuevo al nivel en cuestión.

Tabla 2: Mecánicas del juego

A continuación, se desarrollan los estados del juego, que no son más que todas las interfaces que el jugador puede presenciar, para la visualización se emplean diagramas de estados que muestren de una manera simple la pantalla en la que se encuentra y que sucede al interactuar con cada botón. Esta tabla se complementa con la siguiente, llamada Interfaces, en la cual se describe detalladamente cada una de las pantallas.

31 ESTADOS DEL JUEGO

Ilustración 9: Leyenda de los símbolos.

En la ilustración nueve se muestra la leyenda de los símbolos que se utilizan en los diagramas, los rectángulos representan las distintas ventanas con las que el jugador puede interactuar, los botones, representados con círculos, son las acciones que se pueden ejecutar, y las flechas indican la transición de un menú a otro, al accionar un botón.

La ilustración 10 representa la pantalla principal, que se le muestra al jugador una vez ejecute la aplicación.

Ilustración 10: Diagrama del menú principal

En la ilustración 11 se define la interfaz que presenta la pantalla de selección de nivel, en un primer momento se puede seleccionar en un botón ir a la pantalla de los niveles, en la cual aparecen los niveles posibles en el escenario seleccionado. Estos niveles pueden estar bloqueados, y es trabajo del jugador resolver los problemas anteriores para poder acceder a ellos. En cambio si se selecciona el botón adelante,

32 sigue estando en la pantalla de selección de escenarios, pero el jugador está ante una pista diferente, el juego cuenta de tres pistas, donde cada una corresponde a las habilidades a desarrollar.

Ilustración 11: Selección de escenarios

En cambio, si se presiona el botón seleccionar aparece la ventana emergente del nivel, en ella se reflejan datos importantes del mismo, como la cantidad de estrellas obtenidas, y aquí el jugador puede seleccionar jugar o cancelar, la primera opción provoca que se cambie a la Pantalla del nivel, ilustración 12, y la segunda que vuelva a la pantalla de selección de niveles. La pantalla representada por el gráfico de la ilustración 12 es la más importante del juego, pues en ella es donde realmente juega el usuario, en la siguiente sección de documento del archivo se explica con detalle cómo funciona y cada detalle de la interfaz de esta pantalla. Aquí el jugador puede presionar el botón Ejecutar para correr el algoritmo que ha creado en la Barra de Proceso, la cual se explica en la siguiente parte, si el algoritmo es correcto pues se activa la ventana emergente de completar el nivel, en esta solo se puede seleccionar el botón completar, que nos lleva a la pantalla de selección de niveles, en otro caso, si el algoritmo es incorrecto, se termina la ejecución del algoritmo, reiniciando el nivel a sus valores iniciales, pero se mantiene el algoritmo intacto. También se puede optar por seleccionar el botón salir, a lo cual el juego reacciona con una ventana emergente, la cual posee los botones de Continuar para regresar a la pantalla de nivel en la que se encontraba sin que ocurra ningún cambio, el botón Reiniciar devuelve el nivel al estado original, o sea elimina todas la acciones que puedan estar en la Barra de Proceso y las Subrutinas, de esta manera se puede empezar a resolver el problema desde el principio. El botón de salir hace que la interfaz se cierre y el usuario regresa a la pantalla de selección de niveles.

33

Tabla 3: Estados del juego.

INTERFACES

Las interfaces están estrechamente relacionadas a la tabla de Estados, pues aquí se pretende extender la información brindada anteriormente sobre cada una de las interfaces que corresponde con estados específicos del juego. También se profundiza en la visualización frontal (del inglés Heads-up Display) que no es más que la pantalla que muestra la información al jugador mientras está jugando, ilustración 13. Interfaz del Menú Principal

Nombre de la Pantalla Menú Principal Descripción de la Pantalla

En esta pantalla se presenta al jugador el título del juego, se dan algunas opciones de configuración, como seleccionar el lenguaje del videojuego, controlar el volumen de la música, y puede recibir consejos que le ayuden a entender cómo funcionan las herramientas que están a su mano para resolver los problemas, así como ejemplos de respuestas a algunos planteamientos.

Estados del Juego

Esta pantalla es invocada por los siguientes estados: • Pantalla de selección de escenarios.

• Archivo ejecutable.

Desde esta pantalla se pueden invocar los siguientes estados:

Ilustración 12: Interfaz de usuario en el juego.

El número de interfaces es el menor posible, para mantener el juego simple y ligero, teniendo en mente que no se haga extenuante y aburrido al jugador.

34 • Pantalla de Opciones.

• Pantalla de selección de Escenarios. Interfaz de selección de Escenarios

Nombre de la Pantalla Menú secundario. Descripción de la Pantalla

En esta pantalla se puede seleccionar el escenario, éste corresponde con el momento en el que se desarrolla la historia, pero siempre se puede seleccionar uno mientras ya haya sido desbloqueado anteriormente.

Estados del Juego

Esta pantalla la invocan los siguientes estados: • Pantalla Principal.

• Pantalla de Selección de Niveles.

Desde esta Pantalla se pueden invocar los siguientes estados: • Pantalla Principal.

• Pantalla de Selección de Niveles. Pantalla de selección de Niveles

Nombre de la Pantalla Menú Secundario. Descripción de la Pantalla

En esta interfaz se selecciona el nivel que se desee jugar, para esto se invoca la Ventana emergente del nivel que se desea jugar, en la cual se muestran datos de interés y se puede, finalmente, comenzar a jugar. Estados del

Juego

Esta pantalla la invocan los siguientes estados: • Interfaz de selección de escenarios. • Pantalla de Nivel.

Desde esta Pantalla se pueden invocar los siguientes estados: • Pantalla de Selección de Escenarios.

• Pantalla de Nivel. Pantalla de Nivel Nombre de la Pantalla H.U.D. Descripción de la Pantalla

En esta interfaz se desarrolla toda la acción del juego, en ella se interactúa directamente con el juego, se da a conocer el problema, se introducen las acciones en las rutinas y subrutinas, y se ejecuta el programa creado. La zona de color verde representa las acciones que puede hacer el personaje, las zonas de azul son donde se crea el algoritmo, la primera es la rutina principal, la segunda es el Procedimiento uno, y la tercera es el Procedimiento dos. Por último. el botón rojo con forma circular representa corresponde con el botón de ejecutar el algoritmo, y el cuadrado con el botón de salir del nivel. Estados del

Juego

Esta pantalla la invocan los siguientes estados: • Pantalla de selección de Niveles.

Desde esta Pantalla se pueden invocar los siguientes estados: • Pantalla de selección de Niveles.

35 Pantalla de Nivel.

Imagen

Ilustración 13: H.U.D.

La zona central corresponde a la visualización del escenario en el que se encuentra el avatar del jugador, en la zona inferior están todas las acciones que se pueden arrastrar hacia las zonas de la parte derecha de la pantalla, esta está dividida en tres, la primera es la rutina principal, la segunda es la subrutina del procedimiento uno y la tercera es la subrutina que se ejecuta al verificar una acción con el comando Cheq ().

El círculo rojo es el botón de “correr” el algoritmo, y el cuadrado rojo es el botón de “Salir”.

Tabla 4: Estados del juego.

Representados en la tabla cinco, están todos los niveles principales que el jugador tiene que completar para avanzar en la historia, estos están divididos por nivel de complejidad en tres escenarios diferentes, en el primero el personaje solo tiene acceso a los comandos más básicos, y el objetivo de esta sección es que el usuario se apropie de los principios básicos que debe controlar para poder avanzar. Los conocimientos que se ganan en estos niveles permiten resolver problemas simples y básicos que tan solo exigen realizar una serie de acciones de forma algorítmica, desde el punto de vista de una persona con estudios relacionados a la programación, estos niveles son realmente fáciles, pero son necesarios a la hora de introducir a los jugadores, pues ellos no tienen a su alcance un profesional que guie su camino, o un plan de clases por el que se pueda guiar en cada momento, ni siquiera un material bibliográfico que sirva de ayuda.

36 En el siguiente escenario se plantea el uso de procedimientos, y más adelante en el mismo, el empleo de estos procedimientos recursivamente. Estos problemas tienen un nivel de complejidad medio, y aquellas personas que pudieron completar la anterior sección, de manera eficiente, no tendrán problema para entender el funcionamiento de esta nueva mecánica.

Por último, se introducen las sentencias condicionales, con esta mecánica se alcanza el pico de dificultad del juego, pero también es la mecánica más divertida de usar, pues funciona relativamente parecido a como la mente de una persona resuelve un problema, si una condición se cumple pues se ejecutan ciertas acciones, en caso contrario, pues el proceso sigue su curso original sin mayores eventualidades.

Para la implementación de esta parte del documento de diseño se considera necesario, dadas las características del videojuego en cuestión, agregar una sección en la cual se describan las diferentes maneras de resolver cada nivel, la cual se llamará Algoritmo. Para interpretar de manera correcta las ilustraciones de ejemplo de esta sección hay que tener en cuenta la siguiente información:

Ilustración 14: Símbolos de los niveles.

1. Este símbolo representa la casilla en la que se encuentra el avatar del jugador al inicio del problema.

37 3. Este símbolo representa las casillas del camino principal que están en el segundo nivel de altura, solo se puede acceder a ellas desde una casilla de nivel uno o una de nivel 3, con el comando Saltar.

4. Este símbolo representa las casillas del camino principal que están en el tercer nivel de altura, solo se puede acceder a ellas desde una casilla de nivel dos, con el comando Saltar.

5. Este símbolo representa las casillas en las que se encuentra un enemigo, visualmente en el juego además del enemigo correspondiente, se puede ver una bandera a sus pies que indica el número de ataques necesarios para eliminarlo. 6. Este símbolo representa las casillas en las que se puede encontrar un objeto especial, las espadas y arcos no tienen información extra, pero los bastones tienen escrito la casilla a la que conducen: -> 2, o la casilla que representan: 2. 7. Este símbolo representa las casillas en las que es posible usar el comando Cheq

().

8. Este símbolo representa un obstáculo que no puede ser superado de ninguna forma.

9. Este símbolo representa las monedas especiales, estas solo pueden ser alcanzadas al utilizar un arco.

10. Este símbolo representa la casilla en la que se encuentra la meta del nivel, si se ejecuta un comando Interactuar en esta casilla, se termina el nivel, no importa cuánto quede del algoritmo por ejecutar.

11. Este tipo de símbolo, representado por un contorno que puede ser de varios colores, alrededor de una casilla es leyendo utilizado para combinar diferentes casillas, por ejemplo, si se utiliza éste con el número 4, significa que existe un enemigo en una casilla nivel 3.

NIVELES

Título del Nivel Nivel01.

Encuentro Este es el primer nivel del juego, en él se plantea el desarrollo de la historia y se anima al jugador a atravesar todos los niveles para completar la aventura.

Descripción La ambientación es del primer escenario, no hay enemigos ni obstáculos que interfieran.

38 Ilustración 15: Nivel01 Algoritmo Solución: Rutina Principal: 1. Avan. 2. Avan. 3. Avan. 4. Avan. 5. Inter.

Objetivos El objetivo del jugador es hacer que el avatar atraviese el camino de forma lineal y al alcanzar la casilla objetivo utilice el comando Interactuar.

Progreso En este nivel se introducen los comandos más básicos del juego: Avanzar e Interactuar.

Al terminar el nivel se obtienen los premios alcanzados, al no tener que hacer nada en específico se logran alcanzar las cuatro estrellas sin mayor complejidad.

Personajes En este nivel se introducen el Personaje principal y el Antagonista.

Título del Nivel Nivel02.

Encuentro Este nivel introduce las acciones de girar hacia ambos lados, es un comando simple que permite al jugador girar en el camino para poder llegar a su objetivo

Descripción La ambientación es del primer escenario, no hay enemigos, un obstáculo impide el avance del jugador por el camino principal. El diseño es el siguiente:

Ilustración 16: NIvel02 Algoritmo Solución:

39 1. Avan. 2. GirDer. 3. Avan. 4. Avan. 5. GirIzq. 6. Avan. 7. Avan. 8. Avan. 9. GirIzq. 10. Avan. 11. Avan. 12. Inter.

Objetivos El objetivo del jugador es hacer que su personaje atraviese el camino, un árbol, el cual corresponde con la zona en rojo, se interpone en el camino principal por lo que tiene que tomar una ruta alterna, al final tiene que usar el comando interactuar en la casilla objetivo.

Progreso Al terminar el nivel se obtienen los premios alcanzados, al no tener que hacer nada en específico se logran alcanzar las cuatro estrellas sin mayor complejidad.

Enemigos Se introduce el concepto de obstáculo infranqueable, estos no permiten el paso y obligan al jugador a tomar otros caminos.