Skip to content

Desarrollé una página web para validar números de tarjetas de crédito, simulando su uso dentro de un proceso de pago en un videojuego 🎮

Notifications You must be signed in to change notification settings

tolozayurany/GamingHub

 
 

Repository files navigation

Valida tu tarjeta - Videojuegos GAME-HUB

Desarrollado por Yurany Albarracin Toloza (Yury)

Resumen del proyecto

En este proyecto desarrollé una herramienta para validar tarjetas de crédito, esto con la finalidad de que los usuarios al realizar una compra por internet puedan conocer si el número de su tarjeta es válida o no.

Investigación UX

Los usuarios

  • Los usuarios definidos para este producto son aquellas personas que se dedican a jugar videojuegos y requieren validar sus tarjetas de crédito para hacer compras dentro del juego con el fin de de adquirir mejoras para aumentar su rendimiento dentro del ambiente de juego (Compra de skins, pases de batalla, personajes de juegos, paquetes de juego).

  • Nuestro arquetipo es un joven llamado Jaime que tiene 22 años y le encanta la industria de los videojuegos, su principal interés es ser de los mejores de su grupo de amigos e ir mejorando su nivel dentro del videojuego, por lo general aprovecha ofertas de temporada ofrecidas por las páginas de los videojuegos para realizar compras y adquirir mejoras. Valora grandemente la rápidez y funcionalidad de las herramientas que usa, así como la seguridad de la información que suministra en internet.

La solución

Este producto permite a nuestros usuarios hacer la correcta validación de su tarjeta de crédito para poder continuar con el proceso de compra de los productos que desea dentro de la plataforma de su videojuego, es una herramienta sencilla de utilizar que permite realizar la acción de la validación con rápidez, lo que permite al usuario aprovechar fácilmente las ofertas que ofrece su videojuego favorito.

Wireframes

En estos prototipos de baja fidelidad, se muestran las pantallas propuestas para mostrar a los usuarios y solicitar feedback.

Feedback de nuestros usuarios

  • Como primera medida se plantearon dos pantallas, donde en la primera se ingresa el número de la tarjeta y se continúa a la siguiente donde se ejecuta la función de validar el número de la tarjeta. El usuario mencionó que le parecía una buena opción pues se evidencia con claridad donde debe escribirse el número.

  • En la segunda pantalla también se mencionó la importancia de un botón que permitiera volver a validar una nueva tarjeta, si el usuario quisiera validar otra tarjeta tendría que volver a recargar la página o volver atrás.

  • Finalmente agregaron que para tener claro donde poner los numeros a ingresar sería ideal tener una imagen o una guía donde se viera el espacio donde van los números de una tarjeta común, o si no era posible poner un mensaje donde se indicara qué dato que se solicitaba.

Prototipo final

A continuación se pueden observar las pantallas del prototipo realizado después del feedback hecho por nuestros usuarios, donde se tomaron en cuenta sus consideraciones.

Pantallas de prototipo en Figma

Pantallas finales del proyecto

Valida tu tarjeta GAMING-HUB

Pruebas unitarias

El resultado de las pruebas realizadas muestra un 100% de coverage en la funcionalidad.

About

Desarrollé una página web para validar números de tarjetas de crédito, simulando su uso dentro de un proceso de pago en un videojuego 🎮

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 48.7%
  • CSS 29.6%
  • HTML 21.7%