AgroCarteira, la billetera digital del ecosistema TodoAgro

Composición de pantallas de la app AgroCarteira: inicio de la billetera, onboarding y pagos con Pix
ROL
Responsable UX/UI
EMPRESA
TodoAgro
MERCADO
Brasil
PLATAFORMA
App + web
PERÍODO
2024 — Actualidad

01 / RESUMEN

Una billetera desconocida, un onboarding que tenía que dar confianza.

El desafío

Lanzar una billetera propia en un mercado donde ya existen Pix, bancos y wallets conocidas, y donde nadie había oído hablar de AgroCarteira.

El proceso estrella

El onboarding / KYC. Fue lo más iterado: pasó de ~50 pantallas con callejones sin salida a un flujo corto que explica por qué se pide cada dato.

El resultado

Un alta que se siente segura y ordenada, y una wallet que cubre lo cotidiano: transferir y pagar con Pix, pagar boletos y gestionar llaves Pix.

02 / CONTEXTO

Una wallet propia dentro de un marketplace del agro.

AgroCarteira es la billetera digital propia del ecosistema TodoAgro, el marketplace B2B/B2C del sector agropecuario en Brasil. Nació para resolver la complejidad de cobros y pagos dentro de la plataforma y creció como una cuenta digital abierta a todos: 100% online, operaciones 24/7, app móvil y pagos con QR.

En Brasil, Pix es el estándar de pago instantáneo y la gente ya tiene apps y bancos en los que confía. Pedirle a un productor o a una empresa del agro que abra una cuenta en una marca que no conoce y suba sus documentos es una barrera enorme.

DOS PERFILES DE USUARIO

Persona física

Productores y contratistas que operan a nombre propio.

Persona jurídica

Empresas, comercios y distribuidores del agro.

LO QUE EL MERCADO YA TENÍA

  • PIX
  • BOLETO
  • BANCOS
  • WALLETS CONOCIDAS

03 / MI ROL

Responsable de UX/UI de AgroCarteira.

Interfaz de la wallet

Diseño de la interfaz y del sistema visual de la billetera.

Onboarding / KYC

Rediseño del alta: el flujo más iterado del proyecto.

Flujos de pago

Pix, boleto y gestión de llaves Pix.

Trabajo transversal

Producto, desarrollo y negocio.

04 / PROCESO

Un proceso iterativo, con el onboarding como hilo conductor.

Proceso iterativo en seis pasos: entender, definir, diseñar, validar, iterar y entregar, con vueltas de validar a diseñar y de iterar a validar
  1. 1

    Entender

    Revisión del flujo existente y mapeo de cada pantalla, fuga y callejón sin salida.

  2. 2

    Definir

    Qué datos son indispensables ahora y cuáles se pueden pedir después.

  3. 3

    Diseñar

    Flujos para persona física y jurídica, y estados de la carga de documentos.

  4. 4

    Validar

    Revisión con producto, desarrollo y negocio; feedback del equipo.

  5. 5

    Iterar

    Varias rondas para reducir fricción sin perder requisitos de validación.

  6. 6

    Entregar

    Especificaciones y componentes listos para desarrollo.

05 / ARQUITECTURA Y USER FLOWS

Tres flujos, tres formas de ganarse la confianza.

Onboarding

Una línea con paradas: de la bienvenida a la cuenta activa, con la persona siempre sabiendo dónde está.

11 + 22 PASOS · PF Y PJ

Diagrama del flujo de onboarding para persona física y jurídica

Transferencia

Siete pasos y tres controles antes de que el dinero se mueva: quién, cuánto y tu clave.

3 CONTROLES · QUIÉN, CUÁNTO, TU CLAVE

Diagrama del flujo de transferencia con sus tres controles

Llaves Pix

Un centro, tres salidas y una sola confirmación que explica el efecto antes de actuar.

3 ACCIONES · 1 CONFIRMACIÓN

Diagrama del flujo de gestión de llaves Pix

★ PROCESO ESTRELLA

CAPÍTULO 1 · LA PARTE MÁS ITERADA

Verificar a una persona sin hacerla sentir interrogada.

  • KYC
  • ONBOARDING
  • PF / PJ
  • CONFIANZA

EL PROBLEMA

El flujo original tenía alrededor de 50 pantallas, con callejones sin salida, pasos redundantes y pedidos de datos sin explicación.

Para una marca desconocida, cada pantalla extra era una razón para abandonar o desconfiar. Y el KYC no se podía saltear: había que verificar a la persona sin hacerla sentir interrogada.

INSIGHT

“En fintech, el onboarding no es un trámite: es la primera prueba de confianza.”

Pantallas del onboarding rediseñado: datos personales, carga de documentos y cuenta activa

DECISIONES DE DISEÑO

  1. 1 Auditar y mapear todo el flujoEliminar callejones sin salida y pasos redundantes antes de rediseñar nada.
  2. 2 Separar persona física y jurídica desde el inicioCada perfil ve solo los campos y documentos que le corresponden.
  3. 3 Explicar el porqué de cada datoMicrocopy en portugués, simple y cercano, que justifica cada pedido.
  4. 4 Diseñar los estados de la carga de documentosPendiente, subiendo, éxito y error, con un mensaje accionable en cada uno.
  5. 5 Progreso visible y poder retomarEl usuario siempre sabe dónde está y puede volver donde dejó.
  6. 6 Iterar con el equipo hasta bajar la fricciónVarias rondas, sin perder los requisitos de validación.

RESULTADO

Un onboarding más corto, ordenado y transparente: menos dudas, menos puntos muertos y una primera impresión que transmite seguridad.

ENTREGA A DESARROLLO

Cada pantalla se entrega con su estado y su porqué.

El flujo no se pasó como una carpeta de pantallas. Se ordenó como un mapa por pasos que desarrollo lee de arriba hacia abajo, con cada estado, cada fallo posible y cada duda abierta a la vista.

Mapa de handoff del paso 1 (CPF): camino feliz, variantes, estados y notas para desarrollo
  1. 1Notas para desarrolloJunto a cada paso, el flujo en palabras, las reglas y lo que hay que confirmar con back.
  2. 2Camino felizLa secuencia normal, sin errores, de arriba hacia abajo.
  3. 3Variantes y estadosLa misma pantalla en validación, carga, error de negocio o bloqueo. Nada queda librado a la imaginación.
  4. 4Solo si falla la APILas pantallas que no aparecen en el flujo normal y se disparan cuando un servicio no responde.
  • Una sección por paso
  • Código por pantalla (PF-02, PF-02a…)
  • Decisiones abiertas escritas en el mapa
  • Persona física · Persona jurídica · Versión web

CAPÍTULO 2 · CONFIANZA

Ganarse la confianza sin ser una wallet conocida.

  • CONFIANZA
  • MARCA NUEVA
  • UX WRITING
  • BRASIL

EL PROBLEMA

Introducir una billetera desconocida en Brasil es difícil: Pix ya resolvió el pago instantáneo y la gente confía en sus bancos y apps de siempre.

Para el usuario del agro, dejar dinero y documentos en una marca nueva es un salto de fe. El diseño tenía que reducir esa sensación de riesgo en cada pantalla.

INSIGHT

“La confianza se construye con claridad, no con incentivos.”

DECISIONES DE DISEÑO

  1. 1 Lenguaje claro y cercano al agroSin jerga financiera: se dice qué pasa, por qué y qué sigue.
  2. 2 Transparencia sobre los datosSe explica qué se hace con la información que el usuario entrega.
  3. 3 Feedback inmediato en cada acciónEstados de éxito, error y pendiente siempre visibles y comprensibles.
  4. 4 El respaldo del ecosistema TodoAgroLa wallet se apoya en una plataforma que el usuario ya conoce.
  5. 5 Contexto, no plataDiferenciarse con datos claros en vez de promociones o incentivos económicos.

RESULTADO

Una experiencia que baja la sensación de riesgo al operar con dinero y hace que una marca nueva se sienta confiable desde el primer contacto.

Flujo guiado de la billetera: pantallas que explican cada paso y su estado

CAPÍTULO 3 · PAGOS

Pagar tiene que ser tan simple como en las apps que ya conocen.

  • PIX
  • BOLETO
  • PAGOS
  • FINTECH

EL PROBLEMA

Los usuarios llegan con hábitos muy marcados: pagan con Pix y con boleto todos los días.

Cualquier fricción extra los devuelve a su banco. La wallet no podía enseñar un método nuevo; tenía que respetar los que ya usan.

INSIGHT

“No se trata de enseñar un método nuevo, sino de respetar el que ya usan.”

DECISIONES DE DISEÑO

  1. 1 Pix en todas sus formasPago con QR, copia y pega y llave, con el mismo patrón en cada caso.
  2. 2 Boleto con código de barrasLectura del código, monto y vencimiento visibles antes de pagar.
  3. 3 Confirmación previa con resumenAntes de mover dinero, se muestra a quién, cuánto y desde dónde.
  4. 4 Comprobante claro y compartibleEl pago termina con una prueba fácil de guardar y enviar.

RESULTADO

Los pagos cotidianos quedan resueltos dentro de la misma billetera, sin salir a otra app.

Flujo de pago con Pix y boleto: lectura, confirmación y comprobante

CAPÍTULO 4 · CONTROL

Control total sobre tus llaves y tu cuenta.

  • LLAVES PIX
  • GESTIÓN
  • SEGURIDAD
  • WALLET

EL PROBLEMA

Registrar, portar o eliminar una llave Pix da miedo: un error puede dejar a alguien sin poder cobrar.

El desafío era que el usuario sintiera control y reversibilidad en acciones que parecen técnicas.

INSIGHT

“Una acción delicada necesita una explicación tranquila, no una advertencia.”

DECISIONES DE DISEÑO

  1. 1 Listado claro de llaves con su estadoQué llaves están activas, en proceso o fuera de uso.
  2. 2 Acciones delicadas con confirmación explicadaSe explica el efecto antes de eliminar o portar una llave.
  3. 3 Mensajes de éxito y error comprensiblesQué pasó y qué hacer a continuación, sin códigos técnicos.
  4. 4 Otras funciones de la walletCobros por QR, extracto e integración con compras en TodoAgro.

RESULTADO

Sensación de control y reversibilidad al manejar llaves y movimientos.

Llaves Pix: elegir el tipo de llave, confirmarla y llave registrada con éxito

DESIGN SYSTEM

06 / TRADE-OFFS

Lo que elegí, y lo que dejé de lado.

Pedir menos datos vs. cumplir la validación

Se priorizó lo indispensable al inicio y se difirió el resto, sin romper los requisitos de verificación.

Explicar mucho vs. mantener el flujo corto

Textos breves y ayuda contextual a demanda, en lugar de pantallas de explicación.

07 / APRENDIZAJES

Lo que me llevo de AgroCarteira.

“La confianza también es una decisión de interfaz.”

“Reducir pantallas no es recortar: es decidir qué merece estar.”

“Iterar el onboarding muchas veces fue lo que más valor dio.”

SIGUIENTE PASO

¿Hablamos?

Si querés charlar sobre fintech, onboarding o cómo diseñar confianza, me encanta.