- Descripción del Proyecto
- Objetivo de la página
- Usuario objetivo
- Necesidad del usuario
- Historias de usuario
- Diseño de la interfaz de Usuario
- Prototipo de baja fidelidad
- Prototipo de alta fidelidad
- Responsive
- Responsive smartphone
- Responsive tablet
- Link de Figma
- Link de Github-Pages
Data Lovers ("Pokedex"), es una aplicación web que permite al usuario visualizar la data de 251 pokemones, asi como tambien, y podrá ordenar la data de forma ascedente (A-Z) y descendente (Z-A), filtrar por tipo de pokemones (Acero, Agua, Bicho, Dragon, Eléctrico, Fantasma, Fuego, Hada, Hielo, Lucha, Normal, Planta, Psíquico, Roca, Siniestro, Tierra y Volador), y podrá filtrar por nombre al pokémon de su elección.
"Pokedex", es una web responsive e intuitiva para el usuario ya que no hay necesidad de seguir instrucciones y esto le permitirá acceder e interactuar con toda la información que contiene.
Permitir al usuario encontrar e interactuar para encontrar información útil, mediante diferentes ordenamientos, filtros por tipo y/ o búsqueda por nombre de pokémon.
Toda persona aficionada o fan de los pokémones que desee información precisa, filtrada por tipos de pokémon u ordenada sobre algún pokémon en específico o várias criaturas en comúm.
Se encontró un déficit de páginas intuitivas enfocadas exclusivamente a las características de los pokémones y las existentes son de difícil acceso y no es intuitivo.
Historia de usuario 1
- YO como usuario (En la vista 1) quiero ver una interfaz de bienvenida y en otra vista (vista 2) ver todas las imágenes de los pokemones con sus respectivos nombres, hp, tipo y número de orden.
Historia de usuario 2
- YO como usuario quiero poder ORDENAR los Cards de POKÉMON de la (A-Z & Z-A) y tener un menú desplegable.
Historia de usuario 3
- YO como usuario quiero poder FILTRAR por tipo y por nombre los Cards de POKÉMON.
Historia de usuario 4
- YO como usuario quiero acceder a una página responsive y que se muestre el porcentaje de Cards de POKÉMON mostrados en pantalla.
Nuestro primer acercamiento a la aplicación Web, se basó en el desplazamiento de la información que contendrá esta misma, además de los elementos que la componen. Boceteamos en papel y lápiz nuestras ideas iniciales. Nos pusimos de acuerdo en un diseño y lo plasmamos nuevamente:
Usamos Figma como herramienta de diseño visual.
.png?raw=true)
.png?raw=true)
.png?raw=true)
.png?raw=true)