-
Notifications
You must be signed in to change notification settings - Fork 0
Scrum Product Backlog: QuizzArenaUI (Frontend)
davidruizeJala edited this page May 25, 2026
·
1 revision
Proyecto: QuizzArenaUI Clasificación: Gestión de Producto / Metodología Ágil
Este documento desglosa el alcance funcional del MVP en Épicas e Historias de Usuario exclusivas del cliente Frontend (Angular), enfocándose en la interacción, el diseño y el consumo de la API.
- Descripción: Generar el proyecto base de Angular 17+ y configurar la estructura Feature-Driven.
- Definition of Done: Proyecto creado, enrutador base configurado y Tailwind CSS instalado.
- Descripción: Diseñar los mockups de alta fidelidad para las pantallas críticas y trasladarlos a componentes reutilizables usando Tailwind.
-
Definition of Done: Botones, inputs, tarjetas y paleta de colores implementados en
shared/ui.
- Descripción: Conectar el repositorio de GitHub con Vercel para despliegues automáticos (CI/CD).
-
Criterios de Aceptación:
- Pantalla de Login con un botón "Ingresar con Proveedor de Identidad".
- Al hacer clic, redirigir al portal del IdP (OIDC).
- A la vuelta, capturar el JWT, guardarlo de forma segura e inyectarlo en las peticiones subsecuentes mediante un HttpInterceptor.
- Redirigir al Dashboard del Instructor o del Estudiante según el claim de rol del JWT.
-
Criterios de Aceptación:
- El estudiante autenticado ve en su Dashboard una lista de partidas activas disponibles para su clase.
- Al seleccionar una partida, el sistema conecta automáticamente al Hub SignalR usando su JWT.
- Si la conexión falla, se muestra un toast de error descriptivo.
- Si es exitoso, redirigir al MatchLobbyPage.
-
Criterios de Aceptación:
- Lista de "Borradores de IA" pendientes de revisión.
- Formulario reactivo donde el profesor pueda editar el texto de la pregunta, editar o agregar distractores y marcar la opción correcta.
- Validación visual (borde rojo y mensaje) si no se marca una respuesta correcta o si hay menos de un distractor.
-
Criterios de Aceptación:
- Vista con tabla/lista de preguntas aprobadas.
- Checkboxes para seleccionar. Un contador fijo en pantalla indica cuántas se han seleccionado.
- Botón "Crear Partida" desactivado hasta seleccionar un mínimo de 5.
-
Criterios de Aceptación:
- Zona de Drag-and-Drop y botón de selección de archivos.
- El sistema acepta archivos
.pdf,.txt,.mp4y.mp3. - Indicador de progreso de subida.
-
Criterios de Aceptación:
- Lista de Jobs con estado visual (Spinner para
Processing, Check verde paraCompleted, Icono rojo paraFailed). - Suscripción a evento SignalR
TranscriptJobCompletedEventpara actualizar el estado sin recargar la página. - Si el Job falla, se muestra un mensaje de error con la opción de reintentar.
- Lista de Jobs con estado visual (Spinner para
-
Criterios de Aceptación:
- Vista del Profesor: Muestra el nombre de la partida y tarjetas con los nombres de los alumnos que van entrando.
- Vista del Estudiante: Muestra un spinner "Esperando a que el profesor inicie".
-
Criterios de Aceptación:
- Al recibir el evento de SignalR, la vista cambia instantáneamente mostrando la pregunta y opciones.
- Barra de progreso descendente conectada a un intervalo local (con fines cosméticos, no autoritativos).
-
Criterios de Aceptación:
- El alumno toca un botón de opción.
- Efecto visual (botón oscurecido/seleccionado) y bloqueo inmediato del resto de opciones para evitar doble submit.
-
Criterios de Aceptación:
- Vista animada para el profesor mostrando la barra de posiciones ordenadas.
- Animación fluida si alguien sube o baja de posición.
- Los alumnos ven un popup "Correcto" o "Incorrecto" con su puntaje obtenido en la ronda.
-
Criterios de Aceptación:
- Al recibir el evento de finalización, se muestra el podio final (Top 3) con animación.
- Estadísticas de la partida: porcentaje de acierto global y pregunta más difícil.
- El profesor ve un botón "Volver al Dashboard" para cerrar la sesión de juego.