Sur Finanzas — Case Study

Contexto

Una casa de cambio que quería ser fintech

Sur Finanzas es una casa de cambio con presencia física que decidió dar el salto al mundo digital. Su objetivo: una billetera virtual propia que les permitiera ofrecer sus servicios financieros a través del celular, incluyendo retiro de efectivo en sus propias sucursales.

El proyecto llegó a través de la startup de desarrollo donde trabajo. La consigna era diseñar una billetera virtual completa desde cero. Sin producto previo, sin referencias internas.

Más allá de los servicios financieros, Sur Finanzas tenía lazos comerciales con el mundo del entretenimiento. Eso abrió la puerta a integrar un marketplace de entradas —fútbol y recitales— directamente en la app. Una billetera que no solo mueve dinero, también mueve emociones.

Pantalla de bienvenida e inicio del registro

El desafío

No había producto previo ni referencia interna. El cliente tenía su visión clara desde el inicio: sabía exactamente qué producto quería construir y para quién. Mi rol fue traducir esa visión en decisiones de diseño concretas, apoyadas en un análisis competitivo profundo del mercado.

Diseño 0 a 1. Cada decisión —arquitectura, flujos, sistema visual— fue tomada desde cero. Sin precedentes internos en los que apoyarse.

Full ownership. Único diseñador del proyecto. UX research, wireframes, UI, prototipo y handoff: todo bajo mi responsabilidad.

Scope ambicioso. El cliente pedía un MVP, pero la visión del producto era mucho mayor. Tuve que priorizar sin perder coherencia en el diseño completo.

Mercado exigente. Mercado Pago, Lemon, Belo, Brubank tienen años de iteración. Había que diseñar algo que se sintiera igual de maduro desde el día uno.

Proceso

Benchmarking como base. Decisiones como proceso.

Con la visión del cliente ya definida, estructuré el trabajo en un análisis exhaustivo de las mejores billeteras del mercado y una traducción directa de esas necesidades en decisiones de diseño concretas.

Análisis competitivo. Relevé en profundidad billeteras locales e internacionales, identificando patrones de UX consolidados y oportunidades de diferenciación.

Arquitectura de información. Definí la estructura priorizando los 4 flujos críticos: balance, enviar, cobrar y convertir. Todo lo demás orbitó alrededor de esas acciones.

Design system propio. Construí un sistema de componentes en Figma que garantizara consistencia visual y escalabilidad para las funciones futuras.

Una decisión que definió todo el producto: home en dark mode, flujos transaccionales en light mode. El home es donde el usuario contempla su patrimonio —el dark refuerza esa sensación de solidez. Los flujos de operación necesitan claridad y rapidez: el light gana.

Home & Balance

La pregunta de diseño más importante del producto

¿Cómo mostrás 4 monedas distintas sin abrumar al usuario? Mi solución: dos modos de lectura. Balance Total para quien quiere un número que lo represente todo. Mis Monedas para quien quiere el desglose por activo. El usuario elige cómo quiere ver su dinero —la app no decide por él.

La decisión de dark mode en el home —y light en todos los flujos transaccionales— no es estética: es semiótica. El home es contemplación. La transacción es acción. Dos estados de uso distintos merecen dos atmósferas distintas.

Balance Total (suma en ARS) y Mis Monedas (desglose por activo)

Operaciones

En fintech, cada paso innecesario cuesta conversión

Diseñé cada flujo operativo partiendo de la misma pregunta: ¿qué es lo mínimo que el usuario necesita ver para actuar con confianza? La respuesta definió la arquitectura de todas las pantallas: información progresiva, errores prevenidos antes de ocurrir, confirmación solo cuando la acción es irreversible.

Enviar a alias o CBU

Cobrar con QR

Cobrar con PIX

CVU & Alias

Enviar dinero. El botón de continuar permanece deshabilitado hasta que el destinatario es válido. Decidí prevenir el error antes de que ocurra, no informarlo después de que el usuario ya lo cometió.

Enviar criptomonedas. El primer paso selecciona la moneda —con el balance disponible visible por activo— antes de pedir la dirección de destino. La decisión elimina el error más frecuente: ingresar una dirección sin saber si tenés saldo suficiente.

Cobrar en ARS con QR. El header en teal establece jerarquía deliberada: el monto es lo primero que el usuario —y quien paga— necesita verificar. El QR es el mecanismo, no el protagonista.

Pagar con QR. Escáner nativo con detección automática del monto. La confirmación en dos pasos no es fricción: es el momento donde el usuario revisa antes de que el dinero salga.

Cobrar con PIX. El turista paga en reales; el usuario recibe cripto al instante. El desafío de diseño fue que el usuario entienda un flujo multicurrency sin que parezca complejo. La solución: mostrar solo lo que importa en cada paso.

Historial de movimientos. Filtros por fecha, tipo y moneda porque un usuario con 4 activos no puede leer un listado cronológico plano. La descarga de comprobantes en PDF resuelve una necesidad real: justificar una transferencia.

Selección de criptomoneda a enviar e historial de movimientos con búsqueda y filtros

Selector de conversión USDT→ARS y revisión del detalle antes de confirmar

Conversión

Convertir cripto es irreversible. El diseño tiene que decirlo.

El mayor riesgo de este flujo no es técnico: es la ansiedad del usuario antes de confirmar. Decidí separar la operación en dos momentos deliberadamente distintos: el usuario primero construye la conversión, luego la revisa completa. El botón de confirmar se habilita solo después de que vio todo.

Mostrar la cotización exacta del momento —no una aproximación— fue una decisión de confianza. El usuario sabe exactamente qué da y qué recibe antes de ejecutar. Sin letra chica, sin sorpresas post-confirmación.

Tarjetas

Las acciones críticas no deben sacar al usuario de contexto

Gestionar una tarjeta es el momento donde el usuario tiene más miedo a equivocarse. Opté por un bottom sheet que se abre sobre la pantalla actual: las acciones —modificar límite mensual, cambiar PIN cajero, registrar aviso de viaje, dar de baja— se ejecutan en contexto, sin perder de vista de dónde vinieron.

Vista de tarjeta Mastercard y opciones desde bottom sheet

Servicios

Retención por utilidad real, no por notificaciones

Si el usuario paga su luz desde Sur Finanzas, vuelve todos los meses sin que nadie se lo recuerde. Integrar servicios fue una decisión de retención disfrazada de comodidad. Diseñé el flujo para que la primera experiencia de pago sea tan fluida que no exista motivo para hacerlo desde otra app.

Búsqueda de servicio por nombre y escáner de factura por QR o código de barras

Surfistore

Un feature disruptivo que tenía que sentirse nativo

El cliente quería integrar la compra de entradas dentro de la billetera. El riesgo de diseño era evidente: si lo hacés mal, parece un feature pegado con cinta. Decidí darle a Surfistore su propia identidad visual dentro del ecosistema —no para que se diferencie, sino para que el usuario sienta que alguien pensó en esa experiencia específicamente.

Buscador prominente, hero con el evento del momento, categorías por tipo de experiencia. La misma arquitectura de información de cualquier marketplace maduro, pero dentro de una billetera. El resultado: comprar una entrada y pagar el gas desde el mismo lugar se siente coherente.

Home de Surfistore con hero, buscador y categorías de eventos

Onboarding & Autenticación

¿Cuánto le pedís al usuario antes de mostrarle valor?

Esa fue la pregunta que guió todo el diseño. La respuesta: nada. El primer paso muestra qué hace la app. El segundo pregunta quién es el usuario. Solo entonces empieza el formulario. Diseñé cuatro flujos de autenticación —registro, login, recuperación de contraseña y de PIN— con el KYC como eje de seguridad compartido entre todos.

Arquitectura del flujo

Tres caminos, cero estados sin resolver

01 · Registro 02 · Inicio de sesión 03 · Recuperación de contraseña

Antes de diseñar pantallas, mapeé los tres flujos posibles del usuario. El diagrama identificó los puntos de decisión críticos —validación de mail, aprobación KYC, existencia de PIN— y garantizó que ningún estado de error quedara sin resolver.

Diagrama de flujo — Onboarding Sur Finanzas

El KYC no es un trámite, es una decisión de diseño. En Argentina, las billeteras virtuales están obligadas a verificar la identidad de sus usuarios por normativa del BCRA. El paso de KYC —validación de DNI, selfie y datos personales, aprobado por servicios externos— es el punto de mayor abandono en cualquier onboarding financiero. Diseñarlo con claridad, progreso visible y mensajes precisos no es opcional: es lo que determina si el usuario completa el registro o se va.

Registro — correo

Verificación KYC

Olvidé mi contraseña

Olvidé mi PIN

Registro. OTP → datos → KYC → PIN → biometría opcional. Cada paso tiene un propósito claro comunicado antes de pedirlo. La barra de progreso no es decorativa: reduce el abandono al mostrarle al usuario cuánto le falta.

Inicio de sesión. Mail y contraseña. Si el usuario tiene PIN activo lo ingresa para desbloquear; si eligió biometría, accede con huella o Face ID.

Olvidé mi contraseña. Mail → OTP → KYC → nueva contraseña. Reutilicé el KYC como verificador de identidad en lugar de diseñar un sistema alternativo. Una decisión que redujo complejidad sin sacrificar seguridad.

Olvidé mi PIN. El usuario está logueado pero bloqueado: ya sabemos quién es, no necesitamos OTP. Decidí saltear ese paso y ir directo al KYC. Menos fricción, misma seguridad.

Perfil & Configuración

El perfil es donde el usuario decide cuánto confía en la app

El perfil suele ser el rincón más descuidado de las apps financieras. Lo traté como un espacio de control genuino: no solo cambiar contraseña, sino todo lo que el usuario necesita para sentir que la cuenta le pertenece —y que puede resolver cualquier problema sin salir de la app.

Cambiar contraseña y mail. Cambios críticos requieren OTP antes de aplicarse. La fricción es intencional: si alguien tomó el teléfono sin permiso, necesita un segundo obstáculo.

Vincular número de teléfono. Canal adicional de verificación y recuperación de cuenta, configurado desde el perfil en cualquier momento.

FAQ y chatbot integrado. Derivar al usuario a WhatsApp o a un mail para resolver una duda es un fracaso de diseño. El soporte vive dentro de la app porque el problema del usuario ocurre dentro de la app.

Centro de notificaciones. Historial de alertas categorizado: transacciones, seguridad, beneficios y novedades de la app.

Cambiar contraseña

Vincular teléfono

Chatbot de soporte

Notificaciones

Alcance del proyecto

Un producto completo, diseñado en solitario

Todo lo que ves en este case study fue diseñado por mí, de cero. El vínculo comercial con el cliente finalizó al entregar el MVP, pero la visión del producto era mucho más amplia —y así lo diseñé desde el primer día. Las secciones de este portfolio reflejan el producto completo: no solo lo que se entregó, sino todo lo que se concibió y diseñó.

Retiro de efectivo en sucursales físicas de Sur Finanzas usando un QR generado en la app es la única funcionalidad que quedó fuera de esta presentación por ser exclusiva del modelo de negocio del cliente.

Aprendizajes

Lo que me dejó este proyecto

01

El scope inicial nunca es el scope real

Diseñé pensando en el producto completo, aunque la entrega fuera el MVP. Esa visión amplia permitió tomar decisiones que escalan bien cuando el producto crece. No diseñes solo para hoy.

02

Cuando el cliente ya tiene la visión, el benchmarking es la herramienta más valiosa del diseñador

Cuando no hay tiempo ni acceso a usuarios, el análisis competitivo profundo —entendiendo el por qué de cada decisión— es la herramienta más valiosa que tiene un diseñador.

03

En fintech, el diseño es señal de seguridad

Cada decisión visual construye la percepción de que el dinero del usuario está en buenas manos. La consistencia tipográfica, los estados de feedback, el uso del color: todo habla antes que cualquier funcionalidad.

SurFinanzas