martes, 13 de diciembre de 2016

Análisis Heurístico a Minyiu


La tabla superior (anexada en el enlace para ajustar el rango de visión en pantalla) representa la conclusión del tercer y último análisis heurístico en la materia de Usabilidad y Técnicas de Interacción para Minyiu. En este, el análisis heurístico abarcó 50 preguntas del play-persona, la respuesta por parte del desarrollador del producto, el área al que pertenecen en el mapa de elementos del juego, cómo se planean resolver dichas dudas (a partir de requerimientos de diseño) y qué tan grave resulta su implementación en el juego.

El análisis encontró, entre otras problemáticas, la falta de bloques categóricos para el lanzamiento oficial del juego (tal y como el segmento de promoción), y resultó en la remodelación efectiva del mapa de elementos anterior.

Mapa de Elementos v.2.0 (sin heurísticas)


Mapa de Elementos v.3.0 (con heurísticas y nomenclatura efectiva)


En adición, los resultados del análisis conllevaron a la elaboración de una pequeña lista de faltantes a modificar en el futuro con el propósito de mejorar la usabilidad y los métodos comunicativos del videojuego:
  1. Añadir área de posibilidades externas al término de la elaboración del vertical slice (para la elaboración final del producto).
  2. Logros internos y recompensas al jugador. 
  3. Incluir tutoriales de mecánicas, dinámicas y controles. 
  4. Realizar pruebas de concepto para la implementación de la narrativa. 

domingo, 11 de diciembre de 2016

Ejemplos de Wireframes y Composiciones en Minyiu


Los wireframes son más o menos una serie de prototipos gráficos con los que se grafican y distribuye la información en pantalla sin la necesidad de construir elementos estéticos para obtener un resultado aproximado a lo que el usuario experimentaría por la parte del diseño mecánico en un producto. 

Éstos nos ayudan a detectar fallas inesperadas y sirven como punto de partida para la elaboración preliminar de las interfaces finales, también conocidas como composiciones

EJEMPLOS DE WIREFRAMES EN MINYIU

Primer Wireframe del Menú Principal

Esta pantalla delimita el espacio de visión del usuario hacia el centro, donde el botón de jugar aparece como el más importante al estar tan cerca del título y el botón de salir se establece como el punto de menor importancia al estar más alejado de otros. 
Segundo Wireframe del Menú Principal
Al igual que con el wireframe anterior, la segunda revisión del menú principal se concentró en explotar la importancia céntrica de la interfaz al incluir un botón adicional con el que el jugador  pudiera diferenciar entre las dos acciones principales del menú. Esto, al igual que el incremento de las letras del título, ayudan a protagonizar al botón de jugar debido a que las letras de mayor tamaño llaman la atención del jugador y, por ende, 'jugar' es el primer botón con el usuario entra en contacto visualmente.

Primer Wireframe del Menú de Pausa
Este wireframe en particular se agregó una imagen de fondo para observar el contraste entre los elementos del menú y los elementos del juego. Su función es similar al del menú anterior con la excepción de mantener un sistema simétrico entre los cuatro elementos en pantalla. 

Segundo Wireframe del Menú de Pausa
La segunda revisión del wireframe de pausa encontró problemas distintos a los resueltos en la revisión del wireframe del menú principal; éstos siendo la incompatibilidad gráfica entre el título del menú y los botones. Para solucionarlo, el título del menú si hizo más prominente y se ajustó el color de los botones a uno un poco más uniforme.


Wireframe de Diálogos
El wireframe de diálogos sirvió antes que nada como un posicionador del cuadro de texto en pantalla y, en retrospectiva, ayudó a relocalizar la posición del jugador para una vista más 'placentera' para el usuario.

EJEMPLOS DE COMPOSICIONES EN MINYIU

Menú Principal
Tomando como referencia a los wireframes anteriores, se decidió elaborar una composición visual posible para el mnú principal del videojuego. Ésta consiste de letras claras con un fondo oscuro para resaltar los botones y de un gradiente de celeste a azul marino para representar harmonía en colores.

Pausa
La composición del menú de pausa, por otro lado, vió un ajuste artístico a la compatbilidad de los botones a través de una pequeña ventanilla trasera en colores oscuros para evitar conflictos con los colores naturales del juego.

martes, 6 de diciembre de 2016

Juego AR

Les adjunto las imágenes de un proyecto en realidad aumentada que se realizaó en un periodo de 8 horas hábiles.





Diagramas de Flujos para el Juego

Diagrama del Menú Principal

 
El videojuego inicia con la pantalla principal, la misma que determina si el jugador tiene una partida existente antes de proceder al Game Loop Principal (el juego en sí). Este diagrama de flujo también integra una de las opciones del menú de pausa.


Diagrama del Game Loop Principal  

El Game Loop Principal se conforma por el sistema de combate, el sistema de checkpoints y actúa como sistema de objetivos. En este sentido se exponen todos los sistemas activos en la escena cuando se juega el videojuego.


 Diagrama del Sistema de Salud

El diagrama del sistema de salud describe todos los casos posibles que podrían desarrollarse en el caso que el jugador nteractúe con cualquiera de los elementos de este.


Diagrama del Sistema de Pausa

El sistema de pausa, siendo uno de los diagramas con más condicionales en el juego, cuenta con todos los casos posibles con los que el jugador se puede encontrar.


Diagrama del Sistema de Salto

El sistema de salto expone a todas las condicionales necesarias para realizar la acción del desplazamiento vertical del personaje en pantalla.

domingo, 4 de diciembre de 2016

Prototipos de Papel

Los prototipos de papel son una herramienta baratal, sencilla y fácil de utilizar para la elaboración de menús y la integración de elementos en pantalla. A continuación adjuntaré una serie de imágenes con los que se trató de determinar la mejor posición del menú de un videojuego:

Sujeto 1: Ximena
Elementos del prototipo:
1. Barra de texto in-game.
2. Barra de vida.
3. Ubicación del personaje en pantalla (rectángulo con líneas diagonales).

Elementos del prototipo: 
1. Menú Principal.

Elementos del prototipo: 
1. Barra de texto in-game (alternativo).

Sujeto 2: Alex
Elementos del prototipo:
1. Barra de texto in-game.
2. Barra de vida.
3. Ubicación del personaje en pantalla (rectángulo con líneas diagonales).

Elementos del prototipo: 
1. Menú Principal.
Elementos del prototipo: 
1. Barra de texto in-game (alternativo).

Sujeto 3: Ricardo
Elementos del prototipo:
1. Barra de texto in-game.
2. Barra de vida.
3. Ubicación del personaje en pantalla (rectángulo con líneas diagonales).

Elementos del prototipo: 
1. Menú Principal.

Sujeto 4: Alef
Elementos del prototipo:
1. Barra de texto in-game.
2. Barra de vida.
3. Ubicación del personaje en pantalla (rectángulo con líneas diagonales).

Elementos del prototipo: 
1. Menú Principal.


domingo, 6 de noviembre de 2016

Resumen de MDA: A Formal Approach to Game Design and Game Research

Hoy en día existen muchas maneras en las que se pueden categorizar los videojuegos, desde el género que presentan, la consola a la que pertenecen, si son juegos para múltiples jugadores o exponen una temática en específico. Sin embargo, en lo que a los académicos respecta, la clasificación del desarrollo de juegos necesitaba un enfoque lógico y estructurado para poder categorizar a los productos de la industria, razón por la que nació el método de diseño MDA (mecánicas, dinámicas y estética), el cuál se explicará a continuación.

El concepto en cuestión es bastante simple: los diseñadores contemplan los componentes del juego como reglas, el sistema y "diversión" para después representarlas con sus contrapartes de mecánicas, dinámicas y estética en el eventual diseño del producto. En este sentido, las mecánicas describen los datos algorítmicos que definen al juego, las dinámicas representan el comportamiento de las mecánicas cuando interactúan con el jugador y la estética describe las respuestas emocionales invocadas en el jugador. 

En orden de importancia, el jugador se comunica con los diseñadores a partir de la estética, la dinámica y la mecánica mientras que el diseñador se comunica con los jugadores a partir del diseño de la mecánica, dinámica y estética. 

Dicho esto, la estética abarca una lista taxonómica que incluye pero no está limitada por:
  1. Sensación - El juego como placer
  2. Fantasía - El juego como ficción
  3. Narrativa - El juego como drama
  4. Desafío - El juego pista de obstáculos
  5. Compañerismo - El juego como plataforma social
  6. Descubrimiento - El juego como territorio inexplorado
  7. Expresión - El juego como autodescubrimiento
  8. Sumisión - El juego como pasatiempo
Las dinámicas, entonces, existen para crear experiencias estéticas a partir de las relaciones que éstas ejercen dentro del juego, y las mecánicas actuán como las acciones que propensan dichas relaciones, lo que da a lugar a tres pasos para la elaboración de un elemento cada vez más avanzado; supongamos, la creación de inteligencia artificial.
  1. Primer Paso: Prototipado del elemento con énfasis en mecánicas básicas.
  2. Segundo Paso: Se comienza a expandir el elemento con coceptualización estética y énfasis en dinámicas.
  3. Tercer Paso: El énfasis en estética permite la incorporación del elemento a diferentes ámbitos de múltiples juegos, pese a que se siguen desarrollando mecánicas y dinámicas para mejorar el producto.
En conclusión, el MDA supone un formato formal al diseño y ajustes del juego que, al poder trasladarse a través de sus tres niveles de abstracción, da lugar a una propuesta de diseño adicional para los desarrolladores de juegos. 

Hunicke R., LeBlanc M. & Zubek, R. (2004). MDA: A Formal Approach to Game Design and Game Research. Northwestern University. Página Disponible en: https://www.cs.northwestern.edu/~hunicke/MDA.pdf

Resumen de Beyond the HUD

Beyond the HUD es una tesis de maestría en ciencias que propone explicar la importancia, efectos y la relación entre el jugador y la interfaz de los videojuegos de disparo en primera persona (o FPS). En éste, los autores toman como estudio de referencia a Dice, una subsección de la compañía Electronic Arts (EA), para ejemplificar sus teorías a partir de productos contemporáneos. La tesis toma como referencia la categorización de juegos propuesta por Roger Caillois y prosigue a compararla con la definición de Chris Crawford en su libro The Art of Computer Game Design. 
  
Es importante remarcar que los datos anteriores son importantes debido a que son la base con la que se construye la hipótesis del documento, siendo apoyadas por conceptos como semiótica (significado de las cosas), ludología (ciencia que estudia el juego), inmersión y diégesis (perteneciente al ámbito de la ficción). Este último concepto es retomado para definir la interfaz como un elemento no diegético debido a que no pertenece al mundo en donde se desarrolla la acción del juego. Es decir, la interfaz tiene la función de comunicar datos relevantes que pertenecen al juego pero que no necesariamente pertenecen al contenido ficticio (la historia, los personajes y el contexto) del mismo. 

La tesis procede a dividir el estudio de juegos entre el estudio objetivo y subjetivo de las características de un producto, donde el estudio objetivo abarca la categorización de elementos en pantalla y el estudio subjetivo califica las decisiones creativas para presentar dicha información. Esta división es después utilizada para definir los elementos diegéticos y no diegéticos en la interfaz de juegos, los mismos que pueden ser categorizados como espaciales y ficticios (como el casco del jugador [diegético]) y no espaciales y no ficticios (como el número de balas restantes en el arma [no diegético]).

Un capítulo después, los autores definen la inmersión en dos puntos críticos para el usuario:
  1. La Inmersión por Razonamiento (donde los jugadores son alentados a usar su conocimiento de la vida real en el juego).
  2. La Inmersión por Percepción (donde la información en el juego recrea un ambiente lo suficientemente lógico para ser creído).  
Y continúan con 4 puntos guía para la elaboración de FPS.
  1. Conoce Tu Espacio de Diseño y Cómo Explotarlo.
  2. Conoce a Tu Juego.
  3. Establece una Agencia para el Jugador (el acto de tomar decisiones).
  4. Refuerza la Relación Perceptiva entre Avatar (personaje del juego) y el Jugador.
Al final de la tesis, los autores concluyen, en términos generales: la inmersión es un concepto que depende del contexto en el que se desarrolla para ser definido pero que juega una parte importante en la percepción del personaje por parte del usuario. Esto significa que, mientras más se inmerse el jugador en la experiencia, más real percibe la información que se encuentra dentro del juego.

Fagerholt, E. & Lorentzon M. (2009). Beyond the HUD. User Interfaces for Increased Player Immersion in FPS Games. Chalmers University of Technology. Suecia, Gotemburgo.