Sistema de diseño

El Desafío

En Sygris, cada producto digital era diseñado con criterios visuales y componentes poco consistentes, lo que generaba:

• Falta de coherencia en la experiencia de usuario entre las distintas interfaces y clientes.
• Retrabajo constante para el equipo de diseño y desarrollo, ya que no existía una biblioteca centralizada de componentes.
• Dificultad para escalar productos y mantenerlos alineados con la identidad de marca.
• Procesos de diseño y desarrollo lentos, con muchas decisiones repetitivas que reducían la eficiencia del equipo.

Era necesario crear un sistema de diseño interno que unificara estilos, componentes y buenas prácticas, asegurando consistencia en la marca y acelerando el trabajo de los equipos.

Nuestra Solución

Lideré junto al equipo de diseño la creación de un Design System propio de Sygris, construido de forma colaborativa con empleados de distintas áreas.

1. Investigación y entrevistas internas
• Se identificaron los principales puntos de fricción en el diseño y desarrollo de productos.
• Se analizaron patrones existentes y se recopiló feedback de diseñadores y desarrolladores.
2. Definición de principios y guías de estilo
• Establecimiento de tipografía, paleta de color, iconografía y espaciados coherentes con la identidad de marca.
• Uso de colores suaves y fotografías de perros reales, para generar conexión emocional inmediata.
• Creación de guías de accesibilidad para asegurar experiencias inclusivas.
3. Biblioteca de componentes reutilizables
• Diseño y prototipado de botones, formularios, tablas, modales y layouts.
• Documentación de variantes y estados (hover, activo, error, etc.).
• Integración en herramientas de diseño (Figma) y sincronización con librerías de desarrollo (React/Angular).
4. Procesos de colaboración y gobernanza
• Se definieron flujos para proponer, aprobar y mantener componentes en el tiempo.
• Participación activa del equipo de desarrollo y managers para que el sistema fuera realmente adoptado por el equipo.
5. Escalabilidad y aplicación
• El sistema se diseñó para ser usado en todos los productos de Sygris, incluyendo nuevas interfaces y landings de campañas en el sitio web.
• Facilita la creación de prototipos rápidos y asegura consistencia visual sin reinventar la rueda en cada proyecto.

Resultados

Consistencia visual y de marca en todos los productos y campañas.

Ahorro de tiempo en diseño y desarrollo gracias a la reutilización de componentes..

Mejora en la comunicación entre equipos de diseño y desarrollo, con un lenguaje común.