Skip to content

alejandra1012/BOG004-memory-match

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

56 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Memory Match Ghibli

Definición del producto

Nuestra versión del juego Memory Match es una, donde destapamos los famosos posters de algunas de las películas del estudio Ghibli. Esta diseñado para cualquier persona que quiera distraerse y ejercitar su memoria, tambien sentira curiosidad de conocer o ver las peliculas del Studio Gibli si es que no las conocen aun. Para el prototipado, diseño y funcionalidad, hicimos una serie de encuestas para definir como seria mejor animar y diseñar el juego.

Este juego resuelve el problema de los usuarios que quieren salir de la rutina y de forma dinamica ejercitar su memoria.

Historias de usuario

Tomamos en cuenta los conceptos y sugerencias de las encuestas para crear las Historias de Usuario, asi definimos 5 historias de usuario y a partir de estas seguimos los principios que se requieren para crear cada una de ellas como: YO, QUIERO, PARA.

HU-1 Vista general de las cartas.

Yo COMO jugadora QUIERO poder ver las cartas PARA empezar a jugar.

HU-2 Interacción del juego

Yo COMO jugadora QUIERO poder interactuar con las cartas PARA poder jugar.

HU-3 Interacción del juego parte 2

YO como jugador QUIERO que las cartas que sean iguales queden destapadas y las que no se oculten nuevamente, PARA poder ganar.

HU4 Bienvenida e Indicaciones

Yo COMO jugadora QUIERO ver una pagina de bienvenida donde me de indicaciones PARA entender el juego.

HU-5 Reiniciar Juego.

Yo COMO jugadora QUIERO oprimir un botón PARA iniciar a jugar

Prototipo de baja fidelidad

Prototipo de alta fidelidad

Lo siguiente es diseñar tu Interfaz de Usuario (UI por sus siglas en inglés - User Interface). Para eso debes aprender a utilizar alguna herramienta de diseño visual. Nosotros te recomendamos Figma que es una herramienta que funciona en el navegador y, además, puedes crear una cuenta gratis. Sin embargo, eres libre de utilizar otros editores gráficos como Illustrator, Photoshop, PowerPoint, Keynote, etc.

El diseño debe representar el ideal de tu solución. Digamos que es lo que desearías implementar si tuvieras tiempo ilimitado para trabajar. Además, tu diseño debe seguir los fundamentos de visual design.

Testeos de usabilidad

Durante el reto deberás hacer tests de usabilidad con distintos usuarios, y en base a los resultados, deberás iterar tus diseños. Cuéntanos qué problemas de usabilidad detectaste a través de los tests y cómo los mejoraste en tu propuesta final.

Implementación de la Interfaz de Usuario (HTML/CSS/JS)

Luego de diseñar tu interfaz de usuario deberás trabajar en su implementación. No es necesario que construyas la interfaz exactamente como la diseñaste. Tu tiempo de hacking es escaso, así que deberás priorizar

Como mínimo, tu implementación debe:

  1. Dado un set de cartas, barajar las cartas y mostrarlas en la interfaz.
  2. Permitir al usuario destapar las cartas de 2 en 2.
  3. Dejar destapadas las cartas que coincidan al destaparlas.
  4. Indicar al usuario que ganó cuando haya destapado todas las cartas.
  5. Ser responsive, es decir, debe visualizarse sin problemas desde distintos tamaños de pantallas: móviles, tablets y desktops.
  6. Que la interfaz siga los fundamentos de visual design.

Pruebas unitarias

en README.md.

  • Incluye el listado de problemas que detectaste a través de tests de usabilidad en el README.md.
  • UI: Muestra cartas barajadas correctamente.
  • UI: Permite al usuario destapar las cartas de 2 en 2.
  • UI: Deja destapadas las cartas que coincidan al destaparlas.
  • UI: Indica al usuario que ganó cuando sea relevante.
  • UI: Es responsive.
  • UI: La interfaz sigue los fundamentos de visual design.

About

Juego de memoria. Principal objetivo ejercitar tu mente y divertirte un rato.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors

Languages

  • JavaScript 56.2%
  • CSS 29.8%
  • HTML 14.0%