Pasar al contenido principal
21.10

Un Design System para gobernarlos a todos

palabra de experto

¿Cómo acelerar en el ámbito digital y mejorar la experiencia de cliente cuando eres el segundo laboratorio dermocosmético del mundo con filiales en 45 mercados y una red de distribución activa en más de 116 países?
Y sobre todo, ¿cómo conseguirlo garantizando una experiencia coherente, atractiva y eficaz, optimizando a la vez el tiempo de comercialización?

Con este objetivo, el grupo Pierre Fabre acudió a nosotros para construir juntos el nuevo ecosistema digital del grupo para todas sus marcas.

PF Image

 

Pierre Fabre, el gigante farmacéutico francés, es el padre de la dermocosmética, y por tanto, está especialmente presente en el ámbito de la salud y la belleza.

En 2020, como parte de un proceso de aceleración digital global, Pierre Fabre recurrió a la experiencia de Wide para ayudarles a optimizar su experiencia de cliente.

Los objetivos 

  • Desarrollar la presencia on línea de las marcas del grupo.
  • Reforzar el ámbito de la marca, el compromiso y la conversión.
  • Profundizar en el conocimiento del cliente.

Nuestro papel ha consistido en imaginar y diseñar las trayectorias omnicanal de todas las marcas del grupo, integrando al mismo tiempo una lógica de racionalización para optimizar los costes y el tiempo de comercialización.

Para ello, decidimos construir un design system que nos permitiera desplegar una experiencia de cliente coherente y eficaz en todos los puntos de contacto digitales de las distintas marcas del grupo.

Marques PF

 

Uno de los principales retos era adoptar un enfoque de racionalización para

  • INDUSTRIALIZAR la creación de sitios de marca a nivel mundial.
  • REUTILIZAR los contenidos en todos los canales y facilitar la localización según el país.
  • OPTIMIZAR la experiencia del consumidor, la sinergia entre las dimensiones del comercio electrónico y la marca.
  • MUTUALIZAR las herramientas, los recursos técnicos y la experiencia.
  • MULTIMARCA para garantizar la sostenibilidad de la plataforma y formar parte de la estrategia de crecimiento del grupo.

Trabajamos en la integración del design system en una plataforma de creación de sitios para que todos los activos de la marca estuvieran disponibles de forma fácil e inmediata.

Los problemas de rendimiento y de conversión también eran una de nuestras principales preocupaciones. La plataforma debía mejorar el ROI y contribuir al crecimiento de las ventas en el canal digital de todas las marcas del grupo Pierre Fabre.

Un enfoque centrado en el usuario

A nivel metodológico, para nosotros era fundamental la integración del usuario final en todo el proyecto. Para ello, llevamos a cabo una fase de investigación en profundidad con el fin de comprender el recorrido del usuario dentro del ecosistema existente, sus necesidades y sus dificultades. A continuación, pudimos proyectar y diseñar nuevos recorridos más eficaces, probándolos con más de 500 usuarios para garantizar su pertinencia.

El modelo Core

Para construir la primera base del sistema de diseño, trabajamos con dos marcas piloto emblemáticas y representativas de todas las marcas del grupo: Eau Thermale Avène y René Furterer.

Para abordar las cuestiones de racionalización, no planteamos un sistema de diseño único, sino una lógica basada en un sistema de diseño maestro (al que llamamos Modelo Central) que luego sería adaptado a cada marca.

Fijamos una proporción del 80% de elementos genéricos comunes a todas las marcas, frente al 20% de elementos específicos, incluyendo la identidad gráfica y ciertos requisitos funcionales concretos.

Brand design systems

Los sistemas de diseño de marcas se crearon a partir de una duplicación del Modelo Central, pero el contenido genérico (descripciones, especificaciones de los componentes, etc.) permanece almacenado sólo en el Modelo Central gracias a la función de contenido referenciado de Frontify

Ciclo de vida del modelo Core

Este enfoque del modelo básico también nos permitirá poner en común los desarrollos futuros y entrar en un proceso de mejora continua que beneficiará a todas las marcas.

Core Model

Para simplificar, nuestro Modelo Básico consiste en una biblioteca de componentes y plantillas asociadas a pautas de uso e integradas en una plataforma dedicada a los sistemas de diseño: Frontify

Design system

Hemos utilizado los principios del diseño atómico para estructurar los diferentes elementos del Modelo Básico.

Las etapas del diseño

Para construir el Modelo Básico y los sistemas de diseño de las diferentes marcas, recorrimos una serie de pasos clave:

  • Definición de la estrategia de experiencia y de los principios que guiarían nuestro trabajo de diseño.
  • 5 sprints de diseño para crear todas las plantillas necesarias para abordar cada uno de los recorridos de los usuarios basados en las dos marcas piloto.
  • Cada bloque o componente se identificó y luego se racionalizó en un enfoque de modelo central.
  • Las plantillas y los bloques se convirtieron en un modelo gráfico mobile y desktop para cada una de las marcas.

Todos los elementos del modelo principal han sido diseñados de forma responsiva, e incluyen una capa de SEO, así como capacidades de personalización para integrar fácilmente diferentes identidades de marca.

Core Model Avène & Furterer

Para alojar el modelo central y los sistemas de diseño de las marcas, necesitábamos una plataforma robusta y flexible que pudiera adaptarse a la arquitectura específica que habíamos imaginado para este proyecto.

El rol de la plataforma

le rôle de la plateforme

Optamos por utilizar Frontify porque satisfacía perfectamente nuestras necesidades y además nos permitía :

  • Controlar los costes de desarrollo y mantenimiento gracias a su enfoque SAAS.
  • Beneficiarnos de una herramienta que se enriquece continuamente.
  • Proporcionar un marco, basándonos en las mejores prácticas del mercado.
  • Beneficiarnos de un apoyo dedicado y de una comunidad comprometida.
  • Integración más fácil con las herramientas de terceros que utilizamos (sketch, git, invision, etc.)
Product detail template

Resultado

Una base sólida y eficiente a disposición de todas las marcas y socios que servirá de base para el desarrollo de todo el ecosistema digital de las marcas en los próximos 3 años.

one core model

Una estrecha colaboración

Un proyecto de este tipo sólo puede lograrse si todos los actores comparten una visión común y un fuerte compromiso a lo largo del proyecto. Tuvimos la suerte de trabajar con un cliente que confió en nosotros y con el que pudimos construir una verdadera asociación. El rigor y la profesionalidad del equipo Pierre Fabre y de las marcas piloto con las que hemos trabajado han sido factores clave para el éxito de este proyecto.

Creamos experiencias 

que fortalecen tu marca 

y hacen crecer tu negocio.​

¡Conócenos​!