Foris tiene cinco productos. Cada uno diseñado en momentos distintos, por equipos distintos, con criterios que nadie había escrito formalmente. El resultado era predecible: botones con cuatro variantes distintas del mismo estado, componentes duplicados con nombres diferentes, y desarrolladores que recibían pantallas y tenían que adivinar el resto.
Avocado existía como librería. Pero una librería sin proceso no es un sistema, es una colección de archivos que cada uno interpreta a su manera. El problema no era de componentes. Era de criterio compartido.
Cada vez que un designer necesitaba un componente nuevo, lo creaba. Sin revisión, sin validación, sin documentación. En seis meses el sistema tenía capas de deuda que nadie quería tocar. Y cuando llegaba un desarrollador, encontraba un Figma con notas incompletas y tenía que preguntar.
El problema de la documentación en cualquier design system es siempre el mismo: nadie la mantiene actualizada porque es trabajo extra. La solución que implementamos fue integrar AI en el proceso de creación de componentes para que la documentación se genere en el momento, no después.
Cada nuevo componente pasa por un flujo que extrae automáticamente sus propiedades, variantes, estados y casos de uso. El output es un archivo MD estructurado que vive junto al componente y que el desarrollador puede consumir sin abrir Figma.
Del componente en Figma al archivo MD, sin intervención manual del designer
Antes de la gobernanza, cualquier designer podía agregar un componente al sistema. Eso generaba el caos que encontramos. La decisión fue instalar un proceso de propuesta, revisión y aprobación antes de que cualquier componente entre a Avocado.
El handoff tradicional es una pantalla de Figma con anotaciones. El desarrollador la abre, interpreta espaciados, infiere comportamientos y pregunta. Con Avocado, cada componente entrega un archivo MD con especificaciones exactas y snippets de código listos para implementar.
La librería de AI dentro de Avocado tiene un sistema de tokens que mapea directamente a las variables del código. El desarrollador no traduce, implementa.
La diferencia entre Avocado antes y después no es visual, es de comportamiento del equipo. Los designers proponen antes de crear. Los desarrolladores implementan sin preguntar. Y los cinco productos de Foris comparten el mismo lenguaje visual sin que nadie tenga que coordinarlo manualmente.
Un design system no vale por la calidad de sus componentes. Vale por la calidad del proceso que lo sostiene.