Rediseñando nuestra metáfora: la nueva interfaz de Devengo

Cuando me incorporé al equipo de producto de Devengo en octubre del pasado año, se planteaban varios retos que afrontar en los siguientes meses. Por un lado, había que desarrollar un sistema visual que solucionara las necesidades de los equipos de producto, tecnología, marketing y ventas. Un sistema que creara, unificara y propagara de manera sistémica los recursos visuales que la marca necesitaba para avanzar en comunicación, ventas y producto. Por otro lado, se presentaba la necesidad de replantear el diseño de nuestros productos para dar cabida a las nuevas necesidades que las empresas que disfrutan de Devengo y sus trabajadores nos solicitaban. Hoy queremos contar cómo ha sido el proceso de este segundo reto y explicar algunas claves del rediseño de la interfaz de nuestras aplicaciones.

Metáfora de los vasos

Devengo mejora el bienestar financiero permitiendo a las trabajadoras y trabajadores acceder a su salario ya trabajado ¿Por qué esperar hasta final de mes para cobrar? Lo que has trabajado hoy ya es tuyo y con Devengo puedes ingresarlo en tu cuenta bancaria en unos segundos.

Hasta ahora, para resolver en la interfaz el flujo donde un usuario cobra su salario ya devengado, usábamos dos metáforas que se superponían en la pantalla principal de nuestra aplicación móvil. Por un lado, el significado del dinero generado, se trasladaba a una representación de vasos que se iban llenando a medida que el devengado era mayor. Por otro lado, se usaba un slider con forma circular para la interacción de solicitar el importe. Aunque estas representaciones visuales han resuelto a la perfección su cometido hasta la fecha, limitaban a futuro la escalabilidad y flexibilidad de las soluciones que ahora Devengo puede ofrecer. Es por esto que nos planteamos un cambio de metáfora, de relato y de diseño.

Metáfora del viaje

Una de las principales soluciones novedosas que implementa la nueva app es la posibilidad de disponer del devengado desde distintas fuentes. Quienes disfrutan de Devengo ya no solo pueden disponer del dinero de su nómina en curso, sino que pueden hacerlo también del dinero de las pagas extras, incentivos o cualquier otra forma en la que la empresa complemente su nómina. Es a esto a lo que hemos llamado Origen usando una metáfora donde el importe viaja desde donde se elija y hacia dónde se escoja. Esto es así porque, de manera paralela, el dinero solicitado podrá llegar a destinos diferentes al de una cuenta bancaria en próximas versiones. La metáfora del viaje, usada por algunos bancos y servicios de transferencias, se beneficia de un relato al que nuestro perfil de usuario está mucho más acostumbrado y en el que ya tiene una confianza depositada.

Visualmente, la interfaz cuenta ahora con tres secciones diferenciadas que responden a cada uno de estas tres etapas del viaje. El flujo para solicitar un Devengo comienza con una sección inicial donde el usuario selecciona el origen del dinero que quiere solicitar. Continúa con un slider horizontal —un patrón más habitual y sencillo de usar que el rosco anterior— donde poder seleccionar el importe. Y acaba con la elección de un destino y la propia acción de solicitud. De este modo, configuramos un viaje para nuestro dinero que, casi por arte de magia, tarda tan solo unos segundos gracias a las transferencias instantáneas con las que trabajamos en Devengo. Spoiler: no es magia. Es el trabajazo del equipo de tecnología que tenemos.

Un diseño para unirlos a todos

Devengo es una solución que, a diferencia de otros competidores, tiene la ventaja de disponibilizarse de diferentes modos. Además de una app móvil nativa para los dos sistema operativos, nuestra solución se presenta como un iFrame capaz de integrarse de manera flexible y transparente en otras soluciones que ya disfruten nuestras empresas clientes tanto en móvil como en escritorio. Hasta la fecha, iFrame y apps contaban con interfaces diferentes, lo que suponía una experiencia de usuario fragmentada y un esfuerzo doble por parte del equipo a la hora de implementar mejoras en el producto. Con el nuevo sistema visual Fides, todos los estilos y componentes se sintetizan y modulan para que ambas interfaces puedan aportar una experiencia unificada a quienes hacen uso de ellas y, a la vez, escalable y eficiente para el propio equipo de producto y tecnología de Devengo.

El viaje no acaba aquí

Fides, el nuevo sistema visual, nos permite seguir añadiendo productos y servicios a la interfaz previstos en el roadmap inminente de Devengo sin que la coherencia visual se vea resentida. 

Está siendo una magnífica aventura poder contribuir y aprender de un equipo tan preparado y profesional como el que hay en Devengo. Ha sido un placer poder escuchar a quienes ya disfrutan de la app de Devengo y atender a sus necesidades y estamos esperanzados en que esta nueva versión de nuestras aplicaciones les ayude aún más a mejorar su bienestar financiero.