Prueba de Nivel

UX/UI Senior Designer

A continuación se detallan las dos entregas que forman parte de la prueba técnica para evaluar tus habilidades analíticas, de arquitectura de la información y de diseño de interfaces.

1. Interpretación de PRDs y propuesta de wireframes

Lee detenidamente el siguiente documento de requerimientos de producto (PRD) y elabora una propuesta de wireframes que dé solución a las necesidades planteadas para el nuevo módulo de cursos.

PRD: Módulo de Cursos (premiumpay)

1. Contexto y Objetivo

El objetivo de esta iniciativa es expandir las capacidades de monetización de los creadores en la plataforma premiumpay mediante la incorporación de video-cursos.

En esta fase inicial (MVP), el foco está en construir el flujo principal:

  • Un panel de control (dashboard) para listar, editar y publicar los cursos.
  • Un creador de cursos (wizard) simplificado en 2 pasos.
  • Estructuración del contenido basada en módulos y lecciones en vídeo.
  • Métricas de rendimiento a nivel básico (dejando la analítica avanzada para iteraciones futuras).

2. Alcance (Scope)

✅ Dentro del MVP

  • Dashboard de Cursos: Listado general para el creador con estados (Published, Draft, Unpublished).
  • Métricas Globales: Tarjetas superiores con datos totales (Sales, Revenue, Views).
  • Gestión del Curso: Acciones de edición, publicación y deshabilitación.
  • Wizard de Creación (2 pasos): Configuración básica + Estructura de contenido (módulos y lecciones).

❌ Fuera del alcance (No-goals en esta fase)

  • Evaluaciones de alumnos (quizzes, tareas, assignments).
  • Funcionalidad de "Ver Demo" o lecciones gratuitas de prueba.
  • Recursos descargables adjuntos a las lecciones (PDFs, links extra).
  • Métrica de "Conversion Rate" en el dashboard.
  • Analítica avanzada (análisis de cohortes, embudos de conversión, etc.).

3. Usuarios y Permisos

  • Creador (Owner): Tiene permisos completos sobre su propio contenido. Puede ver, crear, editar, publicar y despublicar sus cursos.
  • Admin: Rol interno de plataforma con acceso para soporte y operaciones (permisos específicos a definir por el equipo de operaciones).

4. Ciclo de Vida del Curso (Estados)

  • Draft (Borrador): El curso es editable, no es visible para los compradores y no se puede vender.
  • Published (Publicado): El curso es visible y vendible al público.
  • Unpublished (Desactivado): El curso deja de ser visible y vendible. Sigue siendo editable por el creador y puede volver a publicarse.

Transiciones permitidas:

  • Draft → Published (Acción: Publish)
  • Published → Unpublished (Acción: Unpublish/Disable)
  • Unpublished → Published (Acción: Republish)

5. Interfaz de Usuario (UX/UI) - Dashboard de Cursos

La interfaz debe seguir una estructura tipo dashboard, optimizada para la usabilidad del creador en premiumpay.

Cabecera (Header)

  • Título de la sección: "Cursos".
  • CTA Principal (arriba a la derecha): + Create Course.

Sección de Perfil del Creador (Vista Previa)

  • Un bloque editable que muestre cómo verá el usuario final al creador: Imagen de portada, imagen de perfil, descripción y botón de compartir.

Tarjetas de Métricas Globales (Top Cards)

Muestran el total histórico ("All time") sin filtros complejos.

  • Total Sales: Número total de ventas de cursos.
  • Total Revenue: Ingresos totales generados por los cursos.
  • Total Views: Visualizaciones totales.

Navegación y Listado (Tabla)

  • Tabs de estado: Published | Draft | Unpublished.
  • Buscador: Búsqueda por título del curso.
  • (Nice-to-have) Filtros de orden: Ordenar por revenue, sales, views o fecha.
  • Columnas de la tabla:
    • Course: Miniatura (portada) + Título.
    • Price: Precio base.
    • Sales: Número de ventas (Nota: El número debe ser un enlace que lleve a la vista de "Transacciones" generales de la plataforma, filtrada por este curso).
    • Revenue: Ingresos generados.
    • Views: Número de visualizaciones.
    • Actions: Menú desplegable (Edit / Publish / Unpublish / Republish).

6. Flujo de Creación: Wizard en 2 Pasos

Paso 1: Información y Monetización
(Nota técnica: La lógica de pagos, suscripciones, descuentos y precios por país reutilizará el motor actual de premiumpay).

  • Title (Obligatorio)
  • Description (Obligatorio)
  • Cover: Imagen o vídeo de portada (Obligatorio)
  • Payment Type: Pago único (Lifetime) o Suscripción (Obligatorio)
  • Discounts: Configuración de cupones, % o monto fijo (Opcional)
  • Pricing by Country: Configuración de precios regionalizados (Obligatorio)

Paso 2: Contenido (Módulos y Lecciones)

  • Módulo: Requiere un Nombre/Título (Obligatorio).
  • Lección (dentro del módulo):
    • Title (Obligatorio).
    • Video (Obligatorio).
    • Description (A definir en diseño si es opcional u obligatorio).

7. Reglas de Publicación y Edición

  • Modo Draft / Unpublished: Edición totalmente libre en ambos pasos del wizard.
  • Modo Published: La edición está permitida, pero la interfaz debe advertir sobre cambios sensibles (como modificar el precio o el modelo de suscripción si ya hay alumnos activos).
  • Validación para el evento "Publish": El sistema debe bloquear la publicación y mostrar un checklist de errores si no se cumple lo siguiente:
    • Al menos 1 módulo creado.
    • Cada módulo tiene al menos 1 lección.
    • Cada lección tiene un vídeo asignado/subido de forma exitosa.
    • El precio está completamente configurado en el Paso 1.

8. Definición de Métricas

  • Sales: Suma de compras de pago único exitosas + número de altas de suscripción exitosas.
  • Revenue: Dinero neto/bruto (a definir con el equipo financiero) asociado directamente a las ventas del curso.
  • Views: Visualizaciones totales de la landing page (página de venta) del curso.

9. Criterios de Aceptación (DoD)

  • Dashboard: El creador puede acceder a la sección "Cursos", ver las 3 métricas globales (Sales, Revenue, Views) y visualizar sus cursos divididos en pestañas (Published, Draft, Unpublished).
  • Tabla: La lista de cursos muestra correctamente portada, título, precio, ventas, ingresos, vistas y un menú de acciones.
  • Navegación: Hacer clic en la métrica "Sales" de un curso redirige correctamente a la vista general de Transacciones, aplicando el filtro de dicho curso.
  • Flujo de Estados: Es posible editar y publicar un Draft; despublicar un curso activo (pasando a Unpublished); y republicar un curso desactivado.
  • Creación (Paso 1): El sistema guarda correctamente la metadata del curso y se integra con el sistema de precios por país y descuentos de la plataforma.
  • Creación (Paso 2): El sistema permite crear una estructura jerárquica de módulos y lecciones, y permite la subida/asignación de vídeos.
  • Validación de Publicación: No es posible publicar un curso vacío, sin precio, sin portada, o con lecciones que no tengan un vídeo cargado.

2. Heatmap, mejoras y puntos de fuga de pasarela de pago

A continuación se presenta un mockup de la vista actual de la pasarela de pago móvil. Tu tarea consiste en analizar esta interfaz, proponer mejoras de usabilidad e identificar los posibles puntos de fuga basándote en un análisis heurístico y de flujos de conversión.

Mockup Pasarela de Pago