Kuara

Simplificar las transferencias interbancarias, que exigían números de cuenta complejos y tiempos de espera, en un pago P2P instantáneo basado en el número de celular.

Kuara permite mover de $0.01 a $5,000 al instante y sin comisiones, y no tiene una app propia: vive dentro de las aplicaciones de Global Bank, Banesco, Banistmo, Caja de Ahorros y MMG Bank. Cada banco tiene su propia interfaz, así que la experiencia debía adaptarse a todos sin dejar de ser Kuara.

La complejidad

• Entorno multibanco

  Una solución white-label que se integra en cinco apps bancarias distintas, con sus propias marcas y patrones, y que se reconoce igual en todas.

• Seguridad sin fricción

  Validación con Token y altos estándares de seguridad en cada transacción, sin añadir pasos que frenen un pago que debe durar segundos.

• Escala y velocidad

  Cada banco implementa Kuara con su propio equipo: sin componentes y reglas comunes, cada integración partía de cero.

Objetivos

• Que enviar dinero a otro banco fuera tan simple como escribir un número de celular.
• Una experiencia consistente en todas las entidades, con seguridad integrada en el propio flujo.
• Un sistema de diseño y una documentación que aceleraran la implementación en cada banco.

Diseñé tres flujos principales, pensados para completarse en pocos pasos y dentro del contexto de la app bancaria del usuario.

1. 01Afiliación

   • Activar Kuara desde la app del banco
   • Vincular el número celular a una cuenta activa
   • Listo en 2 o 3 pasos

2. 02Envío P2P

   • Elegir un contacto de la libreta o escribir el celular
   • Definir el monto, de $0.01 a $5,000
   • Validación de datos en tiempo real

3. 03Seguridad y confirmación

   • Autorización con Token de seguridad
   • Comprobante inmediato
   • Compartir por WhatsApp o correo

• Afiliación en 2 o 3 pasos

  La activación ocurre dentro de la app que el usuario ya conoce: solo vincula su número celular a una cuenta activa, sin formularios largos ni registros externos.

• Enviar es elegir un contacto

  Destinatarios desde la libreta del dispositivo o escribiendo el número, y validación en tiempo real para confirmar a quién se envía antes de autorizar.

• La confianza al final del flujo

  Autorización integrada con Token y un comprobante inmediato, listo para compartir, que cierra el pago con certeza.

El ecosistema: Kuara para comercios

Además de la experiencia P2P, diseñé la plataforma web con la que los comercios cobran con Kuara. El comercio se afilia y completa un onboarding guiado en siete pasos, crea sucursales y puntos de cobro, y solicita pagos con el número del cliente o con un QR dinámico, siguiendo sus ingresos desde un dashboard.

Creé desde cero un sistema de diseño escalable pensado para productos financieros multientidad: fundaciones, variables primitivas y semánticas, estados interactivos, componentes reutilizables y reglas de Auto Layout preparadas para la personalización y la implementación técnica.

• Tokens primitivos y semánticos

  Una capa de valores base y otra de intención (fondos, textos, bordes, estados) que permite ajustar el sistema a cada entidad sin tocar los componentes.

• Estados interactivos

  Cada componente define sus estados (reposo, hover, foco, deshabilitado, error, carga) para que el comportamiento sea idéntico en todas las apps.

• Componentes con Auto Layout

  Botones, campos, selectores, menús, avatares y tarjetas construidos con Auto Layout y propiedades, listos para adaptarse a cualquier contenido.

Traduje y documenté el sistema de Figma en Storybook para crear una única fuente de verdad entre diseño y desarrollo, y acelerar la integración en los entornos bancarios sin deuda visual ni técnica.

1. 01Figma

   • Variables primitivas y semánticas
   • Componentes y variantes

2. 02Storybook

   • Variantes y estados
   • Propiedades (props)

3. 03Guías de uso

   • Cuándo y cómo usar cada componente
   • Buenas prácticas y accesibilidad

4. 04Apps bancarias

   • Integración en cada entidad
   • Sin deuda visual ni técnica

• Una sola fuente de verdad

  Diseño e ingeniería consultan la misma documentación: lo que existe en Figma existe, con el mismo nombre, en código.

• Variantes, estados y props

  Cada componente documenta sus variantes, estados y propiedades, con ejemplos interactivos que el equipo puede probar.

• Handoff sin fricción

  Las guías de uso responden las dudas antes de que aparezcan y reducen las idas y vueltas entre diseño y desarrollo.

• Bancos5de los principales de Panamá adoptaron la experiencia
• Por pago$5,000de límite, desde $0.01, al instante
• Comisiones$0para enviar y recibir dinero

• Experiencia estandarizada

  Una experiencia de pagos P2P común adoptada por cinco de los principales bancos de Panamá.

• Handoff e implementación más rápidos

  La sincronización entre Figma y Storybook redujo de forma drástica los tiempos de handoff y de implementación frontend.

• Rápido, gratuito y seguro

  Una experiencia transaccional instantánea y sin comisiones para miles de usuarios bancarios.

Aprendizajes

• En productos financieros, la confianza se diseña: validación en tiempo real, confirmaciones claras y comprobantes pesan tanto como lo visual.
• Diseñar para varias entidades obliga a separar lo que es marca de lo que es comportamiento: los tokens semánticos son esa frontera.
• Un sistema de diseño solo escala cuando ingeniería lo usa: documentarlo en Storybook fue tan importante como diseñarlo.