Volver a Proyectos
Design System Cygnus
El Design system nació de la necesidad de establecer un sistema de diseño unificado para múltiples productos digitales dentro de la empresa. Antes de su implementación, cada equipo diseñaba y desarrollaba componentes de forma independiente, lo que generaba inconsistencias visuales, duplicación de esfuerzos y problemas de escalabilidad.
Tags
Design Systems UI Governance Component Library Escalabilidad Figma
Cliente
Desafíos
Falta de una base de componentes reutilizables y documentados.
Inconsistencia en la experiencia de usuario entre diferentes productos.
Dificultad para escalar nuevos diseños y funcionalidades sin afectar proyectos existentes.Rol y Responsabilidades
En este proyecto, participé en:
Creación de componentes reutilizables y accesibles.
Definición de reglas y principios para el uso de tipografías, colores y espaciados.
Implementación de nuevas funcionalidades para mejorar la usabilidad en los proyectos.
Documentación detallada para garantizar una adopción efectiva por parte de diseñadores y desarrolladores.
Investigación y Descubrimiento
Para garantizar que el Design System resolviera necesidades reales, se realizaron:
🔹 Entrevistas con diseñadores y desarrolladores para entender sus requerimientos y desafíos.
🔹 Benchmarking de otros sistemas de diseño líderes (Material Design, Atlassian, Carbon).
🔹 Definición de principios clave: modularidad, escalabilidad y accesibilidad.
Ideación y Diseño
El Design System se construyó con un enfoque centrado en la flexibilidad y la escalabilidad, asegurando que cada componente pudiera adaptarse a distintos productos sin perder coherencia.
🔸 Soluciones implementadas:
✔ Biblioteca de componentes: Botones, formularios, modales, inputs, etc.
✔ Tokens de diseño: Definición estructurada de colores, tipografía y espaciado.
✔ Componentes accesibles: Cumplimiento de estándares WCAG para mejorar la usabilidad.
✔ Documentación centralizada: Guía detallada de uso y código para facilitar la integración.
Desarrollo y Entrega
🔹 Colaboración estrecha con desarrollo para garantizar una implementación eficiente del storybook. 🔹 Pruebas de usabilidad en productos que adoptaron el sistema. 🔹 Iteraciones basadas en feedback para optimizar componentes y flujos.
Resultados y Aprendizajes
Impacto del proyecto:
✔ Reducción en tiempos de diseño y desarrollo al reutilizar componentes.
✔ Mayor consistencia visual y funcional en los productos de la empresa.
✔ Mejor adopción de principios de accesibilidad y usabilidad.
🎯 Aprendizaje clave: La creación de un design system flexible permite que los equipos lo adopten sin restricciones excesivas, facilitando su integración en productos con diferentes necesidades.
