Wireframes low-fi (Wave 3 UX)
Coleccion de doce wireframes de baja fidelidad en ASCII art que
representan las pantallas mas relevantes para el proyecto. Cada bloque
mantiene un ancho aproximado de 70 caracteres para encajar en el
formato carta retrato sin desbordar el code block. Cada wireframe
indica el archivo .tsx que lo materializa para garantizar trazabilidad
con el codigo.
Ultima actualizacion: 2026-05-05
1. Cliente - Home (lista de servicios)
Archivo: apps/mobile-client/app/(tabs)/home/index.tsx
+--------------------------------------------------------------------+
| ExpressMX [campana] [perfil] |
| Hola, Maria |
+--------------------------------------------------------------------+
| Direccion activa: Reforma 222, CDMX [cambiar] |
+--------------------------------------------------------------------+
| BANNER PROMOCIONAL |
| 20% en plomeria este fin de semana |
| [ver oferta] |
+--------------------------------------------------------------------+
| Categorias |
| ( hogar ) ( belleza ) ( autos ) ( tech ) ( mascotas ) |
+--------------------------------------------------------------------+
| Servicios cerca de ti |
| +----------------------+ +----------------------+ |
| | Limpieza profunda | | Plomeria urgente | |
| | desde $499 | | desde $350 | |
| | 4.8 estrellas | | 4.7 estrellas | |
| +----------------------+ +----------------------+ |
| +----------------------+ +----------------------+ |
| | Estilista a domicilio| | Reparacion celular | |
| | desde $299 | | desde $199 | |
| +----------------------+ +----------------------+ |
+--------------------------------------------------------------------+
| [ home ] [ servicios ] [ ordenes ] [ perfil ] |
+--------------------------------------------------------------------+
2. Cliente - Solicitar servicio (paso 3 stepper: notas)
Archivo: apps/mobile-client/app/service-request/index.tsx
+--------------------------------------------------------------------+
| <- Solicitar servicio |
| Limpieza profunda |
+--------------------------------------------------------------------+
| Paso 3 de 4 |
| [ x ]----[ x ]----[ # ]----[ ] |
| direc. horario notas pago |
+--------------------------------------------------------------------+
| Notas para el prestador |
| +----------------------------------------------------------------+ |
| | Departamento en piso 4 sin elevador. | |
| | Mascotas en casa: 1 perro pequeno. | |
| | Acceso por puerta lateral. | |
| | | |
| +----------------------------------------------------------------+ |
| 0 / 280 caracteres |
+--------------------------------------------------------------------+
| Adjuntar fotos (opcional) |
| [+ foto 1] [+ foto 2] [+ foto 3] |
+--------------------------------------------------------------------+
| Resumen |
| Servicio: Limpieza profunda 3hrs |
| Direccion: Reforma 222, CDMX |
| Cuando: hoy 16:00 |
| Total estimado: $749 MXN |
+--------------------------------------------------------------------+
| [ atras ] [ continuar a pago ] |
+--------------------------------------------------------------------+
3. Cliente - Tracking activo de orden
Archivo: apps/mobile-client/app/order-tracking/index.tsx
+--------------------------------------------------------------------+
| <- Orden #ORD-1284 |
| Estatus: prestador en camino |
+--------------------------------------------------------------------+
| |
| +-------------------------+ |
| | | |
| | MAPA EN VIVO | |
| | | |
| | [destino] [unidad] | |
| | | |
| +-------------------------+ |
| |
+--------------------------------------------------------------------+
| Llegada estimada: 12 min |
| Distancia: 2.4 km |
+--------------------------------------------------------------------+
| Prestador asignado |
| (avatar) Carlos R. 4.9 estrellas [llamar] [chat] |
| Honda Civic gris - XYZ-3210 |
+--------------------------------------------------------------------+
| Linea de tiempo |
| ( x ) Solicitud creada 16:00 |
| ( x ) Prestador asignado 16:02 |
| ( o ) En camino 16:05 <-- estado actual |
| ( ) Llego pendiente |
| ( ) Trabajo en sitio pendiente |
| ( ) Cerrada pendiente |
+--------------------------------------------------------------------+
| [ cancelar orden ] [ ver detalle ] |
+--------------------------------------------------------------------+
4. Cliente - Pago (mockup)
Archivo: apps/mobile-client/app/payment/index.tsx
+--------------------------------------------------------------------+
| <- Pagar |
| Orden #ORD-1284 |
+--------------------------------------------------------------------+
| Resumen |
| Servicio $599 |
| Sobrecosto autorizado $150 |
| Subtotal $749 |
| Impuestos $119.84 |
| Propina sugerida (10%) ( - 0 + ) |
| Total a pagar $868.84 |
+--------------------------------------------------------------------+
| Metodo de pago |
| ( o ) Tarjeta terminacion 4421 [predeterminada] |
| ( ) Tarjeta terminacion 0098 |
| ( ) Agregar nueva tarjeta |
+--------------------------------------------------------------------+
| Codigo promocional |
| [_______________________________] [ aplicar ] |
+--------------------------------------------------------------------+
| Notas legales |
| Al pagar aceptas los terminos del servicio. |
| El cobro se registra como ExpressMX MX |
+--------------------------------------------------------------------+
| [ cancelar ] [ pagar $868.84 ] |
+--------------------------------------------------------------------+
5. Prestador - Cola de jobs
Archivo: apps/mobile-provider/app/(tabs)/jobs/index.tsx
+--------------------------------------------------------------------+
| Trabajos disponibles [filtros] |
| Estado actual: [ x ] disponible para tomar trabajos |
+--------------------------------------------------------------------+
| Hoy 16 oct - 3 ofertas activas |
+--------------------------------------------------------------------+
| +----------------------------------------------------------------+ |
| | Limpieza profunda 3hrs PRIORIDAD ALTA | |
| | Reforma 222, CDMX | |
| | 2.4 km de tu ubicacion | |
| | Pago estimado: $599 Vence en: 00:11 | |
| | [ ver detalle ] | |
| +----------------------------------------------------------------+ |
| +----------------------------------------------------------------+ |
| | Plomeria correctiva | |
| | Polanco, CDMX | |
| | 5.1 km de tu ubicacion | |
| | Pago estimado: $420 Vence en: 00:08 | |
| | [ ver detalle ] | |
| +----------------------------------------------------------------+ |
| +----------------------------------------------------------------+ |
| | Electricidad - falla luminarias | |
| | Roma Norte, CDMX | |
| | 1.7 km de tu ubicacion | |
| | Pago estimado: $380 Vence en: 00:05 | |
| | [ ver detalle ] | |
| +----------------------------------------------------------------+ |
+--------------------------------------------------------------------+
| [ home ] [ jobs ] [ ingresos ] [ perfil ] |
+--------------------------------------------------------------------+
6. Prestador - Job activo (checklist 6 pasos)
Archivo: apps/mobile-provider/app/job-active/index.tsx
+--------------------------------------------------------------------+
| <- Trabajo activo - ORD-1284 |
| Cliente: Maria L. [navegar] |
+--------------------------------------------------------------------+
| Checklist |
+--------------------------------------------------------------------+
| ( x ) 1. En camino al sitio 16:05 |
| ( x ) 2. Validar PIN del cliente 16:18 |
| PIN ingresado correctamente |
| ( o ) 3. Foto antes de iniciar [ tomar foto ] |
| Sube al menos 1 evidencia |
| ( ) 4. Diagnostico y reparacion |
| [ registrar ] |
| ( ) 5. Foto despues de finalizar |
| ( ) 6. Cierre con PIN del prestador |
+--------------------------------------------------------------------+
| Sobrecosto si aplica |
| [ + capturar sobrecosto ] |
+--------------------------------------------------------------------+
| Tiempo en sitio: 13 min |
| [ pausar ] [ contactar soporte ] |
+--------------------------------------------------------------------+
7. Admin - Workspace operaciones (cola de ordenes)
Archivo: apps/web/src/app/dashboard/operaciones/page.tsx
+--------------------------------------------------------------------+
| ExpressMX > Operaciones [admin: c.lopez]|
+--------------------------------------------------------------------+
| Filtros: [ zona v ] [ servicio v ] [ estatus v ] [ buscar... ] |
+--------------------------------------------------------------------+
| Cola de ordenes [exportar] |
+--------------------------------------------------------------------+
| Folio | Cliente | Servicio | Estatus | Asignado | |
| ORD-1284 | Maria L. | Limpieza | en camino | C. Ruiz | |
| ORD-1283 | Jorge P. | Plomeria | pendiente | sin asig. | |
| ORD-1282 | Diana S. | Estilista | en sitio | A. Mora | |
| ORD-1281 | Luis G. | Electricidad | cerrada | B. Diaz | |
| ORD-1280 | Eva R. | Limpieza | cancelada | - | |
| ORD-1279 | Carlos H. | Tech | en sitio | M. Gonz. | |
+--------------------------------------------------------------------+
| Mostrando 6 de 1284 |
| [ < anterior ] pagina 1 de 215 [ siguiente > ] |
+--------------------------------------------------------------------+
| Sidebar contexto |
| KPIs hoy: |
| - Ordenes activas: 412 |
| - Tiempo medio asignacion: 2.4 min |
| - SLA cumplido: 96.3% |
| - Cancelaciones: 14 (3.2%) |
+--------------------------------------------------------------------+
8. Admin - Detalle de orden con asignacion
Archivo: apps/web/src/app/dashboard/operaciones/orden/[id]/page.tsx
+--------------------------------------------------------------------+
| < volver | ORD-1283 Plomeria correctiva Estatus: pendiente |
+--------------------------------------------------------------------+
| Cliente | Direccion | Programado |
| Jorge Perez | Polanco, CDMX 11560 | hoy 17:30 |
| 5512345678 | piso 4 sin elevador | duracion 90 min |
+--------------------------------------------------------------------+
| Notas del cliente |
| "Fuga en grifo de cocina, ya cerre la llave principal." |
+--------------------------------------------------------------------+
| Asignacion |
| Sugerencia automatica: A. Mora (1.2 km, 4.8) [ asignar ] |
| |
| Asignar manual: |
| [ buscar prestador... ] |
| - C. Ruiz 2.0 km 4.9 disponible [ asignar ] |
| - B. Diaz 3.4 km 4.7 ocupado - |
| - M. Gonz. 4.1 km 4.6 disponible [ asignar ] |
+--------------------------------------------------------------------+
| Linea de tiempo |
| 17:08 Orden creada por cliente |
| 17:08 Asignacion automatica intentada (sin prestador disponible) |
| 17:09 Pendiente de asignacion manual |
+--------------------------------------------------------------------+
| Acciones |
| [ cancelar orden ] [ contactar cliente ] [ escalar a soporte ] |
+--------------------------------------------------------------------+
9. Soporte - Workspace soporte (cola tickets con SLA)
Archivo: apps/web/src/app/dashboard/soporte/page.tsx
+--------------------------------------------------------------------+
| ExpressMX > Soporte [agent: m.guzman] |
+--------------------------------------------------------------------+
| Pestanas: [ mis tickets ] [ cola general ] [ MIM ] [ KB ] |
+--------------------------------------------------------------------+
| Filtros: [ severidad v ] [ canal v ] [ SLA v ] [ buscar... ] |
+--------------------------------------------------------------------+
| Cola de tickets - L1 |
+--------------------------------------------------------------------+
| ID | Asunto | Severidad | SLA restante | Asignado | |
| T-901| pago duplicado | alta | 00:14:32 | yo | |
| T-900| no llega prestador | alta | 00:08:11 !! | yo | |
| T-899| codigo promo invalido | media | 02:31:00 | - | |
| T-898| factura erronea | media | 01:14:00 | - | |
| T-897| evidencia incompleta | baja | 04:00:00 | - | |
| T-896| consulta general | baja | 03:45:00 | - | |
+--------------------------------------------------------------------+
| Sidebar contexto |
| - Tickets abiertos: 38 |
| - SLA en riesgo: 3 |
| - Mis pendientes: 6 |
| - KB visitados hoy: 14 |
+--------------------------------------------------------------------+
10. Soporte - Detalle ticket con escalacion L1 a L2
Archivo: apps/web/src/app/dashboard/soporte/ticket/[id]/page.tsx
+--------------------------------------------------------------------+
| < volver | T-900 No llega prestador Severidad: alta |
| SLA restante: 00:08:11 !! |
+--------------------------------------------------------------------+
| Cliente: Maria L. [acceder a perfil cliente con PIN] |
| Orden vinculada: ORD-1284 |
+--------------------------------------------------------------------+
| Conversacion |
| Maria L. 16:42 |
| Mi prestador no llega y la app dice que esta en camino. |
| m.guzman 16:43 |
| Hola Maria, lamento la espera. Estoy revisando. |
| (sistema) 16:44 |
| Geolocalizacion del prestador detenida hace 8 min. |
+--------------------------------------------------------------------+
| Escribir respuesta |
| +----------------------------------------------------------------+ |
| | Plantilla: [ seleccionar v ] | |
| | | |
| +----------------------------------------------------------------+ |
| [ enviar ] [ adjuntar ] [ macros ] |
+--------------------------------------------------------------------+
| Acciones |
| [ reasignar prestador ] [ otorgar credito ] |
| [ escalar a L2 (operaciones) ] [ escalar a L2 (finanzas) ] |
+--------------------------------------------------------------------+
| Linea de tiempo |
| 16:42 ticket abierto canal: app |
| 16:43 asignado a m.guzman |
| 16:45 acceso a perfil cliente solicitado (motivo: investigar) |
+--------------------------------------------------------------------+
11. Finanzas - Workspace finanzas (cortes)
Archivo: apps/web/src/app/dashboard/finanzas/page.tsx
+--------------------------------------------------------------------+
| ExpressMX > Finanzas [admin: r.castro] |
+--------------------------------------------------------------------+
| Pestanas: [ cortes ] [ facturas ] [ pagos ] [ reembolsos ] |
+--------------------------------------------------------------------+
| Cortes recientes [generar corte] |
+--------------------------------------------------------------------+
| Periodo | Estado | Monto | Prestadores | acc.| |
| 16-30 abr 2026 | en revision | $1,284,500 | 412 | ver | |
| 01-15 abr 2026 | depositado | $1,118,290 | 401 | ver | |
| 16-31 mar 2026 | depositado | $1,090,110 | 388 | ver | |
| 01-15 mar 2026 | depositado | $980,420 | 372 | ver | |
+--------------------------------------------------------------------+
| Sidebar contexto |
| Periodo abierto: 01-15 may 2026 |
| Comisiones generadas: $322,481 |
| Pagos pendientes hoy: 14 |
| CFDI emitidos en el mes: 3,402 |
+--------------------------------------------------------------------+
| Acciones rapidas |
| [ subir conciliacion bancaria ] [ exportar reporte mensual ] |
+--------------------------------------------------------------------+
12. Compliance - Logs de auditoria con filtros
Archivo: apps/web/src/app/dashboard/auditoria/page.tsx
+--------------------------------------------------------------------+
| ExpressMX > Compliance > Auditoria [admin: e.salgado] |
+--------------------------------------------------------------------+
| Filtros |
| Actor: [ buscar... ] Tipo: [ todos v ] |
| Modulo: [ todos v ] Severidad: [ todas v ] |
| Fecha de: [ 2026-04-01 ] a: [ 2026-05-05 ] |
| [ aplicar ] [ limpiar ] [ exportar CSV ] |
+--------------------------------------------------------------------+
| Resultados (1248 eventos) |
+--------------------------------------------------------------------+
| Fecha | Actor | Accion | Recurso | |
| 2026-05-05 12:31 | m.guzman | acceso PII (PIN) | cliente 4231 | |
| 2026-05-05 11:48 | r.castro | exportar corte | corte 218 | |
| 2026-05-05 10:22 | c.lopez | reasignar orden | ORD-1271 | |
| 2026-05-05 09:18 | superadmin | crear rol | rol soporte2 | |
| 2026-05-05 08:54 | n.flores | aprobar documento | inv 109 | |
| 2026-05-04 22:07 | sistema | rotacion de llaves | KMS-prod | |
+--------------------------------------------------------------------+
| [ < anterior ] pagina 1 de 209 [ siguiente > ] |
+--------------------------------------------------------------------+
| Detalle del evento seleccionado |
| Hash: 9af3-2e10-... |
| IP: 189.220.45.12 |
| Cambios: { rol_anterior: null, rol_nuevo: 'soporte2' } |
+--------------------------------------------------------------------+
Convenciones aplicadas
- ASCII art monocromo, sin emojis ni iconografia decorativa.
- Ancho aproximado 70 caracteres para encajar en code block markdown formato carta retrato.
- Cada wireframe nombra el archivo
.tsxque lo materializa. - Region por region: cabecera, filtros, contenido, sidebar contexto, acciones secundarias.