CASO DE ÉXITO

Bayer Design System: coherencia global, flexibilidad local

Bayer
Bayer Design System: coherencia global, flexibilidad local

Áreas

Sistemas de diseño. Experience design. Strategic alignment. Dual Track Agile. Metodologías ágiles

Cómo diseñar un sistema capaz de conectar una marca global con cientos de realidades locales.

El reto: un ecosistema digital global

Bayer necesitaba transformar su ecosistema digital para dar respuesta a una realidad compleja: más de 80 mercados, cada uno con sus propias regulaciones, idiomas y sensibilidades culturales.

El objetivo era crear una plataforma global capaz de generar sitios web corporativos y de producto, adaptables a cada contexto local, maximizando la eficiencia operativa y la autonomía de los equipos.

Bayer Design System: coherencia global, flexibilidad local

Solución: un sistema para evolucionar, integrar y crecer

Desde Runroom asumimos la responsabilidad de definir e implementar el diseño visual y de experiencia de toda la plataforma, así como la arquitectura, gobernanza y operaciones del Design System que la hace posible.

Nuestro equipo, formado por un Design Team Lead y cuatro Product Designers especialistas en Design Systems, trabaja de forma continua con los equipos de producto y tecnología de Bayer para construir una infraestructura de diseño escalable, agnóstica y viva.

El Design System se construye en Figma y se implementa mediante React y Next.js, conectado a un backend Drupal headless. Un sistema pensado para evolucionar, integrar y sostener el crecimiento del producto digital en todos los mercados.

Cómo trabajamos: diseño estratégico y ejecución operativa

El equipo combina diseño estratégico y ejecución operativa a través de distintos flujos de trabajo:

  • Squad tickets: colaboración con frontend y backend en sprints de dos o tres semanas.
  • Design maintenance: actualización y documentación continua del sistema.
  • Design support: soporte a agencias, revisión de accesibilidad y documentación.
  • Onboardings: formación a equipos y agencias locales.
  • Theme requests: personalización de temas visuales por marca o línea de producto.
  • Research continuo: observación del uso real del sistema para detectar fricciones y oportunidades.

Este modelo permite hacer evolucionar el producto de forma continua, dando soporte a los distintos mercados a través de documentación, soporte directo y la creación de themes que amplían la flexibilidad del sistema.

Desde el lanzamiento, la plataforma se ha desplegado ya en más de 40 mercados, avanzando de forma progresiva y sostenida para validar, aprender y adaptarse a las realidades locales antes de cada nueva implementación.

Bayer Design System: coherencia global, flexibilidad local
"El gran desafío del proyecto fue evolucionar de una mentalidad muy prescriptiva a un enfoque más neutral y escalable. Diseñar para decenas de mercados, de marcas y países con usos y contextos completamente diferentes, implica ofrecer un marco consistente pero profundamente adaptable. Ese giro fue fundamental para el proyecto."
Guillermo Laseca, Design Lead

El equilibrio entre robustez y flexibilidad

Uno de los mayores desafíos del proyecto ha sido encontrar el punto justo entre robustez y adaptabilidad. Un sistema demasiado rígido limita la expresión local; uno demasiado flexible puede comprometer la consistencia del producto, generando desarrollos ad hoc, mayores costes y pérdida de eficiencia.

A través de una colaboración constante con el equipo técnico de Bayer y con Element, estamos ampliando la personalización del sistema sin comprometer su estabilidad ni su capacidad de evolución.

Bayer Design System: coherencia global, flexibilidad local

Una ciudad modular

Diseñar este sistema ha sido como planificar una ciudad modular:

  • Los cimientos (principios, tokens y componentes base) garantizan estabilidad.
  • Las normas urbanas (gobernanza, documentación y procesos) aseguran coherencia.
  • Cada barrio (mercado o marca) puede adaptarse a su contexto sin romper la estructura común.

En nuestro caso, esta modularidad se materializa a través de un núcleo agnóstico y estable, sobre el que se aplican themes que permiten expresar distintas identidades de marca sin comprometer la integridad del producto.

Un sistema de diseño trae orden al caos.

No es un repositorio de componentes, sino un lenguaje compartido que conecta personas, herramientas y procesos. Como todo organismo vivo, evoluciona con la organización, aprende de su uso y se redefine con cada iteración.

En Bayer, este sistema de diseño no solo acelera la creación de nuevos sitios, sino que también reduce las demandas por parte de cada mercado local, acelerando las fases de diseño de los nuevos sites en más de un 50%, impulsa la autonomía local y consolida una cultura digital compartida.

Bayer Design System: coherencia global, flexibilidad local

Aprendizajes sobre Design Systems

  • DesignOps es clave para sostener y escalar un sistema de esta magnitud.
  • El feedback constante de mercados y agencias locales impulsa su evolución.
  • La flexibilidad tiene un coste, y gestionarla con estrategia evita la fragmentación del producto.
  • La adopción depende de la claridad: un buen sistema es aquel que resulta fácil de entender, usar y mantener.
  • El éxito en Design Systems no es un entregable, sino un sistema vivo que se mantiene útil, coherente y humano.
Bayer Design System: coherencia global, flexibilidad local
"El verdadero impacto de este proyecto no está solo en haber construido un Design System robusto, sino en haber creado un lenguaje común capaz de conectar una marca global con las necesidades reales de cada mercado. Hemos demostrado que la coherencia y la flexibilidad no son fuerzas opuestas, sino dos pilares que, bien orquestados, permiten escalar un producto digital de forma sostenible, humana y con propósito."
César Úbeda, CXO & Partner en Runroom
Compartir:Linkedin/Bluesky

Más casos de éxito

Kern Pharma Indukern case study

Kern Pharma - Grupo Indukern

En solo cinco semanas, Grupo Indukern pasó de gestionar pedidos internos mediante Excels y correos electrónicos a lanzar un MVP de producto digital para empleados con impacto real en la experiencia, la trazabilidad y el negocio.Un proyecto que demuestra cómo, combinando Discovery Express, métricas de impacto y delivery técnico, es posible validar hipótesis complejas en sectores regulados sin sobredimensionar la inversión inicial.

Voz del cliente para optimizar la experiencia en la empresa líder en seguros

Aseguradora líder en España

Nos enfrentamos al reto de unificar la Voz del Cliente desde diversos puntos de contacto y canales en el sector de seguros. Desarrollamos e implementamos un programa integral para centralizar el feedback y ofrecerle una visión completa de la experiencia de sus clientes. El resultado fue una plataforma unificada que permitió a la compañía identificar oportunidades de mejora y accionar de forma rápida, impactando significativamente en las métricas de satisfacción.

La interfaz invisible: Alexa lee eldiario.es

Runroom I+D

La interacción de voz, o la interfaz invisible, es uno de los mayores desafíos en UX desde la aparición del smartphone. Un cambio disruptivo en UX que abre una inmensa gama de nuevas oportunidades en nuestra profesión y nos obliga a una reflexión crucial para analizar y comprender cómo hablamos con nuestros dispositivos. Presentamos la nueva skill de Alexa para eldiario.es.

Plataforma digital para Hospital Clínic

Hospital Clínic

Hospital Clínic es un hospital universitario de referencia internacional en asistencia, docencia e investigación. Ante la creciente demanda de información fiable y rigurosa sobre salud y la desconfianza generada por la dispersión de las fuentes online, les acompañamos en la creación de una plataforma digital para facilitar el servicio asistencial y empoderar al paciente en la toma de decisiones sobre salud.

Contacto

Completa el formulario y nos pondremos en contacto contigo para explorar cómo podemos hacer crecer tu negocio.