- Definición de Producto
- Entrevistas a Usuarios
- Historias de usuario
- Diseño de la interfaz de usuario
- Planificación del proyecto
- Futuras mejoras
El producto digital ha sido creado para usuarios que están comenzando a jugar POKEMON GO y desean conocer información detallada de cada pokemon que les permita armar sus propias estrategias y de esta manera, y ganar sus batallas e incrementar su nivel en el juego.
Se ha definido una lista de preguntas que nos ayudaron a conocer comportamientos e intereses del usuario final. Asimismo, que tipo de información sería útil para ellos.
Aqui se encuentra el formulario de las preguntas : Formulario de Preguntas
Link :
Los usuarios desean tener información que les permita conocer información detallada para incrementar su nivel en el juego de POKEMON GO.
Los tipos de pokemones que existen, sus debilidades, promedio de número de apariciones, horas más probables donde aparecen.
En sus tiempos libres. Generalmente emplean de 2 a 3 horas para jugar y para informarse de los pokemones que han capturado.
- Primera historia
Visualizar la información acerca de la página.
- Segunda historia
Mostrar la información de todos los pokemones (nombre, altura, peso , N° de apariciones, hora probable para encontrarlo, tipo).
- Tercera historia
Visualizar a los todos los pokemones que se encuentren ordenado según nombre de forma ascendente (de la A a la Z) y descendente (de la Z a la A).
- Cuarta historia
Visualizar a los todos los pokemones que se encuentren ordenado según N° de apariciones de forma ascendente(de mayor a menor) y descendente(de menor a mayor).
- quinta historia
El usuario podrá buscar los pokemones según el tipo al que corresponde ya sea grass, poisson, fire, bug, normal, etc.
- sexta historia
El usuario podrá conocer el maximo, minimo y promedio número de apariciones de los pokemones.
- septima historia
El usuario podrá conocer la cantidad de pokemones según su tipo.
*NOTA: Para visualizar la interfaz en versión web dar click aquí :
Para visualizar la interfaz en versión movil dar click aquí :
El por qué del diseño
El diseño esta enfocado en jugadores que empiezan a jugar POKEMON GO, considerando los colores del sitio web original e información requerida por el usuario final, se plasmó tres secciones las cuales son inicio, cards y estadisticas que permite brindarle al usuario un diseño centrado en sus necesidades.
Testeos de usabilidad / Sugerencias de los usuarios
En base a lo prototipado en borrador, se procedio a mostrar a algunos usuarios y se les preguntó si entendian lo que deseabamos presentar en las pantallas, comentaron de que si se entendia y nos sugerieron agregar una guia de usuario.
-
Adobe XD - web : En el siguiente link se muestra cómo quedó el diseño realizado en esta herramienta.
-
Adobe XD - movil : En el siguiente link se muestra cómo quedó el diseño realizado en esta herramienta.
-
Zeplin: Exportamos el prototipo de Adobe XD a Zeplin para tomar el código que se ajuste a nuestro diseño y poder usarlo en la implementación de la interfaz.
• Con el prototipo de baja fidelidad aterrizado, procedimos a diseñarlo en Adobe XD considerando los colores del sitio web original e información requerida por el usuario final, en cada una de las pantallas se puede visualizar el contraste y gradientes de los colores, lo cual permite al usuario familiarizarse con la aplicación.
- Los colores empleados son los siguientes:
-
Sobre el tipo de letra, utilizamos las fuentes de google font, que se asemejan al tipo de letra que esta plasmado en el aplicativo de POKEMON GO.
-
Mobile first: Decidimos empezar a diseñar para evitar problemas al momento de ajustar código de estilo en css.
Se realizo la planificacion en el tablero Kanban. Por cada historia de usuario desglozamos las actividades en tareas muy especificass para mapear y visualizar el flujo de trabajo.
Manejamos la Herramienta de Trello para realizar un plan de trabajo mas didactico.
A nivel básico empleamos los issues haciendo match de lo que estaba en el tablero Kanban y en Trello.
Colocamos todos los recursos que estructuramos y de consulta que utilizamos durante el proyecto.
- Guía de Usuario
- Visualizaciones gráficas: Google Charts.