Construyendo un Design System escalable multi-producto para unificar la experiencia y acelerar la entrega

Triggle es una empresa SaaS especializada en tecnología de viajes B2B, potenciando plataformas de reservas para hoteles y proveedores. A medida que la suite de productos crecía, la consistencia de diseño y código empezó a divergir entre múltiples repositorios y equipos.

Diferentes squads construían componentes de forma independiente, lo que resultaba en patrones duplicados, inconsistencias visuales y sobrecarga de mantenimiento. La falta de documentación y tokens compartidos ralentizaba la velocidad de diseño e ingeniería.

El Reto

Necesitábamos unificar UI y UX en tres productos principales - Hotels Backoffice, Supplier Platform y Core Admin - asegurando escalabilidad, accesibilidad y un handoff eficiente entre diseño y código.

Realizamos una auditoría en todos los repositorios front-end, identificando componentes duplicados y estilos desalineados. Alrededor del 38% de la UI era compartida pero no estaba centralizada, lo que evidenció la necesidad de una librería central.

A través de workshops con stakeholders, definimos los objetivos del Design System: unificar la experiencia, reducir el esfuerzo de QA, mejorar la accesibilidad y acelerar la entrega. La estrategia se centró en una adopción incremental en lugar de un despliegue masivo.

Evolucionamos de un UI kit estatico a un Design System completamente gobernado con design tokens, releases versionados, flujo de contribución y analíticas de uso. La documentación se centralizó y las notas de release mejoraron la visibilidad entre equipos.

El sistema se estructuro en ramas Core y de Producto (Hotels y Supplier), permitiendo componentes compartidos a la vez que variaciones específicas de dominio. Esto sentó las bases para un sistema multi-producto escalable (madurez parcial L4).

Gobernanza y Colaboración

Definimos reglas de contribución, cadencias de release y versionado de componentes. Un grupo de gobernanza (Diseño + Front-end) aseguraba la paridad diseño-código, revisando cada nueva adición en cuanto a calidad y cumplimiento de accesibilidad.

El Design System se convirtió en la base de cada nuevo producto de Triggle, dotando a diseñadores y desarrolladores de patrones, tokens y documentación compartidos. Su escalabilidad permitió el desarrollo simultáneo entre marcas sin perder coherencia.

Las métricas son estimaciones internas basadas en retrospectivas del equipo. El nivel de madurez de diseño se referencia contra el framework infa.ai/learn/maturity. Estas cifras no han sido auditadas formalmente.

Empezar en pequeño resultó clave. Al lanzar versiones incrementales, la adopción creció de forma natural. El enfoque en la propiedad compartida fomentó la contribución y evitó el cuello de botella típico de 'solo el equipo de diseño' común en iniciativas de DS.

Más allá de los componentes, el Design System se convirtió en una herramienta cultural. Alineó a diseñadores, desarrolladores y PMs en torno a estándares compartidos, acelerando la toma de decisiones y elevando el listón de calidad en toda la suite de productos de Triggle.