Donde nacen los diseños — y cómo los entregamos limpios al código. Variables, Auto-Layout, Branching.
Categoría · Frontend y UI
Donde nacen los diseños.
Figma es la herramienta de diseño colaborativa que funciona en el navegador y en la que varias personas trabajan a la vez. Para nosotros no es solo una herramienta de dibujo, sino el puente entre el diseño y la implementación.
El Auto-Layout reproduce el comportamiento de Flexbox, las Variables definen design tokens y el branching permite mantener versiones de diseño en paralelo al desarrollo.
Un handover limpio hacia el código.
El valor surge en el handover. Cuando las Variables de Figma y los tokens del código comparten los mismos valores, el diseño deja de ser un margen de interpretación y se convierte en una plantilla traducible 1:1 a componentes. El Auto-Layout deja claro cómo se comporta un elemento en distintos tamaños.
Lo que una herramienta no resuelve.
Figma no genera código listo para producción, y los layouts exportados no sustituyen a un modelo de componentes bien pensado. Sin una nomenclatura disciplinada de Variables y Components, hasta un archivo bonito se convierte en un obstáculo en el handover.