Wubba Lubba Dub Dub!

(Ahora en Github Pages: https://dianax69.github.io/CDMX009-Data-Lovers/src/)

¿Y quién no quiere saber todo de sus personajes favoritos de la serie que sigue en su momento? Wubba Luba Dub Dub es el web site ideal para saber todo dato interesante de los 493 personajes que han pasado por esta serie. En este multiverso tenemos todos los personajes de las primeras 3 temporadas de Rick and Morty, aqui encontrarás toda información interesante como su género, especie, origen y los capitulos donde hacen aparición.

Investigación de usuario

Usuario final

Fans y no tan fans de la aclamada serie Rick and Morty, los espectadores rondan entre los 18 y 34 años de edad.

Resolución de problema

Pruebas de diseño UX

sketches

Feedback en Distribución de la información y organización: -Mejorar como se usa en dispositivos ya que algunos pasos resultan confusos. -Es entendible en desktop. -Colores alusivos a la serie. -Mostrar menos personajes.

Wireframe

Prototipo

Historias de usuario

3. Objetivos de aprendizaje

UX

Di Iris

• [x] Diseñar la aplicación pensando y entendiendo al usuario.
• [x] Crear prototipos para obtener feedback e iterar.
• [x] Aplicar los principios de diseño visual (contraste, alineación, jerarquía).
• [ ] Planear y ejecutar tests de usabilidad.

HTML y CSS

• [x] Entender y reconocer por qué es importante el HTML semántico.
• [x] Identificar y entender tipos de selectores en CSS.
• [x] Entender como funciona flexbox en CSS.
• [x] Construir tu aplicación respetando el diseño planeado (maquetación).

DOM

• [x] Entender y reconocer los selectores del DOM (querySelector | querySelectorAll).
• [x] Manejar eventos del DOM. (addEventListener)
• [x] Manipular dinámicamente el DOM. (createElement, appendchild, innerHTML, value)

Javascript

• [x] Manipular arrays (filter | map | sort | reduce).
• [x] Manipular objects (key | value).
• [ ] Entender el uso de condicionales (if-else | switch).
• [ ] Entender el uso de bucles (for | forEach).
• [x] Entender la diferencia entre expression y statements.
• [x] Utilizar funciones (parámetros | argumentos | valor de retorno).
• [ ] Entender la diferencia entre tipos de datos atómicos y estructurados.
• [x] Utilizar ES Modules (import | export).

Pruebas Unitarias (testing)

• [ ] Testear funciones (funciones puras).

Git y GitHub

• [x] Ejecutar comandos de git (add | commit | pull | status | push).
• [x] Utilizar los repositorios de GitHub (clone | fork | gh-pages).
• [ ] Colaborar en Github (pull requests).

Buenas prácticas de desarrollo

• [x] Organizar y dividir el código en módulos (Modularización).
• [x] Utilizar identificadores descriptivos (Nomenclatura | Semántica).
• [ ] Utilizar linter para seguir buenas prácticas (ESLINT).