Skip to content

michellvanegas/BOG004-data-lovers

 
 

Repository files navigation

League of Legends 🎮

Índice

1. Objetivos de aprendizaje

HTML

CSS

Web APIs

JavaScript

  • Uso de linter (ESLINT)

  • Uso de identificadores descriptivos (Nomenclatura y Semántica)

  • Diferenciar entre expresiones (expressions) y sentencias (statements)

Control de Versiones (Git y GitHub)

  • Git: Instalación y configuración

  • Git: Control de versiones con git (init, clone, add, commit, status, push, pull, remote)

  • Git: Integración de cambios entre ramas (branch, checkout, fetch, merge, reset, rebase, tag)

  • GitHub: Creación de cuenta y repos, configuración de llaves SSH

  • GitHub: Despliegue con GitHub Pages

    Links

  • GitHub: Colaboración en Github (branches | forks | pull requests | code review | tags)

user-centricity

  • Diseñar un producto o servicio poniendo a la usuaria en el centro

product-design

  • Crear prototipos de alta fidelidad que incluyan interacciones

  • Seguir los principios básicos de diseño visual

research

  • Planear y ejecutar testeos de usabilidad de prototipos en distintos niveles de fidelidad

2. Descripción

Esta página esta hecha para los amantes y para los que quieran conocer de que se trata League of Legends, ya que a través de ella pueden conocer informacion del objetivo del juego y de sus campoenes, ademas pueden filtrar esta informacion por roles, y ordenarla de acuerdo a los criterios que busque el usuario.

3. Diseño e investigación UX

Para el diseño de esta pagina realizamos una encuesta a algunos juagadores de LOL y también a algunas personas interesadas en conocer sobre el juego. El resultado de esta encuenta nos dio una guia para el prototipo de la misma. Pensamos en una pagina con un diseño interactivo para el usuario y de facil uso.

Resultado de la encuesta

image image (1)

Prototipos no realistas

image

Prototipo de alta fidelidad

Al ver los resultados de la encuesta se realizaron cambios en el primer prototipo diseñado, dandole asi un enfoque a las sugerencia realizadas por los usuarios. image

4. Historias de Usuario

HU - 1

Yo como usuario quiero ver una pagina que me permita navegar por un menú que tenga la opción de conocer todos los Campeones y los objetivos del juego para saber mas sobre el mismo.

image

HU - 2

Yo como usuario quiero saber cuales son los objetivos del juego para entender la dinamica del mismo.

image

HU - 3

Yo como usuario quiero ver a los campeones por roles para conocer sobre ellos y definir mis estrategias de juego.

image

HU - 4

Yo como usuario quiero ver los campeones en orden alfabetico, para encontrarlos con mayor facilidad.

image

Itereración de prototipos

Para esta página constantemente se estuvo haciendo iteración de prototipos con los usuarios y debido a esto surgieron cambios en la página principal, uno de ellos fue el video que ya no ocupo la totalidad de la pantalla, adicionalmente el resumen se asigno a la misma página, el fondo de la página fue idea de un usuario. En lugar de hacer un vista con los campos de batalla, se hizo una con los objetivos del juego y de este manera fuimos llegando al resultado final.

5. Pruebas unitarias

Este proyecto tiene un criterio de aceptación minimo respecto a las pruebas unitarias las cuales deben dar una cobertura del 70% de statements(sentencias), functions (funciones), lines (líneas), y branches(ramas). De acuerdo con la siguiente imagen se cumple a cabalidad con esta pauta.

test

6. Tecnologias utilizadas 🛠️

  • HTML - Utilizado para la maquetación
  • CSS - Utilizado para el estilo
  • JAVASCRIPT - Usado para la interactividad
  • GitHub- Usado para el trabajo colaborativo

7. Autores ✒️

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 99.5%
  • Other 0.5%