Prototipo de Hackathon Oficial · Reto Banorte × Hack Monterrey 2026

Evoluciona a Maya de Banorte de un chatbot conversacional pasivo a un motor generador de interfaces táctiles reactivas con ciclo de acción cerrado y persistencia en PostgreSQL. Todos los datos de demostración son sintéticos y se ejecutan en local.

Métricas y Rigor de Ingeniería

Arquitectura desacoplada, verificada contra la especificación formal y probada con base de datos real.

MOTOR PROPIO A2UI v0.9.1spec/ oficial

76 de 76 Casos de Conformidad Pasados al 100%

Desarrollamos un motor A2UI nativo en ~1,310 líneas de TypeScript sin intermediarios ni dependencias opacas. Valida JSON Schemas en caliente mediante ajv, sincroniza el Data Model y garantiza superficies tolerantes a fallos con Error Boundaries granulares.

100%

Conformidad Oficial

76 tests en packages/a2ui

Servidor MCP Streamable HTTP

18 Tools Propias en TypeScript

14 de lectura analítica profunda y 4 mutacionales sobre PostgreSQL con control de concurrencia y registro auditado en banorte.registros.

14 lectura + 4 mutación103 pruebas unitarias

Catálogo de Interfaces

21 Widgets Financieros Banorte

Diseñados con primitivas shadcn/ui y tokens oficiales Banorte. Validados con Zod y Ajv para evitar renderizados rotos o props incompletas.

Tipado estricto en ZodTáctil & Accesible

Cero Alucinación Numérica: Principio de Arquitectura No Negociable

El LLM nunca sintetiza saldos, tasas de interés ni plazos en texto plano. Todos los valores numéricos provienen del Data Model poblado por PostgreSQL (22 tablas).

Ver ADR 0008

---

Simulación Interactiva del Guión de Demo

Recorre paso a paso la secuencia en vivo de 3 minutos ejecutada con modelo real y PostgreSQL.

Simulador del Guión de Demo en Vivo

Reproduce paso a paso los 3 minutos de corrida verificada en producción.

1234

LLM→

MCP(panorama_inicial · simular_reestructura)

→A2UI v0.9.1

10.5 s (medido con modelo real)

Perfil & Entrada del Usuario

👤 Beto (Supervisor de logística, tarjeta al 96.7%, 12 días de mora)

"Quiero pagar menos intereses de mi tarjeta"

Lógica del Agente & MCP

El agente interpreta la urgencia de deuda revolvente con mora, consulta el MCP y emite A2UI con opciones concretas de reestructura en vez de redactar texto.

💡 Cero pantallas programadas. El LLM compone la vista usando el catálogo registrado y restringe el uso a componentes oficiales.

Componentes del Catálogo Emitidos

ResumenTarjeta (Héroe)PlanDePago (12, 18, 24 meses)BotonAccion

Superficie A2UI Renderizada en Tiempo Real

Banorte Clásica •••• 4821

12 DÍAS DE ATRASO

Saldo total a pagar

$47,386.00

Límite de crédito

$49,000.00 (96.7% uso)

Tasa anual: 48.9% · Pago mínimo: $2,950.73 (solo intereses)

Alternativas de Reestructura a Tasa Preferencial (22.5%)

12 meses

$4,640.10

Ahorras $8,240

RECOMENDADO

18 meses

$3,193.35

Ahorras $14,650

24 meses

$2,510.40

Ahorras $11,100

Aplicar plan a 18 meses

← Paso anteriorPaso 1 de 4Siguiente paso →

---

Arquitectura del Sistema en 4 Capas

Inspecciona la interacción entre el Host Next.js, Servidor MCP, Motor A2UI y la base de datos PostgreSQL.

Explorador Interactivo de Arquitectura

Haz clic en cada componente para inspeccionar sus responsabilidades, código fuente, contratos y pruebas.

Usuario y Superficie

Agente / LLM Host

Servidor MCP Propio

Motor A2UI v0.9.1 Propio

Catálogo de Componentes

PostgreSQL (Esquema Banorte)

CAPA ACTIVA

2. Agente / LLM Host

Orquestación de intenciones, llamadas a tools MCP y emisión de A2UI v0.9.1

apps/web/src/lib/agente/

✓ ~1,240 líneas TS✓ Gemini 3.8 Flash (principal)✓ Claude Sonnet 3.5 (respaldo)

Responsabilidades Clave

• Interpretación de intención según el perfil activo (Beto, Ana, Carmen).
• Llamadas autónomas a tools del MCP antes de proponer cualquier interfaz.
• Emisión de mensajes A2UI (createSurface, updateComponents, updateDataModel) validados.
• Recepción de acciones de la interfaz para cerrar el ciclo de ejecución.

CONTRATO:POST /api/agente (Stream JSONL: estado, tool, a2ui, texto, razon, fin)

El modelo nunca inventa cifras financieras: todas provienen del data model poblado por el MCP.

---

Exploración de la Documentación

Guías completas, especificaciones técnicas y material de evaluación estructurado por rol de lectura.

5 MINUTOS

Para Jueces y Evaluadores

Presentación Ejecutiva & Pitch

Guión cronometrado de 5 minutos, diapositivas interactivas en vivo y la matriz oficial de rúbrica calificada punto a punto.

Pitch · Guión · Rúbrica 100 ptsAbrir

ESTRATEGIA

Para Negocio e Innovación

El Reto Banorte

Contexto oficial del hackathon, objetivos de transformación de Maya y demostración de adaptabilidad con perfiles contrastantes.

Entregables · Rúbrica · PerfilesAbrir

SISTEMA

Para Arquitectos & Tech Leads

Arquitectura Técnica & ADRs

Detalle a fondo del motor A2UI propio, servidor MCP Streamable HTTP, esquema relacional PostgreSQL y los 10 ADRs de diseño.

A2UI · MCP Server · PostgreSQLAbrir

UI / UX

Para Diseñadores & Frontend

Catálogo de Componentes A2UI

21 widgets interactivos financieros con tokens Banorte, esquemas Zod, eventos táctiles y garantías de renderizado sin alucinaciones.

21 Componentes · Zod · ShadcnAbrir