2019 / Perú / Financiera oh!

De caos visual a eficiencia operativa: un sistema de diseño para una financiera en expansión

Mi rol

UX designer

Mi aporte

Design system

UX design

Branding digital

Resumen

En un momento de transformación (rebranding, migración a desarrollo in-house y expansión de productos digitales), Financiera oh! enfrentaba un ecosistema digital fragmentado, inconsistente y poco escalable.

Desde mi rol como único diseñador interno, lideré la creación de un sistema de diseño para alinear los canales digitales a la nueva marca, optimizar la colaboración entre equipos y sentar las bases para la evolución del ecosistema.

Diseñé una estrategia de implementación progresiva, aprovechando proyectos clave como el rediseño del sitio web y la refactorización de la app. El sistema se consolidó como una herramienta crítica para escalar productos, colaborar con desarrollo y reforzar la percepción de marca.

Espacio del problema

Un ecosistema digital fragmentado en el peor momento

Financiera oh! se encontraba en un momento de expansión digital: relanzamiento de marca, incorporación de nuevos productos y migración del desarrollo a equipos internos.

Sin embargo, el entorno digital no estaba preparado:

Las plataformas eran visualmente incoherentes debido a múltiples proveedores

No había estándares de diseño ni de desarrollo reutilizables

La percepción del usuario era inconsistente e informal

El trabajo con desarrollo era ineficiente y generaba reprocesos

Capturas de 3 sitios web de Financiera oh! con estilos visuales distintos
Antes: sitios web
Capturas de la app y el homebanking de Financiera oh! con estilos visuales distintos
Antes: app y homebanking

Una posición privilegiada

Como único diseñador interno, trabajaba todos los activos digitales. Esto me permitió conectar los síntomas visuales con un problema central: no existía un lenguaje común entre marca, experiencia de usuario y desarrollo.

Vi la oportunidad estratégica de diseñar ese lenguaje con el objetivo de:

  • Reforzar la percepción de marca con una interfaz coherente, moderna y confiable.

  • Estandarizar el diseño para escalar productos de forma eficiente.

  • Optimizar la colaboración con desarrollo interno y externo.

  • Preparar al equipo para el crecimiento futuro con documentación clara.

Diagrama del nuevo estilo visual
Concepto visual
Ejemplos de imagen e iconos con el nuevo estilo visual
Nuevo estilo de imagenes e iconos

Un nuevo diseño para un nuevo posicionamiento

A partir de investigaciones con clientes y análisis de la competencia, identificamos la necesidad de reforzar una imagen más moderna y joven, alineada con el uso de la tarjeta en los retails del grupo.

El equipo de marketing había trabajado en una nueva identidad visual, pero aún faltaba definir el estilo de la interfaz de usuario. Ahí entré yo.


Espacio de la solución

Imagen que muestra el antes y después del sitio web de Financiera oh!
Antes y después de la web pública

Diseñar el sistema, sin permiso pero con propósito

Refactorizar todo de inmediato era inviable, pero encontré dos momentos clave para introducir el sistema de forma estratégica:

  1. El rediseño del sitio web, como parte del relanzamiento de marca.

  2. La refactorización de la app por motivos de seguridad.

El reto

Convencer a negocio de priorizar un sistema de diseño frente a proyectos más ‘urgentes’ no fue fácil, por eso adopté una estrategia de adopción progresiva.

Con una estrategia de adopción bottom-up:

Diseñé y probé el sistema en paralelo al rediseño mostrando valor tangible sin esperar aprobación formal

Busqué aliados en el equipo de desarrollo que buscaban eficiencia en su nuevo modelo in-house

Escogí proyectos clave para las primeras intervenciones

Captura de los principios de diseño: cliente-céntrico, omnicanal y evolutivo

Documentación para el futuro

Aunque era el único diseñador, planifiqué para el crecimiento del equipo y garantizar la consistencia con proveedores. Creé guías y bibliotecas que compartí con desarrolladores y diseñadores externos.

Capturas de la documentación del sistema de diseño
Más capturas de la documentación del sistema de diseño
Documentación

Impacto y resultados

Consistencia y eficiencia

El sistema de diseño se convirtió en una herramienta clave para el crecimiento digital de la financiera:

100%

del nuevo sitio web fue rediseñado y lanzado con el sistema

75%

de la app fue refactorizada con los nuevos lineamientos

30%

del home banking migró hacia el nuevo sistema en la primera fase

Más allá de los números, el nuevo sistema permitió:

  • Reducir fricción entre diseño y desarrollo.

  • Acelerar la producción de nuevas funcionalidades.

  • Establecer una infraestructura visual que sirviera a largo plazo

Aprendizaje clave

Liderar esta transformación sin autoridad formal me enseñó que el liderazgo se ejerce, no se espera.