Sonia Guillén
5 min readMar 8, 2020
Flor Silent Princess del videojuego “The legend of Zelda: Breath of the wild” creada por Brenda

Si has llegado hasta aquí es que previamente has leído la primera parte de este proyecto. Si no lo has hecho, ahora es el momento de hacerlo! Haz Click aquí!

Otra bonita anécdota del Checkpoint: Le pregunté al dueño que cual había sido el criterio para elegir los videojuegos del bar, él me contó que sobretodo de los que se puede competir y jugar en grupo, pero que tenía algunos que él no había comprado, que sus clientes le regalaban algunos juegos. Ellos estaban encantados de que alguien pudiera darle uso a aquellos viejos juegos y qué mejor que en aquel lugar que tanto les gusta.

Cuando ya tuve claro que haría un catálogo digital con tablet por cada mesa del bar, donde incluiría la carta donde poder pedir sin tener que levantarse ni llamar al camarero, hice un diagrama de flujos para tener más claro de que partes se debía componer mi aplicación.

Con la arquitectura hecha decidí que debía separar los videojuegos del resto de juegos que también se jugaban en el bar, como las cartas Mágic, así que habría otra sección con los juegos de mesa. Y por supuesto un apartado para poder llamar al camarero

Una vez decida la estructura de la aplicación hice un prototipo muy simple en papel para poder hacer algunos User test para poder reajustar algunos detalles antes de empezar a hacer los wireframes a ordenador.

Básicamente los mayores problemas que tuvieron mis usuarios fueron que yo dibujo fatal y no sabían que eran esos monigotes que yo había puesto ahí, pero dejando eso de lado, me sugirieron que el botón de pedir turno en los videojuegos solo apareciera si el juego no estaba disponible porque sino creaba confusión. También me hicieron plantearme si era necesario añadir un botón de "home"en la parte superior o si podía usar el propio logo del bar para esa función.

Por otro lado busqué referentes para el posterior look and feel de la aplicación creando un Moodboard. Me acabé decantando por un estilo retro digital con pixel art usando los colores del logo como color de acentuación y un color turquesa oscuro para el fondo ya que los verdes me recuerdan a las antiguas pantallas de ordenador de antaño.

Con la guía de estilo terminé de definir los CTA y el estilo de la tipografía que también tendría un estilo retro en los títulos y una helvetica básica para los textos para mejor lectura.

Ahora sí que sí, me pongo manos a la obra con el ordenador para crear los Wireframes que me sirvieron sobretodo para decidir la posición y tamaño de cada componente, aunque como podréis ver posteriormente algunas cosas se terminan modificando.

Y por fin la parte en que ves que todo cobra vida, añadiendo colores, imágenes y todos los componentes finales.

Hice los flujos para que quedaran más claros los caminos que se podían hacer.

Remarcar también que a pesar de que acabé decidiéndome por un estilo 8 bits, previamente también se me ocurrieron otros estilos que aplicarle a la app de Checkpoint, pensando por supuesto en un estilo también digital pero tirando a algo más moderno y futurista como son el estilo de la película Tron y el estilo cyberpunk, que realmente son muy muy parecido, solo que a uno le apliqué más variedad de color como destaca en ese estilo.
Quise probar cómo quedaba para decidir finalmente con cuál quedarme, así que cogí una vista que contuviera muchos elementos y apliqué los estilos.

Me decidí finalmente por el estilo 8 bits ya que el bar evoca nostalgia y eso es lo que quería transmitir también en la aplicación recordando a los videojuegos de la infancia.

Cree también los flujos de la pantalla para que se vean más claros los caminos que se pueden seguir.

Al tener la aplicación terminada solo queda hacer un User test final con algunos clientes.

En general mis usuarios lo encontraron todo de manera intuitiva y sin problemas. Hubo una de ellas que confundió la sección para llamar al camarero con la carta, pero no se crea ningún patrón con el resto de usuarios.

Por supuesto el dueño también la probó, también le fue fácil navegar por la aplicación y me sugirió que en la sección de "llamar al camarero"añadiera varios botones con problemas frecuentes que podía tener los clientes, así el camarero ya puede traerte directamente un mando, por ejemplo, si lo que te falta es un mando más para la consola en la que quieres jugar.

También todos los usuarios me dijeron que les parecía una herramienta muy cómoda, útil y visual.

Por otro lado, una solución complementaria a la aplicación sería la mejora de la carta de bebidas y comida

Por otro lado el resto de soluciones complementarias que tenía pensadas no he podido desarrollarlas. Una de ellas era una redecoración del bar con muebles mas cómodos y aprovechando la oportunidad para darle un aire más retro, la otra solución complementaria era crear una carta temática de comida, aunque se ve algo en la aplicación me hubiera gustado desarrollarla un poco más, más adelante, si tengo ocasión quiero desarrollarlas.

Os dejo también aquí un mockup de una parte del recorrido que se puede hacer de la aplicación para que veáis cómo funciona.

Por último, y de nuevo, dar las gracias al bar Checkpoint por ser tan amable y haberme ayudado tanto. Y por supuesto a nuestros profes Pere Feliu y Nuria Gómez por ayudarme con todo el proceso y guiarme.

Sonia Guillén

UX\UI student from Barcelona. Handicraft and Japan lover.