GDL004-data-lovers

POKÉDEX

Índice


1. Introduction

The Pokédex is as synonymous with Pokémon as Pokéballs. They’ve been a staple of the franchise since day one and actually directly influenced the plot of the first game. In many respects, they’re the direct influencer of every mainline Pokémon game as the games don’t begin in earnest until trainers get their hands on their Pokédex. It’s not hard to see why, either. In an out of universe, the Pokédex is a trainer’s only real way of getting important in-game information. In that regard, it’s a trainer’s most useful tool.

2. Project Overview

This project was created with three different users in mind:

It was created working with a set of data, in this case, Pokemon data, adapting it for specific purposes of our users.

Our finished product allows our users to:

  1. Properly see a list with every Pokemon
  2. Filter pokemons by their type
  3. Order pokemons according to their name, weight, height, and id
  4. Search specific pokemons by name or number
  5. Save their favorite pokemons, and erase them whenever the want
  6. Visualize a window for each character with additional data
  7. See graphic charts and statistics of pokemons

It was created on our fourth week of coding bootcamp, with a deadline of three weeks for this project.

You can find it live on the top of this page, using our Github pages link.

3. Site Instructions

For optimum experience, make sure your cookies are activated. This site requires them to allow you to save your favorite pokemons.

On the header of the page, we included four buttons.

We have also facilited for you a clickable title, to make you go to the top of the page easier and faster, and for refreshing the site to the main page, as well as a home button for navegating between the different pages.

Main Body

On the main body, you will be able to see cards for every pokemon. If you wish to see what type a pokemon is, you can do so by simply hovering over the card with your mouse. For mobile devices, you will be able to do it by clicking just once.

Character window

When you wish to see specific and more detailed data for a pokemon, you can click and a pop over window will be displayed.

This window includes each pokemon’s:

We have also included a text-to-speech function, that reads the description of the displayed Pokemon. Try it out by clicking the audio button!

On the top of this window you will find a pokeball; by clicking it, you are able to save that pokemon to your favorites. If you wish to remove it, you can do so by simply clicking on the star that appears after it´s saved.

Floating Menu

On the bottom-right of the site, you will find a circle with a plus sign on it. By clicking, a menu will be displayed.

On the menu, you will have four different options:

  1. A Refresh Button
  2. A Sort Button
  3. A Filter by Type Button
  4. A Search Button

While pretty self-explanatory, you will be able to:

To close the floating menu, just click on the closing button at the bottom.

For any questions make sure to contact us to clear them for you.

4. User Stories

Pokedex User Stories

Pokedex First User Story

Pokedex Second User Story

Pokedex Third User Story

5. Prototypes

Sketched Prototypes

Pokedex Sketched Prototype Main Pokedex Sketched Prototype CW Pokedex Sketched Prototype Mobile Device Pokedex Sketched Prototype Mobile Device Filter

High Fidelity Prototypes

Pokedex HF Prototype Intro Pokedex HF Prototype Main Pokedex HF Prototype Character Window Pokedex HF Prototype Sort

6. Finished Product

Finished Product Main Finished Product Prompts Finished Product Character Window

7. User Testing and Feedback

Unit Tests

Unit Tests Unit Test One Unit Test Two More Unit Tests

Sprint working and SCRUM

Kanban Board

8. Contact Information