-
Pantalla de inicio del Portal del Cliente
-
Formulario de orden
-
Datos de la orden
-
Pantalla inicial del Sistema Interno
-
Formulario para el aprendizaje de la IA
-
Comparación de Portal del cliente con Sistema interno
-
Anuncio de aprendizaje completo
-
Pantalla de inicio del Dashboard de la IA
-
Eventos observados por la IA
-
Mapeo realizado por Gemini
-
Orden automatizada diferente a observada
-
Comparación automática de origen vs destino (arriba); registro de órdenes automatizadas (abajo)
Inspiration
Nexia salió de una situación sencilla, pero común: dos sistemas web que no se comunican entre sí. En muchos procesos, cuando no existe una integración directa como EDI, una persona tiene que abrir un portal, leer la orden de compra y capturar esos datos de manera manual en otro sistema. Aunque parece rápido, cuando hay muchas órdenes o distintos formatos de cliente, el proceso se vuelve repetitivo, tardado y propenso a errores.
A partir de eso construimos una solución que pudiera observar una captura manual, entender el proceso del paso de datos y después repetir ese flujo con cada nueva orden.
What it does
Nexia es un agente de IA que observa una captura manual entre dos sistemas web: el portal del cliente y el sistema interno. En nuestro demo, el portal del cliente permite crear órdenes de compra desde cero para simular órdenes reales del cliente del canal moderno. Cada orden recibe un número automático según se registre, como OC-001, OC-002, etc. Después, el usuario activa la observación de IA, confirma los datos visibles de la orden y captura manualmente esa información en el sistema interno.
Al guardar la captura, Nexia finaliza la observación y aprende automáticamente con Gemini. La IA analiza los eventos registrados y genera un mapeo entre los campos del portal cliente y los campos del sistema interno. A partir del mapeo generado Nexia automatiza una orden diferente y valida que los datos coincidan campo por campo.
How we built it
El demo se construyó con HTLM, CSS y JavaScript; donde el proyecto se divide en tres partes: portal del cliente, sistema interno de arca y el dashboard de la IA. El portal del cliente permite crear órdenes nuevas en vivo, sin depender de órdenes precargadas en el sistema; el sistema interno de arca simula el formulario donde normalmente una persona capturaría los datos de manera manual; y el dashboard IA muestra los eventos observados, el mapeo generado por Gemini, la automatización, la validación final y las órdenes que se han registrado automáticamente.
Usamos localStorage para guardar temporalmente las órdenes creadas, los eventos observados, el mapeo, los resultados de la automatización y los registros, Además, integramos Gemini API como la capa de IA que se encarga de interpretar los campos y generar el mapeo en formato JSON.
Challenges we ran into
Uno de los retos más importantes fue entender la diferencia entre una automatización hardcodeada y construir una solución que permita inferir el mapeo de manera real después de observar el proceso. Al principio era fácil caer en la idea de programar directamente qué campo iba con cuál, pero eso no resolvía el reto. Por eso ajustamos el demo para que las órdenes se crearan en vivo, para que el mapeo aparezca solo después de la observación y para que Gemini sea el que genere la relación entre campos.
Adicionalmente agregamos un indicador de Observación ON/OFF para que fuera claro cuándo el agente estaba registrando eventos. Después mejoramos el flujo para que el usuario no tuviera que decidir cuándo aprender: Nexia aprende automáticamente al guardar la captura manual.
Accomplishments that we're proud of
Estamos orgullosas de haber construido un demo funcional de extremo a extremo, ya que Nexia crea órdenes, observa una captura manual, aprende el mapeo con Gemini, automatiza una orden diferente y valida los datos campo por campo. También nos emociona haber hecho el flujo más claro y defendible (según nosotras), agregando opciones como el botón de observación ON/OFF, aprendizaje automático al guardar la orden, entre otras.
Al ser nuestro primer hackatón, nuestro mayor logro fue sin duda pasar de "no tenemos idea de cómo empezar" a "construimos un demo con un concepto funcional y alineado al reto". Definitivamente es una experiencia que nos trajo mucho aprendizaje, mejoró nuestras habilidades de comunicación con la tecnología y nos hizo perder el miedo a utilizar la IA de manera correcta y aplicable.
What we learned
Aprendimos que una solución de IA no solo debe funcionar, sino que también debe poder explicarse y replicarse de forma clara. Para esto, debíamos mostrar cada fase del proceso:
- Conexión
- Observación
- Aprendizaje
- Automatización
- Validación
También aprendimos que no es siempre necesario entrenar una IA desde cero. En nuestro caso, Gemini nos ayudó a interpretar el contexto de los campos y generar un mapeo a partir de una sola observación. Como fue nuestro primer hackatón, también aprendimos a tomar decisiones de alcance, es decir, priorizamos una prueba completa con un concepto estable, donde pudiéramos demostrar el flujo de extremo a extremo SIN comprometer la claridad del demo.
What's next for Nexia
Como siguiente paso, Nexia podría conectarse con sitios web reales usando automatización de navegador. Podría enviar los registros automatizados a una base de datos o API real, en lugar de usar el almacenamiento local como en nuestro demo. Finalmente, el mismo enfoque podría aplicarse a otros procesos repetitivos entre sistemas web, y no solo limitado a órdenes de compra.
Log in or sign up for Devpost to join the conversation.