Onde os designs nascem — e como os passamos limpamente para Code. Variables, Auto-Layout, Branching.
Categoria · Frontend & UI
Onde os designs nascem.
O Figma é a ferramenta de design colaborativa que corre no browser e na qual várias pessoas trabalham em simultâneo. Para nós, não é só uma ferramenta de desenho, mas a ponte entre o design e a implementação.
O Auto-Layout reproduz o comportamento do Flexbox, as Variables definem design tokens, e o branching permite ter estados de design em paralelo com o desenvolvimento.
Entregar de forma limpa ao código.
O valor surge no handover. Quando as Variables do Figma e os tokens no código têm os mesmos valores, o design deixa de ser margem de interpretação e passa a ser um modelo traduzível 1:1 em componentes. O Auto-Layout deixa claro como um elemento se comporta em diferentes tamanhos.
O que uma ferramenta não resolve.
O Figma não gera código pronto para produção, e os layouts exportados não substituem um modelo de componentes bem pensado. Sem uma nomenclatura disciplinada de Variables e Components, até um ficheiro bonito se torna num obstáculo na entrega.