Skip to content

dalejac/BOG001-card-validation

 
 

Repository files navigation

Tarjeta de crédito válida

Objetivos de aprendizaje:

UX

  • Diseñar la aplicación pensando y entendiendo al usuario
  • Crear prototipos para obtener feedback e iterar
  • Aplicar los principios de diseño visual

HTML y CSS

  • Uso correcto de HTML semántico
  • Uso de selectores de CSS
  • Construir tu aplicación respetando el diseño realizado (maquetación).

DOM

  • Uso de selectores de nodos del DOM
  • Manejo de eventos del DOM
  • Manipulación dinámica del DOM

Javascript

  • Manipulación de strings
  • Uso de condicionales
  • Uso de bucles
  • Uso de funciones
  • Datos atómicos y estructurados
  • Utilizar ES Modules (import | export).

Testing

Git y GitHub

  • Comandos de git (add | commit | pull | status | push).
  • Manejo de repositorios de GitHub (clone | fork | gh-pages).

Buenas prácticas de desarrollo

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

Definición del producto:

Cuál fue tu proceso para definir el producto final a nivel de experiencia y de interfaz: Creamos cada una un prototipo en papel, en el cual recibimos feedback de familiares y amigos. Luego realizamos un segundo prototipo en donde unificamos el feedback recibido. Posteriormente, recibimos feedback nuevamente de compañeras de Laboratoria y realizamos un tercer prototipo con los ajustes. El prototipo final fue elaborado en la plataforma Ninjamock.

  • Quiénes son los principales usuarios del producto. Aspirantes a la universidad que desean iniciar el proceso de inscripción.
  • Cuáles son los objetivos de estos usuarios en relación con tu producto. Realizar el pago de la inscripción a la universidad de manera online, rapida y segura.
  • Cómo crees que el producto que estás creando está resolviendo sus problemas. Agiliza el tramite bancario por medio de un proceso de pago online en una plataforma amigable. Evita iniciar trámites bancarios con números de tarjeta invalidas. Evita el uso de papel.

UX (Diseño de experiencia de usuario)

Antes de iniciar a codear, debes entender el problema que quieres solucionar y cómo tu aplicación lo soluciona.

Estos puntos los presentarás en el README.md.

Scripts / Archivos

Sketch1.jpeg Prototipo inicial Sketch1.2.jpeg Prototipo ajustado Scketch 2.png Prototipo final

General

  • Título: Monsters University

  • ¿De qué se trata?: Página de inscripción a Monsters University donde primero se valida el número de tarjeta para poder realizar el pago.

  • La imagen final de tu proyecto: Imagen del proyecto .png

  • Investigación UX: Ver sección de # Scripts / Archivos Feedback recibido indicando las mejoras a realizar: Debiamos dar un contexto a la página donde validariamos la tarjeta de crédito.

Releases

No releases published

Packages

No packages published

Languages

  • HTML 46.7%
  • JavaScript 40.9%
  • CSS 12.4%