Proyect Banorte KANAN - by Fine Sheets

landing
login
inicio
movimientos
cuentas
plan del mes
asistente maya
chat puntos por tarjeta
chat coach

Inspiration

El reto lo dice en una línea: que el modelo no solo conteste, sino que arme la pantalla que resuelve el problema financiero de quien pregunta. Hoy el asistente de un banco responde con un muro de texto, la misma pantalla para cualquier intención, y para actuar la persona se va a otra app. Queríamos lo contrario: una experiencia donde preguntas "¿cómo voy a cerrar el mes?" y la interfaz que aparece es la proyección, la gráfica y el botón para aportar a tu meta — y donde tocar esa interfaz vuelve al agente como contexto y cambia lo que sigue.

What it does

KANAN es banca personal con Maya, un asistente que construye la interfaz según la intención:

Entiende y orquesta. Gemini 3.1 Flash-Lite interpreta la pregunta, decide qué herramientas llamar y qué bloques de interfaz mostrar (gráfica, tabla, formulario, proyección, semáforo de presupuestos, puntos, sugerencias).
20 herramientas MCP propias. Saldo, movimientos, categorías, comparación de periodos, metas, simulador de ahorro, proyección de cierre de mes, presupuestos, cargos fijos, salud financiera 0–100, sugerencias del coach, puntos por tarjeta y búsqueda documental (RAG sobre los folletos reales de Banorte). 17 son de lectura; las 3 de escritura solo se habilitan tras una confirmación explícita.
La interfaz viaja como A2UI v0.9.1, no como HTML: catálogo propio de 20 componentes Banorte validados con Zod y JSON Schema. Un componente ajeno al catálogo se rechaza.
El ciclo se cierra. Tocar una categoría de la gráfica trae sus movimientos; cambiar el periodo recalcula por MCP sin volver a llamar al modelo; el chip "Aportar $4,100 a Fondo de emergencia" abre una confirmación, y al confirmar la meta avanza de verdad (idempotente: reintentar no duplica).
Dos modos estructurales. Coach recibe la herramienta de sugerencias y cierra cada respuesta con un siguiente paso; Analista no la tiene en su token, así que no puede sugerir aunque el prompt lo intente. Con voz (dictado) y citas con página y vigencia cuando la respuesta sale de un documento.
Plan del mes, Metas, Movimientos y Cuentas como pantallas propias, alimentadas por los mismos datos que usa Maya.

How we built it

Backend: NestJS modular + Prisma + PostgreSQL (pgvector para el RAG). Sesiones con Argon2id, cookie HttpOnly y CSRF; idempotencia por Idempotency-Key; acciones pendientes con confirmar/cancelar y expiración.
MCP: servidor propio por stdio (SDK oficial) lanzado por Nest. Cada turno emite una capacidad opaca de 2 minutos con la lista exacta de herramientas permitidas; el gateway interno la valida antes de tocar datos. El modelo nunca ve la llave ni la base de datos.
LLM: Gemini vía @google/genai. El modelo produce un plan JSON (herramientas + bloques); el servidor ejecuta, valida y compone los mensajes A2UI (createSurface → updateComponents → updateDataModel) que viajan por SSE.
Frontend: React con un renderer A2UI y catálogo de componentes propios; tipografía y colores según la guía de estilo Banorte.

Challenges we ran into

Un modelo con 503 por alta demanda a media noche, un puerto de Postgres ocupado y un navegador sin reconocimiento de voz — lo de siempre en un hackathon.

Accomplishments that we're proud of

20 herramientas MCP y 20 componentes A2UI propios, todos validados.
Personalización por modo que vive en la arquitectura, no en el texto del prompt.
Cada cifra con fuente: movimientos propios o folleto citado con página y vigencia.