La historia del rebranding del banco digital Monese

nuevo-antes-despued-logo-monese-2016

Monese es una empresa que fue fundada en el año 2015, con el ambicioso objetivo de ser una cuenta corriente móvil, instantánea, para las generaciones actuales.

Con la aplicación Monese, los clientes de toda Europa pueden abrir una cuenta corriente en el Reino Unido en tan sólo 120 segundos, sin los controles de crédito o las restricciones de residencia impuestas por los bancos tradicionales.

Monese fue el primer servicio de cuenta corriente móvil al 100% que se lanzó en el Reino Unido, en septiembre de 2015.

El nuevo diseño fue realizado por un equipo interno del banco en Inglaterra.

monese-anterior

Detalles del diseño anterior de Monese.

Monese es un servicio bancario sin sucursales que permite a los residentes del espacio económico Europeo abrir una cuenta bancaria local en tan sólo 120 segundos, incluso si el cliente no tiene una prueba de domicilio o tiene un historial de crédito pobre. Es por eso que existe Monese para ayudar a las 90 millones de personas en toda Europa que están «económicamente excluidas», porque los bancos tienen dificultades para identificarlos o darles crédito.

Como un producto financiero es esencial ganar la confianza de los usuarios y por lo tanto tener una identidad consistente y reconocible es primordial para el éxito de Monese.

construccion-marca-monese

Bocetos para la construcción de la identidad.

¿Por qué decidieron cambiar la marca?

Después de lanzar su aplicación en android y ver su base de usuarios crecer rápidamente, el lanzamiento en iOS era un paso obvio y fue allí donde vieron una oportunidad y un momento preciso para revisar y cambiar su aspecto.

Si bien tenían una identidad de marca, decidieron cambiar, sentían que la marca necesitaba reflejar mejor lo que habían aprendido de ver su producto utilizado de primera mano por los clientes reales – y su comprensión más profunda de las necesidades de los usuarios.

Aquí hay algunos más problemas que identificaron de la marca:

El logotipo no era una marca particularmente apropiada, se sentía un poco infantil con sus curvas demasiado amigables.

Nuestro uso de la tipografía de «Brandon» no nos dio una voz fuerte y es un exceso de uso por parte de muchas compañías de lanzamiento significó que nunca podría ser algo propio.

Había una mezcla de formas afiladas y redondeadas que eran inconsistentes y chocantes entre los elementos de la marca.

Nuestro uso extensivo del rojo creó un reto al mostrar estados de error en la aplicación de Monese.

Monese estaba creciendo y nuestra identidad necesitaba reflejar esto, mientras que tenía la flexibilidad de ser aplicada a través de múltiples puntos de contacto.3

 monese

storyboard de la marca

Empezamos el extenso trabajo sumergiéndonos en lo que Monese ya ha logrado y en lo que estamos avanzando. Trabajando a través de nuestros estudios en Londres, Reino Unido y Tallin, Estonia, nos conectamos con todos en la empresa para reunir opiniones sobre cómo cada uno de nosotros describiría nuestros valores.

En estrecha colaboración con los analistas de experiencia del usuario y los equipos de gestión, comenzamos por definir un guión gráfico de la marca.

Hablamos de cómo nuestros servicios bancarios están ayudando a las personas a ‘subir de nivel’ y progresar con sus vidas. Seguimos definiendo nuestros valores. Tomamos esto muy en serio, ya que estos irían a formar el núcleo de nuestra personalidad y actuar como un campamento base al que acudiríamos por cada decisión de marca que haríamos.

La lista que creamos fue un comienzo útil, pero había demasiado para recordar. Al final logramos destacar tres valores fundamentales.

Progresivo

En Monese siempre estamos mirando hacia el futuro, manteniéndonos un paso adelante utilizando la nueva tecnología para ayudar a nuestros clientes.

Humano

Vemos el valor de los seres humanos, individual y colectivamente. No tenemos juicio con nuestra audiencia, lo que nos distingue de otros bancos más tradicionales.

Confiable

Proporcionamos un hogar seguro para su dinero y somos abiertos y transparentes con nuestros clientes. Tenemos una actitud accesible y siempre estamos listos para responder preguntas.

 

El proceso

El equipo del banco utilizó períodos de cuatro días para cumplir con objetivos, examinando sus valores y explorando ideas para un mayor desarrollo.

Al final de cada ciclo, revisaban todo; compartían ideas a través de este péqueño proceso.

«Hicimos esfuerzos iniciales para reparar nuestra marca existente. Cuanto más lo abordábamos, más comprendíamos las debilidades fundadoras que nos retenían. Necesitábamos un conjunto claro de valores y una nueva identidad para expresar mejor el significado de nuestra oferta.

Como un equipo pequeño sabíamos que una re-marca completa iba a ser un reto, pero si alguna vez fuéramos a hacerlo, este era el momento perfecto. Nuestra misión era unificar la compañía alrededor de una historia común de la marca, para formar conexiones más fuertes con nuestra audiencia y proporcionar una base sólida para el crecimiento futuro».

Página del proyecto de Monese.

monese-detalles

Monese detalles del logotipo.

Diseñar nuestra marca

En Monese tienen el objetivo de ayudar a sus clientes a moverse libremente en sus vidas proporcionándoles un servicio bancario fácil de utilizar y seguro.

Querían diseñar una marca que reflejara esto y comunicara sus valores -progresivos, humanos y dignos de confianza-. Empezaron a dibujar…

«Después de explorar varias rutas, refinamos nuestras decisiones, y comenzamos a elaborar nuestra elección preferida. Pasamos por muchas iteraciones para asegurar que nuestro logotipo final transmitiría las cualidades de cada uno de nuestros valores de marca.

Hemos decidido una combinación de líneas de interconexión que fluyen para formar una marca única que refleja lo que somos como – seguro, dinámico y humano. Para añadir un tacto suave a la marca agregamos esquinas redondeadas que la hacen sentir más humana y fluida». Comunicado de prensa de Monese.

monese-construccion

Construcción del logo y su tipografía.

monese-fuente

monese-fuente2

Detalles de la tipografía.

Tipografía

Mientras trabajábamos en el diseño de la marca comenzamos a explorar tipos de letra. El principal problema con nuestra tipografía actual era que se sentía demasiado peculiar – no es algo a lo que confiarías tu salario. Aunque estaba bien diseñada y era ligeramente redondeada una forma sans serif funcionó bien para nosotros en las primeras etapas de la empresa, carecía de madurez – necesitaban una buena voz para reflejar esto.

Decidimos trabajar sobre la tipografía «FF Mark». Recientemente diseñada en 2013, las formas fueron dibujadas a partir de algunos de los sans-serifs más exitosos de la historia, pero se siente contemporánea y justo para nosotros en el paisaje de diseño moderno.

Cada glifo ha sido cuidadosamente diseñado para darle un borde fuerte, simple y audaz, pero sus curvas le dan un ambiente tranquilizador y amigable que ayudan a casarse bien con las formas redondeadas de la nueva marca de logotipo de Monese.

Una gran parte de nuestra audiencia no son hablantes nativos de inglés, lo que significó que la legibilidad fue fundamental para nuestra decisión. La gran altura x de Mark le ayuda a trabajar claramente en pequeños tamaños dentro de los elementos de la interfaz de usuario y su conjunto versátil de pesos le da flexibilidad para trabajar en varios puntos de contacto de la marca.

En general nos sentimos que Mark es la elección correcta, ya que eleva nuestra voz de marca para tener un tono fuerte y confiado.3

monese-colores

Combinación de colores.

monese-interactiva

Paleta de colores utilizada en la identidad.

Paleta de colores

Queríamos que nuestra paleta se sienta vibrante y fresca, mientras que también utilizando colores que podrían comunicar claramente elementos de nuestro servicio bancario a los hablantes no nativos de Inglés, por lo que nuestras opciones tenían que ser funcional, así como la estética.

Miramos los diversos estados de información que necesitaríamos para comunicarnos dentro de nuestra aplicación y seleccionamos un conjunto flexible de colores que ayudaría a mejorar la usabilidad.

El azul punzante, verde y amarillo de nuestra nueva paleta primaria transmiten mucha más vida que nuestra paleta pálida y silenciada, que consideramos una voz mucho más adecuada para Monese. Uno de nuestros primeros probadores dijo que «no se siente pesado como otras aplicaciones bancarias».sup>3

monese-animaciones

Algunas animaciones utilizadas.

monese-desarrollo

Desarrollo y prueba de la app de pago.

Definición de una interacción de firma

Como somos un producto digital creemos que un sistema de marca fuerte debe ser algo más que un identificador, y debe determinar el comportamiento del producto. Como servicio bancario, una de las interacciones más importantes que nuestros usuarios tienen con el producto, es la capacidad de realizar un pago. Decidimos enfocarnos en esta interacción y convertirla en una característica central de nuestra marca.

Examinamos varios tratamientos y examinamos cómo podían trabajar con la animación.

Después de revisar las animaciones, pasamos a prototiparlas con javascript y realizar algunas pruebas de usuario, ya que era importante que la animación no interfiriera con la acción misma.

Prototipado y prueba de la interacción de pago

Mantener la interacción simple fue clave, para asegurar su usabilidad y evitar el estilo sobre la sustancia. Hemos introducido un fluido de arrastre línea mecánica, que se revela como el usuario se desliza hacia abajo para hacer un pago. El movimiento elástico y fluido inyecta más personalidad y una sensación de placer en la interfaz.

monese-animacion2

Algunas animaciones de la tarjeta y la app.

monese-app

Detalles de la app y del pago.

Desarrollo del sistema

Mirando más lejos, exploramos cómo las líneas de pago podrían expandirse como un sistema visual cohesivo. Hemos creado texturas gráficas mediante la formación de una gran red de líneas de arrastre para comunicar múltiples pagos en movimiento. Recortar en esta red crea una gama de expresiones, desde medido y preciso, hasta vibrante y expresivas.

Los comentarios de los usuarios que habíamos recopilado en nuestra antigua tarjeta de débito mostraban que algunos clientes pensaban que la tarjeta anterior no se sentía como un producto bancario legítimo. Sobre la base de esta retroalimentación, hemos decidido diseñar una tarjeta oscura más atractiva. Las líneas de interconexión del patrón comunican el progreso continuo de los pagos a través de la plataforma Monese.

Nuestro nuevo paquete de tarjetas de débito

Como Monese es un producto dirigido en gran medida a personas que se mueven, pensamos que sería apropiado dar a nuestra identidad un verdadero sentido del movimiento. Queríamos que el sistema se sintiera como si se estuviera moviendo, como para mostrar ser parte de ese movimiento. De esta manera podríamos realmente comunicar nuestro valor de ser progresistas.

Las formas expresivas tienen una sensación fluida y humana que es consistente a través de las formas que se encuentran en la marca del logotipo y los elementos de interfaz de la aplicación.

monese-artes

Diferentes gráficos juntos.

monese-aplicaciones

Diferentes aplicaciones en vallas y bolsas.

Rediseño de la aplicación

Junto con la actualización de la marca, hemos rediseñado completamente la aplicación para Android e IOS. Queríamos que la interfaz se sintiera brillante y fresca, y ser fácil de navegar a través. Trabajando con el equipo de UX, pensamos cuidadosamente en cada elemento para asegurar que cada decisión tenía un propósito claro para el usuario.

Usando ilustraciones, trajimos elementos para sorprender y deleitar al usuario, y también introdujimos un gráfico interactivo con un estilo de línea similar al del logotipo. Todos los iconos fueron rediseñados para tener una forma más amigable y redondeada, e introdujimos un estilo de línea de tiempo para mostrar las transacciones de la pantalla de inicio.

monese-iconos-animados

Iconos animados.

monese-apps

Detalles de la app.

Nuestra interfaz recién rediseñada.

Ilustraciones y personajes

Hemos introducido un nuevo estilo de ilustraciones, y un conjunto de personajes para ayudar a explicar partes de la aplicación, y añadir un sentido juguetón. Los personajes ayudan a tranquilizar al usuario de lo accesible que somos como empresa, siempre estando aquí para ofrecer una amable ayuda.

Como ejemplo; Al inscribirse en una cuenta de Monese, los usuarios tienen que esperar a que se revisen sus documentos de identificación. Presentamos una animación de un escáner que está leyendo sus documentos. Después de un corto tiempo, uno de los personajes salta en el escáner y sale con un bronceado spray! Esperábamos que esto le diera al usuario una pequeña recompensa por esperar, e incluso podría hacer que desearan esperar a que la animación se volviera a repetir para verla.

monese-ilustraciones

monese-ilustraciones-animadas

Por último ilustraciones que acompañan la identidad.

El resultado

¿Para volver a nuestras razones iniciales para revisar nuestra identidad visual? – «previamente sentimos que la vieja marca de Monese terminó encima de ser demasiado simplista y poco confiable. No sólo un logotipo excesivamente blando no coincidía con patrones e ilustraciones parecidos a polígonos que emitían un tono mixto, pero en última instancia no se sentía lo suficientemente única como para llamar a los nuestros.

Ya que hemos abordado todas estas cuestiones – De un logotipo más fuerte y más confiable a una paleta de colores más amigable – Confiamos en nuestra nueva identidad que proporcionará a Monese una base para seguir creciendo en el largo plazo. Ya ha sido adoptado con entusiasmo por todos los equipos de nuestra empresa y sólo podemos esperar que nuestros clientes acogerán con satisfacción el cambio.

monese-neon

Por último una imagen con el logo con neón.

Referencias:

  1. «About Us» Monese.com
  2. «Monese Launches In U.K. To Let Immigrants And Expats Get A Mobile Banking Account» TechCrunch.com
  3. «Rebranding a digital bank: The story behind our new look«, Prototypr.io