Skip to content

Diseñar e implementar la vista de creación de mazos #28

@jgm847

Description

@jgm847

📄 Descripción

Se debe diseñar e implementar la funcionalidad de creación de mazos en MagicVS, permitiendo a los usuarios construir sus propios mazos de Magic: The Gathering a partir del catálogo de cartas disponible en la aplicación.

Esta funcionalidad incluirá tanto el diseño de la interfaz como su implementación en frontend y backend, de forma que el usuario pueda buscar cartas, añadirlas o quitarlas del mazo, visualizar su composición y guardar el resultado final.

La vista debe estar orientada a una experiencia clara, rápida e intuitiva, ya que será una de las funcionalidades principales de la aplicación.


🎯 Objetivos

  • Diseñar la interfaz de creación de mazos
  • Implementar la vista de deck builder en frontend
  • Permitir añadir y eliminar cartas del mazo
  • Mostrar la composición actual del mazo en tiempo real
  • Validar restricciones básicas del mazo
  • Guardar mazos creados por un usuario en backend

🛠️ Alcance

Incluye:

  • Diseño visual y funcional de la vista de creación de mazos
  • Implementación de la pantalla en frontend
  • Integración con backend para guardar mazos
  • Búsqueda y selección de cartas desde el catálogo
  • Visualización de la lista de cartas del mazo
  • Validaciones básicas del deck builder

No incluye:

  • Edición avanzada de mazos ya existentes
  • Importación/exportación de mazos
  • Recomendaciones automáticas de cartas
  • Sincronización en tiempo real entre usuarios
  • Validaciones competitivas avanzadas de todos los formatos

🛠️ Tareas

Diseño

  • Definir la estructura general de la vista de creación de mazos
  • Diseñar la distribución entre buscador de cartas y mazo actual
  • Diseñar la representación visual de cada carta seleccionada
  • Diseñar la visualización de estadísticas del mazo
  • Diseñar estados de error, validación y guardado
  • Revisar consistencia con el resto de la aplicación

Backend

  • Crear DTOs para creación y respuesta de mazos
  • Implementar servicio para creación de mazos
  • Implementar lógica para asociar el mazo al usuario
  • Implementar lógica para guardar cartas y cantidades del mazo
  • Crear endpoint para guardar un nuevo mazo
  • Validar restricciones básicas del mazo en backend
  • Preparar estructura para futuras ediciones de mazo

Frontend

  • Crear vista principal del deck builder
  • Implementar buscador de cartas
  • Mostrar resultados del catálogo dentro de la vista
  • Permitir añadir cartas al mazo
  • Permitir eliminar cartas del mazo
  • Permitir modificar cantidades
  • Mostrar recuento total de cartas
  • Mostrar distribución básica del mazo
  • Implementar acción de guardar mazo
  • Gestionar estados de carga, error y éxito

📂 Estructura funcional esperada

La vista debería dividirse en dos áreas principales:

🔍 Exploración y búsqueda de cartas

  • buscador por nombre
  • filtros básicos
  • listado de cartas disponibles
  • acción para añadir carta al mazo

🃏 Composición del mazo

  • nombre del mazo
  • formato
  • listado de cartas seleccionadas
  • cantidad por carta
  • recuento total
  • estadísticas básicas
  • botón de guardar

📐 Información y validaciones a contemplar

Datos del mazo

  • nombre del mazo
  • formato
  • usuario propietario

Restricciones básicas

  • máximo 4 copias por carta, salvo excepciones futuras
  • mínimo de 60 cartas para mazo principal
  • validación de campos obligatorios
  • evitar guardar mazos vacíos

Estadísticas visuales recomendadas

  • número total de cartas
  • curva de maná básica
  • distribución por tipo
  • distribución por color

✅ Criterios de aceptación

  • Existe un diseño claro de la vista de creación de mazos
  • El usuario puede buscar cartas dentro de la vista
  • El usuario puede añadir y eliminar cartas del mazo
  • El usuario puede ver el mazo en construcción en tiempo real
  • El sistema valida restricciones básicas antes de guardar
  • El mazo se guarda correctamente asociado al usuario
  • La vista mantiene consistencia con el resto de la aplicación

📌 Notas

  • Se recomienda separar claramente la vista de búsqueda del panel de mazo actual
  • El guardado debe apoyarse en DTOs, no en entidades expuestas directamente
  • Se recomienda que la UI esté preparada para soportar futura edición de mazos
  • Esta funcionalidad será una de las piezas centrales de la aplicación, por lo que debe priorizarse la usabilidad

Metadata

Metadata

Assignees

Labels

No labels
No labels

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions