Skip to content
Diseño de Producto · FinTech · Móvil y Web

Finanzas de autoservicio, diseñadas para la confianza.

Diseñador UX líder para AFIN — la app de gestión financiera de autoservicio de Mapfre, que cubre inversiones, ahorros y planes de pensiones — desde la arquitectura de información de divulgación progresiva hasta una nueva funcionalidad de Asesor Financiero construida sobre orientación personalizada, recolección transparente de datos y autonomía del usuario.

Móvil y Web FinTech 2022 — 2023
ClienteMapfre
AgenciaFlat 101
Mi rolDiseñador UX / Producto Líder
PeríodoDic 2022 — Ago 2023
AlcanceDiseño de Producto · Móvil y Web · FinTech
Contexto

Una app financiera de autoservicio en una intersección compleja

AFIN es la app de autoservicio financiero de Mapfre para clientes individuales — que cubre productos de ahorro, carteras de inversión y planes de pensiones. El producto se sitúa en una intersección poco habitual en los servicios financieros: necesita sentirse lo suficientemente simple para clientes que no son expertos financieros, mientras es lo suficientemente confiable para clientes que toman decisiones financieras a largo plazo.

Esa tensión — entre simplicidad y completitud — es el reto de diseño central en el UX de apps financieras. Simplificar demasiado agresivamente oculta información que los clientes necesitan. Presentar todo abruma al cliente que vino para una consulta rápida. El trabajo de diseño fue la navegación de esa tensión en cada nivel del producto.

El reto

Añadir un Asesor Financiero — sin romper la confianza

El objetivo principal del encargo fue introducir una funcionalidad de Asesor Financiero: un sistema de orientación personalizada que generara recomendaciones de productos basadas en el perfil de riesgo y los objetivos financieros de cada usuario. Una capacidad significativamente nueva — y un problema de diseño correspondientemente complejo.

Tres tensiones configuraron el trabajo. Primera: integrar una nueva funcionalidad importante en la arquitectura existente sin disrumpir la coherencia de una app que ya tenía su propio modelo de información. Segunda: diseñar una recolección de datos en la que los usuarios confiaran realmente — preguntar sobre situación financiera, apetito de riesgo y objetivos a largo plazo requiere un nivel de transparencia que la mayoría de las apps financieras no alcanzan. Tercera: equilibrar la orientación automatizada con la autonomía del usuario — un motor de recomendaciones que parece una herramienta de ventas destruye la confianza más rápido que no tener ninguna recomendación. Cada producto sugerido necesitaba mostrar su razonamiento.

Enfoque

Divulgación progresiva, no complejidad progresiva

El encargo comenzó con una fase de descubrimiento: mapeo del viaje del cliente a través de múltiples puntos de entrada para entender cómo distintos tipos de usuarios navegaban la app — qué buscaban, dónde abandonaban y dónde la arquitectura de información estaba generando fricción innecesaria. Esa investigación configuró el modelo por capas sobre el que se construyó el rediseño.

La arquitectura UX se construyó en torno a la divulgación progresiva: la vista por defecto presenta el resumen que la mayoría de los usuarios necesita la mayor parte del tiempo, con un camino consistente hacia el detalle disponible en cada nivel. Ninguna función está oculta — pero no todas necesitan ser prominentes. El Asesor Financiero se sitúa en la capa más profunda de esta jerarquía: siempre disponible, nunca intrusivo.

El UX de productos financieros también requiere una atención cuidadosa al lenguaje de la confianza. Cómo nombras un producto (plan de pensiones vs. ahorro para la jubilación), cómo presentas los datos de rendimiento, cómo comunicas el riesgo — estas son decisiones de diseño con consecuencias reales para las decisiones que toman los usuarios. Trabajé estrechamente con los equipos de producto y legal de Mapfre para definir las convenciones de lenguaje que funcionarían en todo el producto.

CAPA 0 — VISTA POR DEFECTO Valor Total y Rendimiento Todos los productos — cargado al abrir CAPA 1 — PRODUCTOS Ahorro Cuentas líquidas Inversiones Acciones y fondos Pensiones Largo plazo CAPA 2 — DETALLE BAJO DEMANDA Rendimiento · Perfil de Riesgo · Historial Gráficos · Límites regulatorios · Auditoría CAPA 3 — ACCIONES Aportar · Reequilibrar · Solicitar Asesor Banca directa · Rebalanceo · Asesoría
Cuatro capas, tres tipos de producto. La vista por defecto carga lo que la mayoría necesita la mayor parte del tiempo. Cada capa adicional — detalle, luego acción — requiere un toque deliberado más. Complejidad bajo demanda, no por defecto.
El Asesor Financiero

Orientación personalizada, con razonamiento visible

La funcionalidad requería diseñar un flujo de recolección de datos que los usuarios estuvieran dispuestos a completar. Preguntar a alguien sobre su tolerancia al riesgo financiero y sus objetivos a largo plazo es delicado — el diseño tenía que comunicar con claridad por qué se recopilaba la información y cómo se utilizaría, sin enterrar ese contexto en lenguaje legal. Cada pregunta se planteó en términos simples con un propósito transparente.

El resultado de las recomendaciones tenía que ganarse la confianza en el momento de mostrarse: cada producto sugerido se presentaba con su razonamiento — por qué este producto, por qué ahora, en qué suposición se basaba. Los usuarios podían aceptar una recomendación, modificar los datos que la generaron o ignorarla completamente. Preservar esa autonomía — hacer que la orientación se sintiera como asesoramiento informado y no como un embudo de ventas — fue la restricción de diseño definitoria de la funcionalidad.

CONFIGURACIÓN DE PERFIL Perfil de Riesgo y Objetivos Financieros Tolerancia · Horizonte temporal · Objetivos Lenguaje simple · Propósito transparente MOTOR DE ASESORAMIENTO Matching Personalizado de Productos Alineación riesgo-producto · Filtrado por objetivos RECOMENDACIONES Sugerencias Personalizadas Mostradas con razonamiento explícito Por qué este · Por qué ahora · En base a qué AUTONOMÍA DEL USUARIO Aceptar · Modificar datos · Ignorar Autonomía preservada — orientación, no embudo
El flujo del asesor está diseñado en torno a la confianza en cada paso. La recolección de datos es transparente y con propósito. Las recomendaciones se muestran con razonamiento visible. La autonomía del usuario se preserva en todo momento — el sistema asesora, no decide.
Inicio del asesoramiento — prerrequisitos explicados con claridad antes de que el usuario inicie el proceso
Propuesta de inversión — selector de riesgo, vista de cartera por pestañas y desglose del fondo en una sola pantalla
Confirmación de firma — estado de éxito limpio con descarga de propuesta y próximos pasos claros
Flujo del asesoramiento — móvil — punto de entrada, propuesta de inversión con controles de riesgo y confirmación de firma. Tres pasos de un mismo viaje de usuario.
Modal de salida — aviso de acción destructiva que intercepta el abandono con una oferta de ayuda asistida
Decisión de diseño

Cuando un usuario intenta salir del flujo de asesoramiento a mitad de proceso, el modal lo intercepta con una oferta de llamada — "Te llamamos". El abandono se convierte en una vía de entrada a la ayuda asistida. Una pequeña decisión de diseño con implicaciones de retención medibles.

Operaciones de diseño

Migración, coordinación y entrega

El encargo incluyó también un reto importante de operaciones de diseño desde el inicio: la app contaba con una extensa biblioteca de pantallas y un sistema de diseño completo construido en Sketch, que requería una migración completa a Figma mientras el desarrollo de funcionalidades continuaba en paralelo. Planifiqué y lideré esa migración — definiendo la estructura, las fases y los estimados de esfuerzo — garantizando la continuidad del trabajo de producto durante todo el proceso.

La coordinación con Capgemini, el partner de desarrollo, fue una constante durante todo el encargo: procesos de handoff disciplinados y alineación regular entre equipos eran esenciales en un entorno donde diseño, cliente e ingeniería operaban bajo estructuras organizativas distintas. El alcance multidispositivo — escritorio, tablet y móvil — añadió una capa adicional de complejidad en las especificaciones y el proceso de entrega.

Aprendizajes

Lo que el UX financiero enseña sobre la confianza

Los productos financieros hacen visibles las apuestas de las decisiones de UX de un modo que las apps de consumo a menudo no hacen. Un patrón de navegación confuso en un servicio de streaming le cuesta al usuario unos segundos. Un patrón de navegación confuso en una cuenta de inversión puede contribuir a una decisión tomada sin información suficiente — con consecuencias financieras reales.

Esa realidad enfoca las decisiones de diseño. También requiere una relación de trabajo con compliance y legal que sea genuina, no adversarial. El mejor UX financiero que he visto viene de equipos donde diseño y legal han aprendido a hablar el mismo idioma — donde legal entiende por qué una pieza de información requerida no tiene que estar en la posición más disruptiva de la página, y diseño entiende por qué la información no se puede eliminar.

Los datos de rendimiento específicos de este encargo están sujetos a NDA.

Disponible

Tu problema más difícil
es un buen punto de partida.

Abierto a roles de product design senior y proyectos de consultoría selectivos — en inglés o español.